Javascript & React Full Course for New Learners

Frontend Master .

profile
5
Javascript & React Full Course for New Learners
profile
Courses

[[ This is Recording of my course with all the questions discussions that happened ]]


This Course focues on building right mental model around javascript and React. Whatever is there in the course is the foundational things that everyone should know.

These are not everything, but these are mandatory thing, the first steps.


Language: HINDI


What it contains:


๐Ÿง  JavaScript Full Course Outline


๐Ÿ“˜ Part 1: Foundations

  1. Day 1: Course Intro, Path to Success
  2. Day 2: JavaScript Introduction, Data Types
  3. Day 3: Objects, Symbols, Truthy and Falsy Values
  4. Day 4 (Part 1): Loops and Functions
  5. Day 4 (Part 2): Functions Continued (return, parameters, scope, pure vs impure)



โš™๏ธ Part 2: Core Concepts

  1. Day 5: JavaScript Classes
  2. Day 6: Hoisting, == vs ===, Shallow and Deep Copy
  3. Day 7: Coercion, Scope, Lexical Scope
  4. Day 8: Closures
  5. Day 9: this, call, bind, apply



๐ŸŒ Part 3: Asynchronous JavaScript

  1. Day 10: Callbacks, Promises (Part 1)
  2. Day 11: Promise Chaining (Part 2)
  3. Day 12: async / await, Promise.all()



๐Ÿ”„ Part 4: Event System & Browser Interaction

  1. Day 13: Event Loop (Microtask, Macrotask, Queue)
  2. Day 15: DOM Manipulation, Event Bubbling, Capturing, Delegation, Debouncing
  3. Day 16: Currying, Throttling, Prototypal Inheritance



๐Ÿงฉ Part 5: Advanced Objects & Data Structures


  1. Day 17: Prototypes (in depth)
  2. Day 18: Maps and WeakMaps

  • What is a Map?
  • Difference between Map and Object
  • When to use Map
  • Iterating over a Map
  • Practical examples (e.g., caching results, counting frequency)
  • What is a WeakMap?
  • Key characteristics (keys must be objects, garbage collection)
  • Real-world use cases (private data storage for objects, memory-efficient caches)
  1. Day 19: Sets and WeakSets
  • What is a Set?
  • Difference between Set and Array
  • Built-in methods: add(), has(), delete(), size, forEach()
  • Modern Set methods: union, intersection, difference, symmetricDifference, isSubsetOf, isSupersetOf
  • What is a WeakSet?
  • Use cases (tracking object presence, memory-safe object collections)



๐Ÿงฐ Part 6: Utilities and Patterns

Day 20:

  • Currying
  • Memoization using Map/WeakMap
  • Event Delegation patterns



React Content


๐Ÿ“… Day 1 โ€“ Intro Session


  • What is React?
  • History & evolution of frontend frameworks
  • Course structure & expectations
  • What you need to know before learning React



๐Ÿ“… Day 2 โ€“ Why React? and Why Not React?


  • Problems React solves vs traditional DOM manipulation
  • SPA vs MPA architecture
  • Pros & cons of React in real projects
  • When NOT to use React



๐Ÿ“… Day 3 โ€“ Why we need Server, devDeps, Vite?


  • Why frontend apps need servers
  • Local dev server vs production build
  • What devDependencies are and why they matter
  • Introduction to Vite (why itโ€™s faster than CRA/Webpack)



๐Ÿ“… Day 4 โ€“ JSX


  • What is JSX and why React uses it
  • JSX vs JavaScript
  • Rules of JSX (expressions, fragments, return, wrapping)
  • Common JSX gotchas



๐Ÿ“… Day 5 โ€“ Components


  • Function & class components (brief intro)
  • Component naming rules
  • Reusability & composition
  • Props vs hardcoded data



๐Ÿ“… Day 6 โ€“ useState (Part 1)


  • Introducing state in React
  • useState syntax & working
  • Initial state, updating state, async updates
  • Primitive vs object/array state



๐Ÿ“… Day 7 โ€“ useState and Props


  • Component communication
  • Passing data via props
  • Parent โ†’ child and child โ†’ parent state flow
  • State lifting patterns



๐Ÿ“… Day 8 โ€“ useEffect and useLayoutEffect


  • Why effects are needed
  • Side effects: API calls, listeners, timers
  • Dependency array rules
  • useLayoutEffect vs useEffect



๐Ÿ“… Day 9 โ€“ useRef and Custom Hooks


  • When to use refs (DOM access, storing mutable values)
  • useRef vs useState
  • Extracting logic into a custom hook
  • Creating reusable data + UI logic



๐Ÿ“… Day 10 โ€“ Context API, Provider, and Custom Hooks


  • Prop drilling problem
  • Creating and consuming context
  • Context Provider pattern
  • Using custom hooks to access context



๐Ÿ“… Day 11 โ€“ Component Communication


  • Parent โ†’ Child, Child โ†’ Parent, Sibling communication
  • Using callbacks for event bubbling
  • Using context vs props for communication
  • When to choose what



๐Ÿ“… Day 12 โ€“ Memoization (memo, useCallback, useMemo)


  • Why React re-renders
  • Preventing unnecessary re-renders
  • Using memo for component caching
  • useCallback vs useMemo difference & real use cases



๐Ÿ“… Day 13 โ€“ Lazy Loading, Code Splitting, Suspense


  • React.lazy & dynamic imports
  • Route-based vs component-based code splitting
  • Suspense boundaries
  • Performance benefits & bundle size reduction



๐Ÿ“… Day 14 โ€“ React Router


  • SPA navigation
  • Basic routing (Route, Link, BrowserRouter)
  • Dynamic routes, useParams, nested routes



โ‚น499โ‚น2,999