What happens when you press enter in a browsers search bar?

Recently I started to make websites but didn't really know how fundamentally the browser works or talks to the server. So thought I could make a post about it.

First there are a couple of terms that everyone should familiarize themselves with:

1. Web page - document that can be displayed inside a browser. These are often called "pages" and written in HTML.
2. Website - collection of "pages" that are grouped together into a single resource. There are links that are connecting these "pages".
3. Web server - computer that holds the resources associated with the website.
4. Search engine - service that allows you to find all kinds of websites.
5. Browser - software that request, retrieves and displays web pages from the internet.

These terms might be simple and you already know them. However there could be a misconception between a search engine and a browser also web server and a website. For example when we open a browser some people might think that it's a search engine or when a web server is not responding they refer to it as the website is not working.

open up FireFox
The first thing there is already a new tab. Inside the search bar where the website URL goes there is some placeholder text -

As we can see that it offers us two options:

1. Search for something using Google (search engine).
2. Enter a address.

Let's enter a address. - example.com

First of all how does it know where it could find this address (example.com) domain? This is where DNS comes into play. DNS is short for Domain Name System. In short it maps domain names (example.com) with IP addresses. So your browser essentially requests to a DNS server - "What is the IP address of this domain?". Then if it locates that IP address to the requested domain name then returns it to the browser. DNS involves a lot more steps between.

When browser retrieves this IP address it sends a HTTP request to that IP address and asks if it could get a copy of the website to the browser. This IP address is a web server where the website resources are located. All of these messages between browser and the web server are using TCP/IP.

If the website approves this request it will respond to the browsers request with a "200 OK" response message. After this response message it will start sending the website files as a series of chunks or so called packets.

Then the browser will put these packets together and show the web page. In some sites they can have dynamic content so based on your actions more requests could be made and more packets put together to show a different page or something more to a page.

My analogy - Let's say you want to wear a green T-shirt today. You can't find it anywhere. You ask your mother - "Do we have a green T-shirt"? She responds - "your brother has one". You go to your brother and ask - "could I wear your green T-shirt." If you have a good relationship with your brother he will give it to you :). In this case you are the browser, your mother is the DNS server. Your brother is the web server. You are making a request to your brother and getting a response.

This might not be the best analogy :D. Don't know how DNS works completely. From this analogy could mean that you are talking in one language to your mother and in a another to your brother.
Let me hear some of your analogies! Have heard about a road where you are going to a store.

Next topics I could write about: HTTP requests and responses, TCP/IP, packets, URL, dynamic websites. Later on will write more about DNS seemed a bit complicated.