How the web works

~20 min

What you'll learn this week

By the end of Week 1 you will be able to:

  1. Explain what happens between typing a URL and seeing a page (DNS → HTTP → HTML render).
  2. Write semantic HTML for headings, navigation, articles, media, and tables.
  3. Build forms with native validation.
  4. Apply accessibility basics: alt text, labels, heading hierarchy.
  5. Commit and push work to GitHub, and deploy a page with GitHub Pages.

The 10,000-foot view

When you visit a site, four things happen:

  1. DNS turns a name (example.com) into an IP address — the internet's phone book.
  2. Your browser sends an HTTP request to the server at that address: GET /index.html.
  3. The server responds with a status code (200 OK, 404 Not Found, 500 Server Error) and the HTML document.
  4. The browser parses the HTML, requests the CSS/JS/images it references, and renders the page.

That's it. Everything in this course — CSS, JavaScript, React, Next.js — is about what's inside that response and what the browser does with it.

Front end vs back end

  • Front end: everything that runs in the browser — HTML (structure), CSS (appearance), JavaScript (behavior). This course.
  • Back end: the server that answers requests — databases, auth, APIs. You'll touch this in Weeks 10–11 when Next.js blurs the line.

Try it now

Open any site, press F12 (DevTools) → Network tab → refresh. Watch the waterfall of requests: the HTML document first, then CSS, JS, images and fonts. Click the first request and read the response headers — you're looking at raw HTTP.

Sign in to track your progress.