React Course Summary - Session 2 - Igniting our App

React Course Summary - Session 2 - Igniting our App

Course Title : Namaste React Live 🚀 - From Zero to Hero in 8 weeks

Course Teacher : Akshay Saini

In first session, we ran our code using file protocol, now we want to run it via http protocol, so we want to run server.

Studying Bundlers

ℹ️
A bundler is a development tool that combines many JavaScript code files into a single one that is production-ready loadable in the browser.

We can find more about bundlers here

In this course, we are studying parcel

By default, create-react-app uses Webpack

Studying package manager

  1. Loading javascript in html via type=”module” rather type=”script”
  2. Example package managers : yarn , npm
  3. Learn about difference between package, module, library

Initialising and running application

This initialises the application, runs an http server

npm init
npm install parcel -D

Learning Parcel in depth

  1. What parcel does behind the scenes (mostly)
    2. ℹ️
    Features
    • HMR - Hot Module Replacement
    • File Watcher algorithm - C++
    • BUNDLING
    • MINIFY
    • Cleaning our Code
    • Development and Production Build
    • Super Fast build algorithm
    • Image Optimisation
    • Caching while development
    • Compression
    • Compatible with older version of browser (Babel)
    • HTTPS on dev
    • port Number
    • Consistent Hashing Algorithm
    • Zero Config
    • Transitive dependencies
  2. Include parcel as development dependency in package.json

Learning React

  1. Include react and react-dom/client as dependency in package.json
  2. Learn about React Elements Composition
  3. Learn about React Element Props
  4. Learn about browserList as dependency (to restrict browser versions)

Code Reference

Reference to code commit what we learn in this session :

https://bitbucket.org/namastedev/namaste-react-live/commits/566af3875ff6a38b4851f859add68d59745853b6

Back to “React Course”