Before starting web development, the learners are always given an intro on how things actually work on the internet. We get to know how the URL gets translated into an IP address and a connection is set for the exchange of data. I will try to explain the process in greater detail through the example of our favorite google.com. So, I will go through each and every step and explain those steps through images and examples.

1-The first thing browser does is a DNS lookup to get the IP address of the URL

When you type google.com the browser automatically adds http:// by default, note here that it is very much possible that DNS cache had already stored the information to call it at https:// and not http:// otherwise you will get an internal redirect response.

You can see the status code 307 and the location mentioned in Response Header. You will get something similar if you type google.com . HTTPS is just a more secure protocol. DNS resolves the domain name to get an IP address. Depending upon how popular the domain is DNS may give you any one of the IP addresses from a pool of IP addresses assigned to the Domain. This load balancing decision could be based on a combination of geolocation, server load, and other details.

2- The Browser establishes a TCP connection with the web server.

HTTP is an application layer protocol and HTTP requests are made at TCP connections(at the transport layer). After the IP address of the domain is found the browser establishes a TCP connection with the server hosting google.com. You might have noticed a :80 or :443 at the end of the IP address, they are not a part of IP address but port number. HTTP default port number is 80 and HTTPS port number is 443. You can visualize port number as the shop number in a shopping mall, where IP address points to the particular shopping mall and port number to the particular shop number we want.

3- Once the TCP connection is established an HTTP request is sent to the browser

You can see here the Request Method is GET, which signifies that the browser is asking for data, other requests are PUT that updates or create a record or POST which is used to send data primarily for storage.

4-When a successful HTTP request is made the web server performs the requested CRUD operation and return a success response (200)

You can see the status code :200 when the requests have been successfully implemented.

5- The resource returned by the web server could be in any of the supported formats, in our case it will be an HTML text.

If you see the content-type in response header you can find the format for the website you are looking for.

You can also see there is a server field it tells you on which server the domain is hosted.

6- The browser renders the page using the HTML response. If there are linked images, scripts and/or stylesheets, they are fetched with subsequent HTTP requests until all resources have been loaded

You might know that any HTML code has many links to images/scripts/stylesheets that makes the website look beautiful, adds logic to the website and all. This all is done after the browser starts rendering the HTML response and fetching the other linked resources. The browser is done rendering the requested URL when all the required resources are loaded.