Express.js Mastery / Introduction To Back-End Web Development

An Overview of How the Web Works

🌐 The Core Concept: Request-Response Model

  • 💻 Your browser (client) sends a request to a server.

  • 🗄️ The server sends back a response with the requested page or data.

  • 🔄 This back-and-forth is called the request-response model or client-server architecture.

🛣️ Step-by-Step: What Happens When You Type a URL

🌐 Example URL

<https://google.com/maps>

🧩 Breaking Down the URL

Example: https://google.com/maps

📌 Part

📝 Example

💡 Meaning

🔒 Protocol

https://

The protocol used for the connection (HTTP or HTTPS)

🌍 Domain name

google.com

A human-friendly name for the server

📂 Resource path

/maps

The specific resource being requested on that server

🌐 Step 1: DNS Lookup (Domain Name → IP Address)

❓ The Problem

  • A domain name like google.com is easy for people to remember, but computers can't use it directly.

  • To connect to a website, a computer needs the website's IP address.

💡 The Solution: DNS

  • DNS (Domain Name System) works like the phone book of the internet. It converts domain names into IP addresses.

🔄 How It Works

  1. 🌐 You enter google.com in your browser.

  2. 🔍 The browser asks a DNS server (usually provided by your ISP) for the IP address.

  3. 📤 The DNS server returns the website's IP address.

  4. 🚀 The browser uses that IP address to connect to the server.

🌍 The Actual Address Used

Once the IP address is found, the browser connects using: protocol://IP_address:port

🔌 What Is a Port?

  • A port identifies a specific service on a server.

  • Example: our Node.js server used port 8000.

  • The resource path (like /maps) is sent separately in the HTTP request.

🤝 Step 2: Establishing a Connection (TCP Socket)

  • 🌐 After getting the server's IP address, the browser creates a TCP connection with the server.

  • 🔌 This connection stays open while the website's data is being transferred.

  • 📦 TCP (Transmission Control Protocol) ensures data is sent and received reliably.

  • 🌐 IP (Internet Protocol) helps data reach the correct destination.

  • 📚 Together, TCP/IP are the rules that allow devices to communicate over the internet.

💡 A protocol is simply a set of rules for communication.

📨 Step 3: Making the HTTP Request

Once connected, the browser sends an HTTP request with three parts:

  1. 📝 Start line — method (GET, POST, PUT/PATCH), path, HTTP version

  2. 📑 Headers — metadata (browser type, language, time, etc.)

  3. 📦 Body (optional) — data being sent, e.g. a form submission

🔒 HTTP vs. HTTPS

  • 🔐 HTTPS is the same as HTTP, but encrypted using TLS or SSL (additional security protocols).

  • ✅ Aside from this encryption layer, the same request/response logic applies identically to both HTTP and HTTPS.

📨 Step 4: The Server Responds (HTTP Response)

The server replies with a similarly structured message:

  1. 📝 Start line — HTTP version, status code (✅ 200 OK, ❌ 404 Not Found), status message

  2. 📑 Headers — set by the backend developer

  3. 📦 Body — the actual content (HTML, JSON, etc.)

🌐 Step 5: Multiple Requests for a Single Website

  • 📄 The first request retrieves the HTML.

  • 🔍 The browser scans the HTML for CSS, JavaScript, images, and fonts.

  • 📨 The browser requests each of these files separately.

  • ✨ Once all the files are downloaded, the browser renders the webpage.

🧐 How TCP/IP Actually Moves the Data

  • 🚚 TCP splits data into small packets and reassembles them at the destination — much faster than sending one giant chunk

  • 🧭 IP handles routing, making sure each packet reaches the right address

🛣️ Full Journey, Summarized

  1. ⌨️ User types a URL.

  2. 🔍 DNS resolves the domain to an IP.

  3. 🔌 Browser opens a TCP connection.

  4. 📨 Browser sends an HTTP request.

  5. 📤 Server sends back an HTTP response.

  6. 📄 Browser requests additional assets (CSS/JS/images).

  7. ✨ Browser renders the final page.

  8. 🌍 TCP/IP handles packet transfer underneath it all.