And they worked together happily ever after

Jul 16, 2024

Lately, I’ve been talking at a high level about software doing a lot of different things and communication systems, sending all kinds of data.

Let’s put that together!
They’re here and they talk.
What shall we have them do?
What about something we all did? We all do?

When you type a URL into your browser and press Enter, several processes occur to display the web page:

DNS (Domain Name System) Lookup:
- The browser queries a DNS server to translate the human-readable URL (e.g., www.example.com) into an IP address (e.g., 192.0.2.1).
Establishing a TCP Connection:
- With the IP address, the browser starts a TCP connection with the web server.
Sending an HTTP Request:
- The browser sends an HTTP/HTTPS request to the server. This request typically includes:
  - The method (GET, POST, etc.)
  - The URL
  - Headers with more information (e.g., browser type, cookies)
Server Processes the Request:
- The server processes the incoming request:
  - Fetching the resource (e.g., an HTML file)
  - Executing server-side scripts (e.g., PHP, Python)
  - Accessing a database to get data
Server Sends an HTTP Response:
- After processing the request, the server sends an HTTP response back to the browser:
  - A status code indicating the result of the request (e.g., 200 OK, 404 Not Found)
  - Headers with metadata (e.g., content type, content length)
  - The body with the resource (e.g., HTML, images, CSS, JavaScript)
Browser Renders the Page:
- The browser receives the response and renders the web page:
  - Read the HTML to create elements.
  - Read the CSS files to apply styles to the elements.
  - Execute JavaScript code to add interactivity and dynamic content.

These steps occur quickly, usually within milliseconds to a few seconds, to provide a seamless browsing experience.

If you’re still with me, I’ve got another example.

I couldn’t resist this one, as it’s a huge part of my day-to-day as a software engineer.

Interesting right?

You’re happy with your code (or you’re fixing a typo, let’s be real, we all forget that ; sometimes) and you’re ready to save it all.

Enter git add and git push

And then what?
What’s the magic behind the scenes?

Few things:

Authentication
- SSH (Secure Shell): Uses SSH keys for authentication.
- HTTP/HTTPS: Uses username and password, or personal access tokens for authentication.
Find the Remote
- Git identifies the remote repository and retrieves the URL associated with it from the .git/config file in your local repository.
Local Repository State
- Git checks the state of your local repository, looking at the branch you’re currently on and the commits you’ve made.
Fetch References
- The remote references are fetched
Compare Local and Remote Repositories
- Determines which commits are present in your local branch but not in the remote branch.
Package Objects
- Git packages the objects (commits, trees, blobs) that need to be pushed
  - Finding Objects: Identifying the objects that are in your local repository but not in the remote repository
  - Packing Objects: Compressing these objects into a pack file to reduce the amount of data that needs to be transferred.
Establish a Connection to the remote repository
Send the pack file
Update References
Confirmation
- Finally, Git confirms that the push was successful and updates your local repository’s record of the remote branch.

This is how it may look like in your terminal:

Yay! Your code is out and safe.
Version control for the win!

I hope you enjoyed those 2 classic examples, I certainly learned a few details here and there as I was putting all this together.

Thank you for reading!
Adeline

Caching: what is it?
I’m not talking about cache this time, I’ll probably do a post later on though. In the meantime here’s a short intro:

Tech Tidbits