React 19 & Modern Component Architecture

Fiber Reconciliation, Hooks, Actions, Suspense & the React Compiler

8 modules, 40 lessons: React 19 Foundations & JSX Compilation; Reconciliation Engine And The React Fiber; Component Lifecycle, Effects And Refs; State Sharing, Context And Composition; Custom Hooks And Behavioral Abstractions; React 19 Actions, Transitions And Async; Suspense, Streaming And Error Boundaries; Performance Optimization & React Compiler. Intermediate level, about 1 hour.

This repository holds the labs of the free lessons of the LearnSome.tech course React 19 & Modern Component Architecture: each lab's starter files, a README with the goal, the steps and the expected output, and ./check, which tests your work the way the site does.

Start

• Codespaces: the badge opens this repository in a dev container with Node.js 24.21.0, as in the site's lab sandbox.

• On your machine:

  git clone https://github.com/learnsome-tech/react-free-labs.git
  cd react-free-labs
  npm ci
  ./check m01l01-02

  You need Node.js for ./check, and for the labs themselves Node.js 24.21.0. Other versions mostly work, but only the sandbox's versions are sure to print what the site prints. VS Code's Dev Containers extension builds the same container as Codespaces (x86-64).

Doing a lab

1. Open the lesson on LearnSome.tech and the lab folder beside it: labs/<lesson>/<lab>/. The lab README has the goal, the steps and the expected output.
2. Work in the lab's starter/ folder.
3. From the repository root, run ./check <lab> (for example ./check m01l01-02), or ./check <lesson> for all labs of a lesson, or ./check --all. ./check --list shows every lab and how it is checked.

./check runs your starter the way the site's lab sandbox does: in a scratch copy that is its working directory and HOME, with LANG=C.UTF-8, TZ=UTC, input.txt on standard input, 10 seconds and 256 KiB of output per stream. It then compares the output with the site's own rules, so a pass here is a pass on the site.

Check	What ./check does	Labs
Graded	Runs the program and compares its output with expected.txt.	5

What is published, and what is not

This is the free edition: the labs of the course's free lessons, the ones anyone with a free LearnSome.tech account can watch. Each lab's starter is the code the lesson shows on screen. There are no reference solutions, no Pro lessons' labs or expected outputs, no narration and no quiz or exercise answers.

The labs of the Pro lessons are on the course page, where LearnSome.tech runs and grades them in its sandbox with a Pro membership. The full labs repository is private and stays private.

Modules and lessons

Module 1: React 19 Foundations & JSX Compilation

#	Lesson	Labs	Access
1.1	JSX Transpilation: createElement, JSX Runtime, React Elements	1 lab	Free
1.2	Component Purity: Pure Functions, Idempotence And Side Effects	1 lab	Free
1.3	Props Contract: Immutability, Children, And Polymorphic Tags	1 lab	Free
1.4	State with useState: Immutability And Asynchronous Batching	1 lab	Free
1.5	Complex State with useReducer: State Machines And Action Types	1 lab	Free

Free lessons are open to anyone with a free LearnSome.tech account. The rest of the course is on LearnSome.tech with Pro.

Licence

• Code (starter files, check and .learnsome/, the dev container and the workflows) is under the MIT licence.
• Written text (the READMEs and lab instructions) is under CC BY-NC-SA 4.0: share and adapt it with attribution to LearnSome.tech, not commercially, under the same licence.
• The LearnSome.tech name and logo are not covered by either licence.

Contributing and security

This repository is generated from the course. Report a broken lab or a content error as an issue; see CONTRIBUTING.md. Security reports go to SECURITY.md.

© 2026 LearnSome.tech