How a Web Application Works: From Beginning to Boundaries

My dear reader, how are you? السلام عليكم

Hard is trying to rebuild yourself, piece by piece, with no instruction book, and no clue as where all the important bits are supposed to go. – Nick Hornby, A long way down

I am writing this post to solve the pieces of a puzzle I am dealing with. If you are dealing with the same, maybe I can help you? 🙂 We will answer how a web application works from the very beginnings, revise the concepts and dive into the modern day web applications development. But the scope of this post is limited to revise the basics of the internet and the web.

Start with the picture of the Internet that you have in your brain. Is it a cloud? If yes, then you are among the 90% of the people who do not know how the internet works. But, that is fine. Let us be a child again and understand it. A simple answer is: the Internet is a wire buried in the ground (not a cloud), with the help of which two computers can communicate. How does it work? DirectMe.

Many people nowadays use the terms internet and web (or world wide web, www), interchangeably. They are different. A simple to understand the difference is that the internet is the physical network of computers all over the world and www is the virtual network of websites connected by hyperlinks (or links) and referenced by URIs. So, www is a part of the internet or service of the internet. Learn more at DirectMe.

First, we need to revise the internet model (OSI) and the different layers, i.e, application, transport, network, link, and physical. Revise it here DirectMe.  A little generic summary of the video is as follows. The websites on the www communicate with each other based on some rules called the protocols or formally the transmission control protocols or internet protocols (TCP/IP) initially written by the founding fathers of the internet, Vint Cerf and Bob Kahn. The current latest version of these protocols is IPv6. The communication on each layer is governed by their own protocols.

HTTP is the most common and visible application layer protocol over the www. The purpose of this underlying protocol is to define how the messages are formatted and transmitted over the web. Insights of the HTTP working? DirectMe. The secure version of it is HTTP is HTTPS that is equipped with security encryption by transport layer security (TLS) and its predecessor (SSL). The latest version of TLS is 1.3 released in August 2018. BTW, have you heard about HTTP 2.0 or commonly known as WebSocket protocol which is an advancement of HTTP to provide full duplex-communication and is under the process of being standardized by W3C. Know more DirectMe. Who is currently using WebSockets? mm well, most prominently WhatsApp.

A web application is a piece of software which can be accessed from a browser. The browser is another software that helps to access the web, i.e., IE, Chrome, Firefox etc. Consider a web application just for now as an application hosted on a web server. And a web server is a network layer application running on a real time machine and being listened by a port. A web browser is usually called a web client or a user agent in a more formal way. Only a browser is not a web client. Any application that can access a web server is a web client, for example, cURL or telnet. Now, with these pieces of information, we can connect the dots by saying that a web application communicates with a web client using HTTP protocols defined in IPv4, or IPv6. In simple, the client and server interact with each other through the request-response model. Learn more about the model implementation in detail for a real-time Django based web-application development framework DirectMe.

Let us now understand the workings of a web application by starting with defining a web resource. A resource is a document like HTML, pdf, JSON or XML file which is hosted by a web server. HTML is the most common and standard web resource. The resource can be static (which does not change) or dynamic (which is generated on the fly with clients interaction, such as, time) Learn about it, DirectMe. Need more information? DirectMe. (I know this is not a great video to share at this time in point as information here is hard to digest, but, this will make you curious to learn more on dynamic data visualization using d3). The web resource is identified by a unique identifier called URL.

In the future posts, we will discuss the learning resources for web services, REST specifications with its API and web services, software architectures, n-tier architectural patterns, the client-server models, web applications (traditional and cloud-native), microservices and microkernels, the development frameworks and so on. I am creating a new category on my blog for all of these with label ‘web-journey’ under ‘IT’. Stay tuned!

Leave a Reply

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