Chapter 1: The Internet & World Wide Web

Understanding how the Internet works is fundamental to web development. Learn about protocols, URLs, HTTP methods, and how browsers communicate with servers.

What you'll learn:
  • How the Internet works and its key components
  • The difference between Internet and World Wide Web
  • HTTP protocols, methods (GET/POST), and status codes
  • URL structure and domain names

1.1 What is the Internet?

The Internet is a global network of interconnected computer networks that use the Internet Protocol (IP) to communicate. Think of it as a "network of networks" that spans the entire globe, connecting billions of devices worldwide.

History of the Internet

  • 1960s-70s: ARPANET - Advanced Research Projects Agency Network, created by the US Department of Defense. This was the first network to use packet switching.
  • 1983: TCP/IP becomes the standard protocol, birth of the modern Internet
  • 1989: Tim Berners-Lee invents the World Wide Web at CERN
  • 1991: First website goes live
  • 1990s-2000s: Commercial Internet boom, browsers like Netscape and Internet Explorer

Key Components of the Internet

  • Protocol: TCP/IP (Transmission Control Protocol/Internet Protocol) - The "language" computers use to communicate
  • IP Addresses: Unique numerical addresses for every device (e.g., 192.168.1.1)
  • DNS (Domain Name System): Translates human-readable names (google.com) to IP addresses
  • Routers: Direct data packets to their destinations
  • Servers: Computers that store and serve content

Internet Services

  • World Wide Web (HTTP/HTTPS): Web pages and websites
  • Email (SMTP, POP3, IMAP): Electronic mail
  • FTP (File Transfer Protocol): File uploads/downloads
  • VoIP: Voice over IP (Skype, Zoom)
  • Streaming: Video and audio content

1.2 Internet vs. World Wide Web

Many people confuse the Internet with the World Wide Web, but they're fundamentally different concepts:

The Internet

  • The physical infrastructure - cables, routers, servers, satellites
  • A network of networks connecting devices globally
  • Created in 1969 as ARPANET
  • Supports many services: email, FTP, VoIP, and the Web

The World Wide Web (WWW)

  • A service that runs ON the Internet
  • A collection of web pages linked by hyperlinks (URLs)
  • Created in 1989 by Tim Berners-Lee at CERN
  • Uses HTTP/HTTPS protocols and HTML documents
Analogy: Think of it this way - the Internet is like the highway system (roads, bridges, tunnels), while the WWW is like cars driving on those highways. Email is like trucks, FTP is like delivery vans. All use the same roads (Internet), but they're different vehicles (services)!
Internet = Highway system (roads, bridges, tunnels)
WWW = Cars driving on the highways (one type of traffic)
Email = Trucks on the same highways (different type of traffic)
FTP = Delivery vans (yet another type of traffic)

1.3 How Web Communication Works

Understanding the client-server model is fundamental to web development. When you visit a website, here's the complete process:

Step-by-Step Process

  1. You type a URL
    In your browser (the client) - e.g., https://www.example.com/page.html
  2. DNS Lookup
    Browser asks DNS server to translate domain name to IP address
  3. TCP Connection
    Browser establishes a connection with the server
  4. HTTP Request
    Browser sends an HTTP request to the server
  5. Server Processing
    Server processes the request and finds the resource
  6. HTTP Response
    Server sends back the requested file with a status code
  7. Browser Rendering
    Browser parses HTML, downloads CSS/JS, and renders the page

HTTP Request Example

GET /index.html HTTP/1.1
Host: www.example.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64)
Accept: text/html,application/xhtml+xml
Accept-Language: en-US,en;q=0.9
Connection: keep-alive

HTTP Response Example

HTTP/1.1 200 OK
Content-Type: text/html; charset=UTF-8
Content-Length: 1234
Date: Mon, 01 Jan 2024 12:00:00 GMT

<!DOCTYPE html>
<html>...</html>

Common HTTP Status Codes (Quick Overview)

  • 200 OK: Success! The request was fulfilled
  • 301/302: Redirect - Resource moved to another URL
  • 404 Not Found: The requested resource doesn't exist
  • 500 Internal Server Error: Something went wrong on the server

1.4 URLs and Domain Names

A URL (Uniform Resource Locator) is the address of a resource on the web. Understanding its structure is essential.

URL Structure

https://www.example.com:443/path/page.html?id=123#section
│       │   │          │   │    │         │      │
│       │   │          │   │    │         │      └─ Fragment (anchor)
│       │   │          │   │    │         └─ Query string
│       │   │          │   │    └─ File name
│       │   │          │   └─ Path/directory
│       │   │          └─ Port (usually hidden)
│       │   └─ Domain name
│       └─ Subdomain (www)
└─ Protocol (scheme)

URL Components Explained

Component Example Description
Protocol https:// HTTP Secure - encrypted communication
Subdomain www Optional prefix (can be blog, shop, etc.)
Domain example.com The website's main name
Port :443 Usually hidden (80 for HTTP, 443 for HTTPS)
Path /path/page.html Location of the resource on the server
Query String ?id=123 Parameters sent to the server
Fragment #section Jump to a specific part of the page

HTTP vs HTTPS

⚠️
Always use HTTPS! HTTP sends data in plain text (anyone can read it), while HTTPS encrypts all communication. Modern browsers mark HTTP sites as "Not Secure".

1.5 HTTP Methods (GET vs POST)

HTTP defines several methods (also called verbs) that indicate the desired action to be performed on a resource. The two most common are GET and POST.

The Two Most Common Methods

📥
GET Request
  • Purpose: Retrieve/fetch data from the server
  • Data location: Parameters sent in the URL (query string)
  • Visibility: Data is visible in the URL bar
  • Caching: Can be cached and bookmarked
  • Length limit: Limited by URL length (~2000 characters)
  • Security: NOT suitable for sensitive data (passwords, etc.)
  • Use cases: Search queries, filtering, navigating pages
GET /search?q=html+tutorial&lang=en HTTP/1.1
Host: www.example.com

// URL shows: https://www.example.com/search?q=html+tutorial&lang=en
📤
POST Request
  • Purpose: Send/submit data to the server
  • Data location: Data sent in the request body (not visible in URL)
  • Visibility: Data is hidden from URL bar
  • Caching: Cannot be cached or bookmarked
  • Length limit: No practical limit on data size
  • Security: Better for sensitive data (but still use HTTPS!)
  • Use cases: Login forms, file uploads, creating new records
POST /login HTTP/1.1
Host: www.example.com
Content-Type: application/x-www-form-urlencoded
Content-Length: 29

username=john&password=secret

GET vs POST Comparison Table

Feature GET POST
Data in URL ✅ Yes ❌ No
Bookmarkable ✅ Yes ❌ No
Cached ✅ Yes ❌ No
Data Length Limited (~2KB) Unlimited
For Sensitive Data ❌ No ✅ Yes (with HTTPS)
Browser Back Button Safe to use May resubmit data

Other HTTP Methods

  • PUT: Update/replace an existing resource completely
  • PATCH: Partially update an existing resource
  • DELETE: Remove a resource from the server
  • HEAD: Same as GET but returns only headers (no body)
  • OPTIONS: Describes communication options for the resource

HTML Form Methods

<!-- GET form (for search, filters) -->
<form action="/search" method="GET">
  <input type="text" name="q" placeholder="Search...">
  <button type="submit">Search</button>
</form>

<!-- POST form (for login, sensitive data) -->
<form action="/login" method="POST">
  <input type="text" name="username">
  <input type="password" name="password">
  <button type="submit">Login</button>
</form>

1.6 HTTP Response Status Codes

When a server responds to an HTTP request, it includes a status code that indicates whether the request was successful or not. These codes are grouped into categories.

Status Code Categories

Range Category Meaning
1xx Informational Request received, continuing process
2xx Success Request successfully received and processed
3xx Redirection Further action needed to complete request
4xx Client Error Problem with the request (your fault)
5xx Server Error Server failed to fulfill request (server's fault)

Common Status Codes

✅
200 OK - The request succeeded. The response contains the requested data.
✅
201 Created - A new resource was successfully created (common with POST).
🔄
301 Moved Permanently - Resource has permanently moved to a new URL.
🔄
302 Found (Temporary) - Resource temporarily moved to a different URL.
❌
400 Bad Request - Server couldn't understand the request (malformed syntax).
❌
401 Unauthorized - Authentication required. User not logged in.
❌
403 Forbidden - Server understood but refuses. User doesn't have permission.
❌
404 Not Found - The requested resource doesn't exist on the server.
💥
500 Internal Server Error - Server encountered an unexpected condition.
💥
503 Service Unavailable - Server is temporarily down (maintenance/overloaded).

Complete HTTP Response Example

HTTP/1.1 200 OK
Date: Mon, 03 Jan 2026 10:30:00 GMT
Server: Apache/2.4.41
Content-Type: text/html; charset=UTF-8
Content-Length: 1256
Cache-Control: max-age=3600

<!DOCTYPE html>
<html>
  <head><title>Welcome</title></head>
  <body>...</body>
</html>

Quick Reference for Troubleshooting

  • Got 404? Check the URL - the page doesn't exist
  • Got 500? Server problem - contact the website administrator
  • Got 403? You don't have permission to access this resource
  • Got 401? You need to log in first

Quick Quizzes

Test your knowledge! Click on an answer to check if you're correct.

Quiz 1: What is the main difference between the Internet and WWW?

A They are the same thing
B Internet is the infrastructure; WWW is a service running on it
C WWW is older than the Internet

Quiz 2: Which HTTP method should you use for a login form with username and password?

A GET - because it's faster
B GET - because data can be bookmarked
C POST - because sensitive data shouldn't be visible in the URL

Quiz 3: You try to access a webpage and get a 404 error. What does this mean?

A The server crashed and is experiencing problems
B The requested page/resource doesn't exist on the server
C You need to log in to access this page

Quiz 4: What is the main difference between GET and POST requests?

A GET sends data in the URL, POST sends data in the request body
B GET is for deleting data, POST is for creating data
C GET is more secure than POST