Decoding Web Jargons 🌐

Welcome learners!

This blog will be all about decoding some jargons related to the web world. Jargons won’t remain jargons anymore! After reading this blog, you will be confident enough to explain to anybody what these jargons mean, even if you are explaining to a 10 year old! as this blog will be having some real life examples to make learning more interesting! So let’s dive into it.

HTTP

The first jargons which governs everything in the web world is HTTP. Let’s decode each alphabet in HTTP one by one.

HTTP → Hyper Text Transfer Protocol

Hyper Text ⌨️

Actually Hyper can not be read singularly and has to be complemented with Text in order to understand what this truly means.

All of us know what exactly a text is. A hyper text is just a text with added ability to point to other resources (web pages, documents, videos, images etc.) It takes you to those resources when clicked upon.

You click on a link and it gets you somewhere, that’s hyperlink!

You search google and you get the above link, this is a text, but a hypertext! because on clicking, it takes you to google’s homepage.

Transfer ⇢

Web is all about transferring (sending/receiving) data from one point to another, probably from client to server (send) and vice-versa (receive).

So, the transfer keyword in HTTP, tells that something is being transferred.

Data through hyperlinks is being transferred.

Protocol ❗

Now, there must be some rules/guidelines regarding the transfer as well. These set of rules/guidelines is called Protocol.

Now, read it backwards and it will make more sense → Protocol (rules/guidelines for) Transfer (sending/receiving) Hyper Text (data through hyper text)

Read only the highlighted portion.

Stateless Protocol

State means the condition of something. You might have read → Solid state, Liquid state, Gaseous state.

Stateless means there is no state. It does not make sense right? Actually think of state as memory for sometime, Stateless → Memoryless.

Web is all about requests and responses. Stateless, therefore simply means, there is no memory of the previous requests that have been generated. That’s it.

HTTP has always been a Stateless Protocol.

Cookies 🍪

If HTTP is stateless then how is it possible that browser remembers that you are logged in throughout your session? If it does not remembers the previous requests then why does not it keep on asking you to login again and again? How are you logged in throughout? Even if you close a tab, how are you logged in after reopening again in another tab?

Answer to all the above questions is COOKIES! 🍪

With the first response server sent back a cookie_id to the browser → browser now sends this cookie_id to the server with each subsequent request → server identifies the user through this cookie_id

Picture credit → FourZeroThree (youtube channel) https://www.youtube.com/@fourzerothree

Session 👨🏻‍💻

It helps in maintaining the state across multiple requests.

Difference between session and cookie → Cookie is stored on client side while session is stored on server side, hence it is more secure than a cookie.

Lifetime of a session is also shorter as compared to a cookie.

Fun Fact → Session_ID is also stored in the form of a cookie!

Session cookies expire when browser is closed. While persistent cookies expire after a set time (let’s say, after 30 days).

Example → You started coding at 9:00 PM and ended at 11:00 PM and turned off your laptop. That was your session for 2 Hours.

HTTP Headers 💆🏻‍♂️

This is just the information (metadata) that the server sends to the browser and vice-versa. These are of 2 types →

1. Request Headers (Browser → Server) (Example → Host, user-agent, accept etc.)

2. Response Headers (Server → Browser) (Example → cookies, date, content-type etc.)

Example → You asked your friend to hand over the gold bricks to a man under the secret bridge at 5:00 PM. The gold bricks (data-type) and 5:00 PM (time) is the information passed in headers (metadata)

Request - Response Model

It is just a model for the communication between browser and server.

Both Browser & Server can send request. Hence a request is of two types →

1. Client-Side Request (Made by browser)

2. Server-Side Request (Made by server)

Request can be of various types → (GET, POST, UPDATE, DELETE etc.) Request is performed over a URL & contains headers. It can contain cookies as well.

Response is in code (numeric) format → (404, 400, 500, 200 etc.)

Example → You said to your friend to gift you chocolates (request of type : GET) He gifted you chocolates in response to your request (response code : 200)

Transfer Control Protocol ⇢

Transfer → Sending of something.

Control → Having a hold over something (For example → Your life is in your control)

Protocol → Rules/guidelines about something.

It basically boils down to → ‘Rules about how the sending of something will be controlled’

File Transfer Protocol 📂

Rules about how the sending of files will be controlled

File can be → MP3, MP4, JPG, PNG, SVG, XLS etc.

Example → Your friend told you to take chocolates (file) to his home, but if the chocolates are over 1KG (size of the file) then carry them in a jute bag instead of plastic bag. It is a protocol isn’t it!

Internet Protocol (IP) 🌐

Rules regarding how the data packets are transferred between various devices across the internet.

Data Packets → Data is transferred in small chunks across the internet. These small chunks are known as data packets.

Uniform Resource Locator (URL) 🌐

The above figure shows what a URL looks like.

Uniform → Because all of the URLs have similar structure.

Resource → The thing that you are trying to access through the internet.

Locator → It enables the browser to find your desired resource across the internet (just like the address)

It is just like the map you use to go somewhere.

Domain Name System / Server 👾

It maps the name of the domain (for example → google.com) to it’s corresponding IP Address because computers don’t interact through human readable formats across the network.

IP Address 📍

Picture Credit → Investopedia https://www.investopedia.com/terms/i/ip-address.asp

The above pictures describes it well enough to understand! It is just like the address of your home!

PayLoad 💯

Just like we saw that Headers are metadata (additional information) about something (request/response), PayLoad is the actual information about something (request/response).

For example → For logging in you send over the username, passwords. This is actual data and hence PayLoad

Example → You ordered something online and got the parcel from a courier service guy. The parcel is the payload because it is the actual item needed & not the person who handed it over to you.

Cache 🏦

Cache is a temporary memory used to store the frequently accessed data.

Example → Facebook has millions of users, If all of them had to fetch their profile pictures every moment they login to their accounts then this would have been so heavy on the system as well as costs would have risen up. This is where Cache Memory comes into play, it stores frequently accessed data.

Example → You need a pen almost everyday. You don’t daily go to a shop to buy it whenever needed. You place it on your table inside a pen holder. This pen holder is your cache because it lets you access pens in a very fast way.

HTTPS 🌐

HyperText Transfer Protocol Secure.

It is same as HTTP just the data that is shared between client and server is Encrypted

Transport Layer Security (TLS) 🔒

It is what works behind the scenes in HTTPS.

TLS is a cryptography protocol used to secure the communication over a network (mostly, internet).

HTTPS is secured using TLS.

Encryption 🔒

It is making something secure.

Example → You gave gold bricks to your friend through a common friend but secured it by placing the bricks inside a password-protected suitcase. This password protected suitcase is Encryption!

Conclusion 😁

Knowing these jargons (I am sure by now these jargons would be looking as just easy-to-define words to you) is extremely important as these govern the whole of the web world. Any developer should be aware of these terms and this blog is written to make the process simpler and easier. I hope you enjoyed reading and learning!