Web application architecture outlines web app components, their connections, and dependencies. It defines the organization and interaction between back-end and front-end elements, as well as their communication with external services so that all components create a unified product.We divide web application architecture types according to four criteria: by rendering method (client-server and single-page application architecture), by deployment strategy (microservices and monolithic), by the operational model (server-based and serverless), and by tenancy model (single-tenant and multi-tenant).
To illustrate the process, let’s open any web page:
1. Visiting a website
You enter the URL in the browser’s address bar. The browser recognizes your request and sends it to the server using the HTTPS protocol.
2. Processing the request
The web server catches the requests and replies with HTML code – standard code your browser understands.
3. Parsing
A browser analyzes the received code. It reads the HTML and processes JavaScript. The given code can contain links to other resources like images, videos, or stylesheets, and the javascript code can request additional data from the server.
4. Getting additional data
A browser downloads needed assets like images or fonts, while on the back end, a web app connects to third-party services such as payment gateways or maps if required.