Tests
Twelve-question labs plus live coding
Every lab has a quiz with three choices. Labs 2.1, 4.1 and 9.1 also run React 19 in a sandbox: click, type, green tests — the same shape as a take-home screen.
Learn React 19
A classroom for people who already write JavaScript: components and hooks first, then routing, data, architecture, and the interview cards. Vite is the default. Server Components are named, not claimed as production scar tissue.
Created by Baljeet Dogra
Course Objectives
- Build interfaces as functions of state, not as a pile of DOM mutations.
- Use hooks, routing and React Query the way a pairing session actually uses them.
- Name React 19, Fiber, Suspense and Server Components without claiming a Next.js year you do not have.
- Ship a Vite artefact you can defend, and speak the interview cards in ninety seconds.
What you will produce
Build
Vite + React artefact
A typed SPA with routing, data fetching and tests. README of trade-offs. Not an App Router clone you cannot debug.
Prep
Spoken interview cards
Cover the card. Speak for ninety seconds. Sources are react.dev, not a leaked paper.
22-lab curriculum
Expand a part for the syllabus. Content stays searchable when closed. Mapped to a modern React 19 path — original briefs, not a reprint.
00 Before we begin Positioning
You already write JavaScript. This classroom is React 19 as it is used in Vite, plus the names you will hear on a Next.js screen. It is not a first course in programming, and it is not a year of production scar tissue.
- 0.1 How this classroom works — Vite default, honest CV sentence, how quizzes and drills gate Done
01 JavaScript for React Refresher
Closures, modules, promises, and the DOM React sits on. The quiz will catch this and stale closures before hooks do.
- 1.1 The JS React actually uses — variables, arrows, closures, objects, async, ES modules, DOM
02 Core React UI as a function of state
Why React exists, what the Virtual DOM actually buys you, JSX, components, props, events, then the hooks you cannot ship without.
- 2.1 Why React, JSX, Virtual DOM
- 3.1 Components, props, styling, events, stateless functions
- 4.1
useState,useEffect,useContext,useRef,useMemo
03 Routing Client-side navigation
React Router in a Vite SPA: routes, links, params, nested layouts, 404, and programmatic navigation. This is not the App Router.
- 5.1 React Router — define, navigate, dynamic, nested, wildcard,
useNavigate
04 React 19 surface What changed
Ref as a prop, ref cleanup, context as a provider, document metadata, async scripts. You name them; you do not invent a new renderer.
- 6.1 Refs, metadata, async scripts
05 State, concurrency, forms The pairing round
Reducers and custom hooks, then useTransition versus useDeferredValue, then controlled forms, useId, useFormStatus, useActionState and optimistic UI.
- 7.1 Advanced hooks —
useReducer,useCallback, custom hooks - 8.1 Concurrency for smooth UIs
- 9.1 Forms — controlled, uncontrolled, actions
06 Data Fetch, cache, live
Why useEffect + fetch falls apart, Axios, React Query, then cache, infinite queries, mutations, real-time, workers and offline.
- 10.1 Fetching, Axios, React Query
- 15.1 Advanced React Query
- 16.1 Real-time, background work, offline
07 Scale Architecture and internals
State ownership, feature folders, reducers, headless and compound components. Then Fiber, memo pitfalls, Suspense, streaming, and Server Components as a named pipeline — not a Next.js year.
- 11.1 Architecting React apps at scale
- 12.1 Fiber, render/commit, memoization
- 13.1 Suspense, streaming, code-splitting
- 14.1 Server Components — named, locally simulated
08 Production quality Ship it
Wizards, testing, accessibility, internationalisation, design tokens, then security as a rendering boundary and a performance budget you can measure.
- 17.1 Complex forms and workflows
- 18.1 Testing strategies
- 19.1 Accessibility, i18n, design systems
- 20.1 Security, budgets, delivery
09 Interview and artefact Close
Spoken drilling on the whole bank, then a product-launch board in React 19 you can put on GitHub without inventing a five-year history.
- 21.1 Question bank and launch board
Who this is for
Engineers who already write JavaScript
You ship in the language. You need React 19 as the UI model, not a beginner syllabus that starts at let.
Interview in the next month
You need hooks, rendering, data and routing answers you can speak — without claiming a Next.js year you do not have.
Prerequisites
- You already write JavaScript (ES2015+) in a real codebase
- Comfortable in a terminal, Git, and npm or pnpm
- Node 20+ and Vite 8 on the machine before lab 2.1 — look it up; there is no install walkthrough
Not a fit if
- A first course in programming — learn JavaScript first
- A classroom sold as years of Next.js production — this course is built for the honest artefact
Related: Python in Seven Days · Software Engineering Fundamentals
Questions
Do I need to know JavaScript already?
Yes. Lab 1.1 is a React-shaped refresher — closures, modules, promises — not a first course in programming. If you are new to the language, learn JavaScript first, then come back.
Will this make me a Next.js specialist?
No. The default artefact is a Vite + React SPA you can defend. Server Components and streaming are named so you can talk about them honestly. Claiming a year of App Router production from a static classroom is the tell interviewers catch.
How should I position this on a CV?
“I already ship JavaScript; I built this React 19 app in Vite — here is the repo.” That is credible. “Senior React / Next.js engineer” after twenty-two labs is what the deep-dive round exists to catch.
Ready to start?
Twenty-two labs, about eight weeks part-time. Create an account to enrol.