Web architecture involves multiple components like database, message queue, cache, user interface & all running in conjunction with each other to form an online service.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/8518fdef-0fc6-4a5f-9a97-1f8afa26a569/Untitled.png

This is a typical architecture of a web application, used in the majority of the applications running online.

If we have an understanding of the components involved in this diagram, then we can always build upon this architecture for more complex requirements.

Client Server Architecture

Client-Server architecture is the fundamental building block of the web.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/36aaa32a-70a8-4e82-ada9-76d3c5ad4420/Untitled.png

The architecture works on a request-response model. The client sends the request to the server for information & the server responds with it.

Web application like Facebook, Twitter or your banking app is built on the client-server architecture.

Client

The client holds our user interface. The user interface is the presentation part of the application. It’s written in Html, JavaScript, CSS and is responsible for the look & feel of the application.

The user interface runs on the client. The client can be a mobile app, a desktop or a tablet like an iPad. It can also be a web-based console, running commands to interact with the backend server.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/859522ac-b8b1-43f4-aabd-4820e4c7a865/Untitled.png

Technologies Used To Implement Clients In Web Applications

In very simple terms, a client is the window to our application. In the industry, the open-source technologies popular for writing the web-based user interface are ReactJS, AngularJS, VueJS, Jquery etc. All these libraries use JavaScript.

Types of Client

There are primarily two types of clients:

  1. Thin Client
  2. Thick Client (sometimes also called the Fat client)