Visiting an E-commerce Website

Imagine you open your browser and type in www.example.com to browse for a new pair of shoes.

Step 1: DNS Resolution

• Your browser doesn't directly know where "www.example.com" is hosted. It sends a request to a DNS (Domain Name System) server to translate the domain name into an IP address (e.g., 192.168.1.1), which is like finding the address of the website.

• Refer the following figure from step 1 to 7 it resoves the website domain name (www.example.com) into its corresponding IP address (It all goes through domain name provider like GoDaddy Inc, Hostinger, etc, in step 4 and 5 as shown)

Step 2: Establishing a Connection

• Once the IP address is known, your browser and the server initiate a secure connection. This is done through a process called TCP/IP Handshake and, if secure (HTTPS), a TLS Handshake ensures encryption for the data you send and receive.

Step 3: Sending an HTTP Request

• Your browser sends an HTTP request to the server, asking for the web page.

  • Example: A GET request is sent for the homepage of the e-commerce website.

  • User data may consists of the values like price filter or brand filters

Step 4: Server Processing

• The server receives the request and processes it. It might:

  • Fetch data from a database (e.g., list of shoes of user specified brand).

  • Run backend logic (e.g., check if a promotion is active of marketing and discount).

  • Prepare an HTML page to send back to your browser .

Step 5: HTTP Response

• The server sends an HTTP response to your browser. This includes:

  • The HTML for the page layout.

  • CSS and JavaScript files for styling and interactivity (Because browser only understand HTML/CSS/JS).

  • Product images and other required resources.

Step 6: Rendering the Page

• Your browser takes the response and renders the page for you to see. You can now browse through the store.

Step 7: User Interaction

• Suppose you search for "red sneakers" in the store’s search bar. The process repeats from step 3:

  • Your input triggers an HTTP POST request with the search term.

  • The server processes the search and returns results.

Step 8: Data Storage and Tracking

• This step is for beter User experirnce and optimise use of API calls over netwrok

• Behind the scenes, the server may:

  • Log your activity for analytics.

  • Use cookies or local storage to remember your preferences.

  • Possibly interact with third-party APIs (e.g., payment gateways or shipping providers).

---

Summary of Key Concepts

1. DNS Resolution: Translates the website name to an IP address.

2. Connection Establishment: Securely connects browser and server.

3. HTTP Requests/Responses: Facilitates data exchange.

4. Server Processing: Handles business logic and data retrieval.

5. Page Rendering: Displays the content in the browser.

6. Interaction Handling: Manages user actions and tracks data - used for enhancements.

Thank you for reading ❤️🧑‍💻

~ Aashish Jha