learn-react-by-doing

Parcel

• Dev Build
• Local Server
• HMR = Hot Module Replacement
• File Watching Algorithm - written in C++;
• caching - Faster Builds
• Image Optimization
• Minification
• Bundling
• Compress
• Consistent Hashing
• Code Splitting
• Diffrential Bundling - support older browsers
• Diagnostics
• Error Handling
• HTTps
• Tree Shaking - remove unused codes
• Different dev and prod bundles

Food Ordering App

/*

• Header
• • Logo
• • Nav Item
• Body
• • Search
• • Restaurant Container
• • Restaurant Card

• - image
  

• - restaurant name
  

• - star Rating
  

• - Details
  

• Footer
• -Copyright
• • Links
• • Address
• • Contacts */

Two types of Export/Import

• Default Export/Import

  • export default component
  • import component from "path"

• Named Export/Import

  • export const component
  • import { component } from "path

React Hoooks

(Normal JS utility Functions)

• useState()
• useEffect()

2 types Routing in web apps

• Client side routing
• Server side rendering

Redux Toolkit

• Install @reduxjs/toolkit and react-redux
• Build our store
• Connect our store to our app
• Slice (cartSlice)
• Dispatch (action)
• Calls reducer function
• modifiy our slice
• selector (subscribing to the store)