a-walk-in-react

Table Of Contents

DAY 01

• Introduction of React
  • What is ReactJS?
  • Main features of React
  • What does it mean to be declarative?
• Setup
  • Requirements
  • Create-react-app
  • Vite
  • Recommended extensions for VSCode
• Create-react-app(CRA) vs Vite

DAY 02

• Components
  • My first component
  • Reusable components
  • JSX
• Props
  • What are props
  • Props default value
  • Props as children
• Class Based Components (legacy)
  • Class based vs Functional components

DAY 03

• Hooks
  • What is a Hook
  • Hook Rule
• State
  • useState Hook
  • What does the useState call do?
  • What do we pass to useState as an argument?
  • When to use it?
  • Import useState
  • Initialize useState
  • Read State
  • Update State
  • What Can State Hold
  • Updating Objects and Arrays in State
• Effects
  • useEffect Hook
  • What are side effects
  • When to use it
  • Dependencies
  • The useEffect Cleanup function

DAY 4

• Rendering Techniques
  • Conditional rendering
  • Rendering lists
    • Rendering data from arrays
    • Filtering data
    • Key prop
• Styling React components
  • Inline style
  • CSS stylesheet
  • CSS modules
  • Dynamic styles
• Events
  • Listening to event handlers

DAY 5

• Forms in React
• React Context API
  • createContext
  • useContext Hook
  • Context provider
• Global State Management

DAY 6

• Other React built-in hooks
  • useRef
  • useReducer
  • Performance Hooks
    • useMemo
    • useCallback
• React Custom Hooks
  • What are they
  • How to create them
  • How to use them

DAY 7

• React Router Library
  • Installing React Router
  • Defining routes
  • Navigate between routes
  • Error pages
  • Dynamic routes
  • Protected routes

DAY 8

• Debugging React apps
  • React DevTools
• Testing React apps
  • Different kinds of tests
  • Tools
  • Writing our first test
  • Testing Asynchronous Code
  • Working with mocks
• Deploying React apps
  • Steps
    1. Test and optimize your code.
       • Lazy loading
    2. Build the Application
    3. Deploy