Turning Learners Into Developers
Codekilla
CODEKILLA
React·Intermediate

React JS

Build interactive UIs with components.

Master React — hooks, state, routing and production-ready patterns.

6 weeks
311 lessons
1 examples
Certificate on completion
// preview.react
react
function Hello({ name }) {
  return <h1>Hello, {name}</h1>;
}
# curriculum
0 / 311 lessons·0% complete
01What is React?02Why React?03History of React04Features of React05React Architecture06SPA vs MPA07Virtual DOM08Real DOM09React DOM10React Fiber11Declarative Programming12Imperative Programming13React Ecosystem14React Roadmap15React Use Cases16HTML Basics17Semantic HTML18Forms19Tables20CSS Fundamentals21Flexbox22Grid23Responsive Design24CSS Variables25Variables26Data Types27Operators28Functions29Arrow Functions30Template Literals31Objects32Arrays33Destructuring34Spread Operator35Rest Operator36Modules37Classes38Promises39Async/Await40Fetch API41VS Code42Node.js43npm44npx45pnpm46Yarn47Vite48React DevTools49Browser Developer Tools50Create Project using Vite51Folder Structure52npm Scripts53Development Server54Build Process55Production Build56What is JSX?57JSX Syntax58Expressions59Comments60Fragments61JSX Rules62Babel63Functional Components64Component Naming65Nested Components66Reusable Components67Component Composition68Export & Import69Passing Props70Default Props71Children Props72Props Destructuring73Prop Validation74State75useState()76Updating State77Object State78Array State79Functional Updates80Click Events81Form Events82Keyboard Events83Mouse Events84Prevent Default85Event Bubbling86if-else87Ternary Operator88&&89Switch90Early Return91Rendering Arrays92map()93filter()94Keys95Dynamic Lists96Controlled Components97Uncontrolled Components98Input99Select100Checkbox101Radio Button102Textarea103Validation104Rules of Hooks105useState106useEffect107useRef108useMemo109useCallback110useContext111useReducer112Lifecycle113Dependency Array114Cleanup Function115API Calls116Timers117Event Listeners118CSS119CSS Modules120SCSS121Styled Components122Tailwind CSS123Bootstrap124Material UI125Images126Fonts127SVG128Icons129Videos130React Router131BrowserRouter132Routes133Route134Link135NavLink136useNavigate137useParams138Nested Routes139Protected Routes140Dynamic Routes141404 Page142Fetch API in React143Axios144REST API145CRUD Operations146Loading State147Error Handling148Pagination149Context150Provider151Consumer152Global State153Theme Context154Authentication Context155useReducer — Advanced Patterns156useId157useTransition158useDeferredValue159useImperativeHandle160useLayoutEffect161Custom Hooks162Memoization163React.memo164useMemo for Performance165useCallback for Performance166Lazy Loading167Code Splitting168Suspense169Performance Optimization170Error Boundaries171Try Catch172API Errors173Custom Error UI174JWT175Login176Signup177Logout178Protected Routes with Auth179Refresh Tokens180Redux Toolkit181Zustand182Context API Comparison183Redux DevTools184Redux Middleware185React Hook Form186Formik187Yup Validation188Zod Validation189Material UI Components190Ant Design191Chakra UI192Shadcn UI193Chart.js194Recharts195ApexCharts196TanStack Table197Sorting198Filtering199Table Pagination200Image Upload201PDF Upload202Drag & Drop203Preview204Framer Motion205React Spring206CSS Animation207TypeScript Basics208Props Typing209State Typing210Hooks Typing211Interfaces212Generics213Jest214React Testing Library215Unit Testing216Integration Testing217Firebase Authentication218Firestore219Firebase Storage220Firebase Hosting221Express Backend222MongoDB Integration223MySQL Integration224JWT in MERN225Full-Stack CRUD226React + Laravel API227React + Spring Boot228React + Django229React + GraphQL230React + WebSocket231Vercel232Netlify233GitHub Pages234Docker235Nginx236Components Tab237Profiler238Debugging239Actions240New Form APIs241New Rendering Improvements242Server Components Overview243React Compiler Introduction244Migration from React 18 to React 19245Compound Components246Higher Order Components247Render Props248Custom Hooks Pattern249Container-Presentational Pattern250Feature-Based Folder Structure251Component Organization252Reusable Utilities253Environment Variables254XSS Prevention255CSRF256Authentication Security257Secure API Calls258React Helmet259Meta Tags260Open Graph261Sitemap262Structured Data263ARIA264Keyboard Navigation265Screen Readers266Semantic HTML for Accessibility267Core Interview Questions268Coding Challenges269Machine Tests270Counter App271Calculator272Todo App273Weather App274Notes App275Quiz App276Digital Clock277Expense Tracker278Currency Converter279BMI Calculator280Movie App281Blog App282News App283Recipe Finder284Chat Application285Dashboard286Portfolio Website287E-Commerce Website288Admin Dashboard289Learning Management System290CRM291Hospital Management System292Hotel Booking System293Job Portal294Social Media App295MERN Authentication296MERN Blog297MERN E-Commerce298MERN Chat App299MERN Admin Panel300Production Build & Hosting301Domain Setup302SSL303CI/CD with GitHub Actions304Clean Code305Folder Structure Best Practices306Performance Best Practices307Reusable Component Design308Code Splitting Strategy309Security Best Practices310Documentation311Capstone: Production-Ready React App
enroll.now()
Free
Full access. No credit card.
✓ Lifetime access
✓ Code along with projects
✓ Community support 24/7