Frontend

Packets and IP addresses, the HTTP conversation, domain names and DNS, hosting, and the browser's rendering pipeline, all traced through one visit to the bakery's website.

1. How the Internet Works12 min
2. HTTP — Asking and Answering14 min
3. Domain Names and DNS15 min
4. Hosting — Where the Site Lives12 min
5. How Browsers Work15 min

The frame every document needs, semantic elements that say what content is, links and images that work for everyone, and forms that actually deliver their data.

1. The Shape of an HTML Document12 min
2. Semantic HTML — Say What It Is14 min
3. Links and Images13 min
4. Forms — Letting Visitors Talk Back15 min

How the cascade picks a winner, how the box model sizes every element, flexbox and grid for layout, and a mobile-first approach to responsive design.

1. Selectors and the Cascade15 min
2. The Box Model14 min
3. Layout with Flexbox and Grid16 min
4. Responsive Design15 min

Values, variables and functions, finding and changing elements through the DOM, reacting to events, and fetching data with async and await.

1. Values, Variables and Functions15 min
2. The DOM — Changing the Page14 min
3. Events — Reacting to Visitors15 min
4. Fetching Data with async and await16 min

Snapshots with Git's edit, stage and commit loop, branches and merges, remotes on GitHub and GitLab, and the pull request flow teams use to review changes.

1. Git — Saving Snapshots14 min
2. Branches and Merging15 min
3. Remotes — GitHub and GitLab14 min
4. Pull Requests and Code Review14 min

Use npm and package.json to install and run tools, read version ranges and trust the lockfile, and know when a project uses pnpm or Yarn instead.

1. npm and package.json14 min
2. Versions and Lockfiles15 min
3. npm, pnpm and Yarn13 min