React JS & TypeScript: Build Real Projects + Redux Toolkit

Learn the basics of JavaScript variables—let for mutable values, const for immutable references, and var as a legacy approach—plus object and array examples.

Compare arrow functions and traditional functions, using map to double numbers and create new arrays. Discover how arrow functions are shorter and clearer, with optional parentheses in practice.

Apply the map method to transform an array, doubling numbers and extracting names from a user list, while accessing the callback's index to illustrate element positions.

Build a student score tracker app to add and update students, calculate class average, and display top performers using destructuring, spread, array methods, and optional chaining.

Learn JSX, the JavaScript XML syntax in React, and write code inside JavaScript, use a single root element or fragment, embed expressions with curly braces, and render lists with keys.

Learn practical JSX syntax in React by building a first component, mastering a single root element, conditional rendering, list rendering with keys, and common JSX pitfalls using real coding examples.

Build a travel to-do list app with React JS and TypeScript. Add, toggle, and delete tasks across packing, planning, and activities with local storage persistence.

TypeScript acts as the superhero sidekick to JavaScript, catching mistakes as you type and providing editor autocompletion and instant error detection for easier debugging in big apps.

Start a TypeScript project with TSX and yarn, then explore typed variables, interfaces, and union types. Use watch mode to see real-time type checks and prevent runtime errors.

Explore a live demo of a Shopify quiz app built with React and TypeScript, featuring category selection, quiz flow, score results, and name persistence across refreshes.

Learn to build a static quiz page using a reusable quiz container and quiz card components in React TypeScript, featuring questions, options, selected answer state, and a next button.

Create a useCopyToClipboard custom hook in React to copy text with an async function, track copied state, and expose copied and copy function for reuse across the app.

Implement google sign-in with firebase auth, clean up and organize the login flow with email/password, navigate to private pages, and add error handling for sign-in operations.

Refactor the app into a scalable features/auth structure and rename sign-in and sign-up pages. Create a house layout to host forms and update app.tsx routes.

Enhance error handling by adding a dismissible alert with a close button for login and signup errors, using a react-icons alert component, installing the library, and rendering contextual messages.

Style a React TypeScript app by building a responsive navbar and login flow, then fetch and display blog blocks from Firestore using a blog card component.

Build a blog details page in React with TypeScript, using useParams to fetch a post by id from Firestore and render its title, content, and id.