The Modern Web Stack

Overview

The vocabulary and workflow of a 2026-era builder. React, Git, databases — the three pillars under almost every real app you'll touch. This chapter takes you from 'I can write a page' to 'I can ship a product with users.'

What you'll learn

• React's mental model in plain English: UI is a function of state.
• Git like a pro: branches, PRs, commit messages, the rare 'oh god undo' commands.
• SQL vs NoSQL and how to decide in under 5 minutes.
• Managed services (Supabase, Vercel, Lovable Cloud) that let one person ship what used to take a team.

Lessons in this chapter

All lessons are free and open — start anywhere, in any order.

1. 1

   What is React (and Why Everyone Uses It)

   Components, props, state — the mental model that unlocks modern UI development.

   114 min
2. 2

   Git & GitHub — Your Time Machine

   Commits, branches, pull requests. Never lose work or yell at a colleague again.

   114 min
3. 3

   Databases 101

   SQL vs NoSQL, tables, relationships — how your app remembers things between visits.

   113 min
4. 4

   Common Mistakes & How to Avoid Them

   The 5 traps beginners fall into when working on the modern web stack — and the fix for each.

   111 min
5. 5

   A Real-World Walkthrough

   A start-to-finish example of applying the modern web stack to a real project you can copy.

   111 min
6. 6

   Mental Models That Actually Help

   The 3 mental models we keep coming back to when things get hard in the modern web stack.

   111 min

Glossary

Key terms used throughout this chapter.

Component

A reusable piece of UI in React. A function that returns JSX.

State

Data a component remembers between renders. Changes trigger UI updates.

Props

Inputs passed into a component, like function arguments.

Hook

A React function starting with `use` that adds capabilities (state, side effects, refs).

Branch

An isolated line of development in Git. Merge it back when ready.

PR

Pull Request — proposing your branch's changes be merged into the main branch.

ORM

Object-Relational Mapper — lets you query a database from code (Prisma, Drizzle).