explaingit

vasanthk/how-web-works

Analysis updated 2026-06-24

16,727Audience · developerComplexity · 1/5Setup · easy

TLDR

An educational markdown doc that explains everything that happens when you type a URL into a browser, from keystroke to rendered page.

Mindmap

mindmap
  root((how-web-works))
    Inputs
      A typed URL
      Browser keystroke
    Stages
      DNS lookup
      TCP handshake
      TLS handshake
      HTTP request
      HTML parsing
      Rendering
    Use Cases
      Interview prep
      Teaching web basics
      Reference doc
    Format
      Markdown
      Plain English
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Prep for a frontend or backend interview that asks what happens when you type a URL

USE CASE 2

Teach a junior engineer how DNS, TCP, TLS, and HTTP fit together

USE CASE 3

Use as a reference checklist when debugging a slow page load

What is it built with?

Markdown

How does it compare?

vasanthk/how-web-workszerotier/zerotieroneapache/arrow
Stars16,72716,73216,736
LanguageC++C++
Setup difficultyeasyeasymoderate
Complexity1/53/54/5
Audiencedeveloperops devopsdata

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · easy Time to first run · 5min

In plain English

This is an educational document that walks you through everything that happens, step by step, when you type a web address like google.com into your browser and press Enter. What seems like a simple action actually involves dozens of complex processes happening in fractions of a second. The journey starts the moment you press a key on your keyboard, which sends electrical signals through USB or Bluetooth to your computer. Your browser then interprets the URL you typed, figures out whether it should use regular HTTP or secure HTTPS, and looks up the numeric internet address (IP address) for the website you want. This lookup checks multiple caches in sequence, your browser, your operating system, your router, and your internet provider, before doing a full search across the internet's address system if needed. Once it has the destination address, your browser opens a connection to the web server and performs a security handshake to set up encrypted communication. It then sends a request for the page, and the server sends back the HTML content. The browser doesn't just display raw text though, it parses the HTML into a structured tree of elements, processes the styling rules, figures out where everything should be positioned on screen, and paints the final result you see. The document covers each of these stages in plain detail: DNS lookups, TCP connections, HTTP requests and responses, and how browsers render pages from raw code into the visual result you see. This is a great reference for anyone curious about the hidden machinery of the web, explained without assuming deep technical knowledge.

Copy-paste prompts

Prompt 1
Quiz me on the steps from typing a URL to seeing a rendered page, based on the how-web-works doc
Prompt 2
Turn the how-web-works document into a one-page cheat sheet I can pin near my desk
Prompt 3
Use this doc to explain to me what happens during the TLS handshake in 5 sentences
Prompt 4
Build a simple HTML page that visualizes each stage of how-web-works with diagrams

Frequently asked questions

What is how-web-works?

An educational markdown doc that explains everything that happens when you type a URL into a browser, from keystroke to rendered page.

How hard is how-web-works to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is how-web-works for?

Mainly developer.

Open on GitHub → Explain another repo

This repo across BitVibe Labs

Scan in gitsafehub Deploy in gitdeployhub vasanthk on gitmyhub

Verify against the repo before relying on details.