Understanding Web Basics

Summary: In this blog we will be understanding DNS, HTTP/HTTPS protocols, Understanding how the web works?, Exploring browser and rendering engines, Learning about web servers and working of emails.

Domain Name System

DNS is the core of web infrastructure it translates the domain names into ip address as a browser needs the ip address of the server to make requests, browser can not understand the domain name such as www.google.com.

Working Of DNS

DNS is not a one server there are hundreds of them distributed across the world which helps the fast translation of domain names.

ref: https://imgur.com/2LAiZ1Q

First browser checks its cache if not found then it asks OS, then OS checks its cache if not found it sends the request to the DNS Resolver. DNS Resolver seats between the OS and the other DNS servers.

Then DNS Resolver send requests to other types of DNS server for example if DNS root server found only ip of TLD like .com then it returns the ip to DNS resolver then it requests the server whose ip is returned and continued until it finds the final IP of server.

DNS overriding

DNS overriding can be done by manipulating the systems etc/hosts file then we can point some specific domain to the ip address that we choose like 127.0.0.1. It is really helpful for the offline testing.

In Linux we can do this by editing etc/hosts file below is the example hosts file:

127.0.0.1       localhost
# Custom host mappings
192.168.1.100   example.com
192.168.1.101   subdomain.example.com

HTTP/HTTPS

These are the standard protocols used to send and receive request on the internet. HTTP was first used for a long time but it was not secure at all, so HTTP Secure (HTTPS) was introduced which solved the security problems faced by the HTTP such are man in the middle attack.

Learn about the man in the middle attack from man-in-the-middle-attack.

  • HTTPS uses the SSL/TLS to establish a secure encrypted connection between clients browser and the server.
  • Server uses HSTS (HTTP Strict Transport Security) which is a security policy which only accepts the HTTPS connection from client and terminates the HTTP requests.

Learn about how the secure handshake happens from howhttps.work.

ref love2dev.com.

How The Web Works

  • On the Web when we visit some website using the domain name it sends request to the server using the ip received form DNS server for that domain name.
  • But its not like we are directly requesting the main server there is a proxy server which seats between the requests and main server. Proxy server are used for various reasons like security, content filtering, caching, load balancing, access control and more.
  • Proxy sever checks the request and checks if there is cache (if caching is set up) else forwards the request to the main sever. Main server will return static HTML, CSS and JavaScript if this is a static site else it will dynamically create these files using something like PHP and then send those files to requester.
  • One of the main part of web is the caching as it happens at every point of web request like DNS cache, CMS cache, on server we can use service like Redis for cache.
ref: request-cycle

Browser and Rendering Engines

All browser serves the same purpose but the core behind the browser varies that core is called rendering engines which manages all task like fetch requests, rendering DOM, networking, JavaScript execution.

There are a lot of rendering engines but these are the notable ones:

  • Blink: used by Chromium which is used as a base for browser like Chrome, Microsoft Edge, Opera and Electron, it is forked from Webkit and developed by Google.
  • Gecko: it is primarily used by Mozilla Firefox, and developed by Mozilla Foundation.
  • WebKit: it is primarily used by Apple for its Safari browser, and developed by Apple.

Rendering Steps:

  1. Parsing HTML: The HTML code is parsed and then used to create DOM tree.
  2. Parsing CSS: The CSS code is parsed and then used to create CSS Object Model for styling of the page.
  3. Render Tree: Render tree is build by combining DOM and CSS Object Model.
  4. Layout Flow: Calculations are done in this step to determine size and position of the element in the web page.
  5. Painting: This is final and most crucial step, conversion of the render tree to visual representation is done by browser engine.
ref: the-rendering-process-of-a-web-page

Web Servers

Web server are responsible for handling the request from the browsers or some other web client. It handles communication with the databases for retrieving, or saving data.

Nignx and Apache are some example of web servers which are build to serve website and web services.

Nginx

  • Nginx can be used for serving static content such as HTML, CSS and images it also supports dynamic content such are PHP scripts.
  • Nginx provides features such as caching static or dynamic content in the memory and on disk so the backend server can have less load.
  • Nginx is optimised for performance and efficiency so that can handle thousands of concurrent connections with low resources consumption.

For more in depth guide checkout freecodecamp.org/the-nginx-handbook

Emails

As we know Emails are some of most used communication method, we can send each other message using email address. But when we talk about emails as in context of big website and applications they have to send thousands of emails so that they have dedicate servers for handling emailing know as mail servers.

  • When we develop locally we don’t wan’t to use commercial services we can use Mailhog as fake email sever to help us test our applications.
  • For the production there are mail server available such are AWS SES and Gmail SMTP.

To install and learn about Mailhog checkout github.com/MailHog.

Email Protocols

There are different email protocols which are used to send or receive email, every protocols have there pros and cons. Email does not use same protocol to send and receive emails SMTP is used to send email and can not be used to receive email, for receiving email IMAP or POP3 is used.

SMTP (Simple Mail Transfer Protocol)

SMTP protocol specialises in sending, relaying or forwarding emails from mail client to the receivers email server.

IMAP (Internet Access Message Protocol)

IMAP protocol specialises in receiving and managing emails form receivers email server. IMAP supports multiple device by keeping the mails on receivers email server.

POP3 or POP (Post Office Protocol)

POP protocol also specialises in receiving and managing emails form receivers email server. POP does not support multiple device because it deletes the email form receivers email sever after downloading.

ref: smtp-or-imap

To learn more about email checkout how-does-email-work-a-dummies-guide.

«
»

Leave a Reply

Your email address will not be published. Required fields are marked *