| S.No |
Topic |
Sub-Topics |
| 1 | Introduction to React | What is React, SPA Architecture, Virtual DOM, React Features, Prerequisites |
| 2 | Environment Setup | Node & npm, Create React App, Folder Structure, Dev Server, Basic App |
| 3 | JSX Basics | JSX Syntax, Embedding Expressions, Babel, JSX Rules, Differences from HTML |
| 4 | Components | Functional Components, Class Components, Props Basics, Component Reuse, Composition |
| 5 | Props & State | Props Usage, Passing Data, useState Hook, State Definition, State vs Props |
| 6 | Event Handling | Event Basics, Synthetic Events, Event Binding, Passing Params, Event Objects |
| 7 | Conditional Rendering | If/Else, Ternary, Logical &&, Conditional Component, Fragments |
| 8 | Lists & Keys | Dynamic Lists, Array.map(), Key Importance, Nested Lists, List Styling |
| 9 | Forms | Controlled Components, Uncontrolled Components, Submit Handler, Text Inputs, Form Validation |
| 10 | useEffect Hook | Effects Intro, Dependency Array, Cleanup, API Calls, Multiple Effects |
| 11 | React Router | Router Setup, Routes, Link & NavLink, URL Params, Navigate |
| 12 | Context API | CreateContext, Provider, useContext, Avoid Props Drilling, State Sharing |
| 13 | Custom Hooks | Why Custom Hooks, Rules, Business Logic Hook, Reusable Hook, useFetch |
| 14 | Performance Optimization | React.memo, useMemo, useCallback, Batching, Re-render Control |
| 15 | State Management | Lifting State, Global Store, Redux Intro, Reducer, Actions Flow |
| 16 | Redux Toolkit | RTK Install, createSlice, Store Setup, Provider, Dispatch & Selector |
| 17 | Async Operations | Axios, Fetch API, Async/Await, Error Handling, Loading States |
| 18 | Error Boundaries | Fallback UI, Logging, Try/Catch, Boundary Component, Debugging |
| 19 | Optimization II | Profiler, Pure Components, Code Splitting, Lazy Loading, Tree Shaking |
| 20 | Testing | Jest Basics, RTL Intro, Mocking API, Unit Tests, Snapshot Testing |
| 21 | Advanced Patterns | HOC Pattern, Render Props, Compound Components, Provider Pattern, Hooks Composition |
| 22 | React with TypeScript | TS Setup, Props Typing, State Typing, Custom Types, Interfaces |
| 23 | Styling | CSS Modules, Styled Components, Tailwind CSS, Material UI, Chakra UI |
| 24 | Authentication | Login Flow, JWT Token, Protected Routes, Session Storage, Role-Based UI |
| 25 | Deployment | Build App, Netlify, Vercel, GitHub Pages, Environment Config |
| 26 | Next.js Basics | SSR, SSG, Routing, Layouts, API Routes |
| 27 | Architecture | Folder Structure, Atomic Design, Feature Based Structure, Clean Code, Service Layer |
| 28 | Best Practices | DRY Principle, KISS, Performance Tips, Error Handling, Security |
| 29 | Project Development | UI Planning, Component Design, Data Flow, State Logic, Router + Redux |
| 30 | Final Review | Code Cleanup, Documentation, Testing Coverage, Refactor, Deployment |