HTML
Structure
The meaningful content: headings, forms, buttons, and lists.
Free · zero prerequisites · one real project
Learn how the web works by building something that works.
Start in the browser with no installation. Explore the web from first principles, then build one expense tracker across ten connected modules and deploy it.
10
connected modules
4
labs in Module 1
0
setup to begin
1
deployed project
One browser, five layers
React makes more sense when the foundations stop being mysterious.
CSS
Presentation
Layout, spacing, colour, typography, and responsive behavior.
JavaScript
Behavior
Values, decisions, events, calculations, and browser APIs.
TypeScript
Clarity
Labels that catch mismatched data before it reaches a learner.
React
Coordination
Components and state that keep changing data synchronized with the screen.
Want to understand a React idea without the project around it? The Field Guide offers focused concepts, examples, and small exercises in a recommended sequence.
Open the Field Guide →The project path
Ten modules. One evolving project.
Module 1
Computers, Programs, and the Web
Explore browsers, servers, web languages, program flow, files, and paths.
Available now
Module 2
HTML
Build the meaningful structure of the expense tracker.
Available now
Module 3
CSS
Design the tracker and make it adapt across screens.
Available now
Module 4
JavaScript Foundations
Understand values, memory, functions, conditions, and arrays.
Built next
Module 5
JavaScript in the Browser
Connect code to the DOM and build the working vanilla tracker.
Planned
Module 6
TypeScript
Make the project’s data and expectations explicit.
Planned
Module 7
Why React Exists
Experience the coordination problem React was designed to solve.
Planned
Module 8
Interactive React
Build forms, state, events, and reliable interface behavior.
Planned
Module 9
Real Application Data
Manage identity, derived values, data flow, and edge cases.
Planned
Module 10
Persistence, Quality, and Deployment
Save, debug, test, move, deploy, and explain the finished project.
Planned