/learn-react

React learning pipeline projects

Primary LanguageJavaScript

REACT JS Crash Course

This repository contains projects and tasks for students learning react. Also, follow the official docs for more info.

Day 1: Setting up the JS Project

  • Learn JS
  • Learn EcmaScript
  • Learn node.js project structure
  • NPM overview
  • Learn package.json file uses

Day 2: React Project Setup

  1. Creating a node.js project
  2. Bundling and Transpilation
  3. Creating a React app
  4. React Project Structure

Day 3: React Overview

  1. React Components
  2. How Component Renders in the Browser (Understanding JSX and JSX transpilation)
  3. Creating and importing components
  4. Class vs. functional components
  5. Pure components

Day 4: Type of Rendering in React

  1. Client Side Rendering (CSR)
  2. Server Side Rendering (SSR)
  3. Server Side Generation (SSG) See CSR vs SSR vs SSG.

Day 4: State and Props

  1. Managing state with the useState hook
  2. Passing data with props
  3. Utilizing the children prop
  4. Project: Simple TODO LIST

Day 5: Refs in React

  1. React.createRef
  2. React.useRef hook
  3. forwardRef

Day 6: Data fetching in React

Day 7: Form and Event handling

Day 8: React Context API

Day 9: Global state with useReducer hook and useContext hook

Day 10: Global state with useReducer hook and useContext hook

From day 10 onwards you can view the incremental chanages in branches eg: day_10, day_11 etc.

Day 11: Performing CRUD operations with a RESTful API

Day 12: Routing

Day 13: Routing, useMemo and useCallback hook

Day 14: Routing and Suspense API

Day 15: Styling

Day 16: Modifying website metadata

Day 16: Setting up Next JS Project