Skip to content

Instantly share code, notes, and snippets.

@ninadpchaudhari
Last active January 21, 2026 14:44
Show Gist options
  • Select an option

  • Save ninadpchaudhari/971f58c7fa9a26cd80e164a950e0d0c5 to your computer and use it in GitHub Desktop.

Select an option

Save ninadpchaudhari/971f58c7fa9a26cd80e164a950e0d0c5 to your computer and use it in GitHub Desktop.
LAb 0 - Sp26

Lab: How the Web Works.

An Introduction to HTTP

Course: Intro to Web / Software Engineering Topic: HTTP, Requests, Responses, and Browsers
Estimated Time: 45–60 minutes
Resources:


Part 1 What Is HTTP?

Read:
MDN → Overview of HTTP
https://developer.mozilla.org/en-US/docs/Web/HTTP/Overview

Questions

  1. In your own words, what problem does HTTP solve?

    Answer here:
    
  2. According to MDN, HTTP is described as:

    • ☐ Stateful
    • ☐ Stateless

    What does this mean in practice?

    Answer here:
    
  3. Fill in the blanks:

    HTTP works as a protocol, where a __________ sends a request and a __________ sends back a response.


Part 2 , HTTP Requests

Read:

MDN → HTTP Messages (Requests/Responses)
https://developer.mozilla.org/en-US/docs/Web/HTTP/Messages

Questions

  1. List three components of an HTTP request:

    1.
    2.
    3.
    
  2. What is the purpose of an HTTP method?

    Answer here:
    
  3. Match the method to its most common use:

    Method Purpose
    GET
    POST
    PUT
    DELETE

Part 3 , HTTP Responses

Read:

MDN → HTTP Messages
https://developer.mozilla.org/en-US/docs/Web/HTTP/Messages

Questions

  1. What information does an HTTP status code communicate?

    Answer here:
    
  2. Categorize the following status codes:

    Status Code Category (2xx, 3xx, 4xx, 5xx) Meaning
    200
    301
    404
    500
  3. Why is a 404 error considered a client-side error?

    Answer here:
    

Part 4 , Using Browser Developer Tools

Task: Inspect a Real HTTP Request

  1. Open your browser
  2. Visit: https://example.org
  3. Open Developer Tools (Right click → Inspect)
  4. Go to the Network tab
  5. Reload the page

Data Collection

  1. How many total requests were made when the page loaded?
Answer here:
  1. Click on the HTML document request. Fill in:
Field Value
Request Method
Status Code
Content-Type
  1. Name two headers sent by the browser:
1.
2.
  1. Name two headers sent by the server:
1.
2.

Part 5 , curl

Goal: Make HTTP requests directly from the command line and interpret the response.

If curl is not available on your machine, ask your instructor for an alternative (or use a campus lab machine).
Just use codespaces! macOS/Linux typically have it installed by default. Windows 10/11 usually includes it too.

Task A , Fetch a Page (Basic GET)

Run:

curl https://google.com
  1. What kind of content did you receive (HTML, JSON, something else)? How can you tell?
Answer here:

Task B , Show Response Headers (Inspect the Server Response)

Run:

curl -I https://google.com
  1. Record the status code line (the one that starts with HTTP/):
Answer here:
  1. Record two response headers you see (write them exactly):
1.
2.

Task C , Follow Redirects (3xx in Action)

Run:

curl -I http://google.com
  1. Do you see a redirect (e.g., 301/302)? If yes, what is the Location: header pointing to?
Answer here:

Now run the same request but follow redirects:

curl -IL http://google.com
  1. How many distinct HTTP status lines do you see now? (Count the HTTP/... lines)
Answer here:

Task D , Compare GET vs HEAD

Run:

curl -I https://example.org
curl https://example.org
  1. In your own words: what’s the difference between these two requests and their outputs?
Answer here:

Part 6 , HTTP vs HTTPS

Read:

MDN → HTTP Secure (HTTPS)
https://developer.mozilla.org/en-US/docs/Glossary/HTTPS

Questions

  1. What problem does HTTPS solve that HTTP does not?
Answer here:
  1. What role does encryption play in HTTPS?
Answer here:

Reflection

  1. Before this lab, you may have thought a web page was “just HTML.”
    After this lab, list three things that must happen before HTML appears on the screen.
1.
2.
3.

Submission Checklist

  • All questions answered
  • Developer Tools Data collected
  • curl outputs inspected (headers + redirects + HEAD vs GET)
  • Answerss

Optional

  • Visit a different site (e.g., https://www.wikipedia.org)
  • Compare:
    • Number of requests (DevTools)
    • Status codes
    • Resource types
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment