Learn Web App Architecture - Web App Architecture - AnonyViet

Web application architecture describes the layout of all the components of a web application and also highlights the interaction between different application components, third-party middleware systems, web services. and database. This provides a bird’s-eye view of the interactions between several applications that work together to provide services to the end user.

Join the channel Telegram of the AnonyViet 👉 Link 👈

Difference between software architecture and software design

Software architecture is about highlighting all the high-level components of a system and the interactions within them.
Software design is code level design that focuses on distributing the logic of the application into different modules with its own specific purposes. This helps to build and manage the logic of the application.

Web application architecture diagram

User Agent

User-Agents are primarily tools that help users interact with the server. The main users interact with the server using a web browser – Google Chrome, Firefox, Microsoft Edge, Safari and mobile apps on Android and IOS platforms. User-Agents sends a request to the server and receives a response which is then displayed to the user.

DNS

The Domain Name System is like an address book for websites. Whenever a user sends a request to a web address using the browser, the browser uses DNS to find the actual address of the web server (IP Address) before it can send the request. The browser needs to figure out which server the website is hosting on, so that it can send HTTP requests to the right place.

Load Balancer

The Load Balancer mainly deals with horizontal scaling. It directs incoming requests to one of the many servers, and then the load balancer sends the responses it receives from these servers to the user. Typically, web application servers exist as multiple replicas that mirror each other to provide consistency and availability. Load balancers distribute tasks between them. It works well with server auto-scaling.

Virtual Machine (Virtual Machine)

Virtual Machine (VM) virtualization/emulation of computer systems. Virtual machines are based on computer architecture and provide the functionality of a physical computer. Their implementation may involve specialized hardware, software, or a combination of both.

Web Server

The webserver processes the user’s request and sends a response consisting of data (HTML, JSON, XML, etc.) back to the browser. Web servers hosted on virtual machines use the computing power provided by virtual machines to perform their tasks. Webservers often involve back-end infrastructure such as databases, cache servers, job queues, and others.

Databases

Databases provide tools to organize, add, search, update, delete, and perform calculations on data. Generally there are relational databases – MySQL, PostgreSQL, Microsoft SQL Server, Oracle Database and Microsoft Access, etc. and non-relational databases – MongoDB, Dynamo DB, etc.

Caching Service

Caching service (Caching service) provides the ability to store data, allowing data to be stored and searched. Caching allows you to refer to previous results to perform calculations much faster. Caching can be applied and leveraged in different layers of technology including Operating Systems, Network layers including Content Delivery Networks (CDNs) and DNS, web applications, and Databases.

Client-Side — HTTP Cache Headers, Browsers
DNS — DNS Servers
Web — HTTP Cache Headers, CDNs, Reverse Proxies, Web Accelerator, Key/Value datastore
App — Key/Value Datastore, Local Caching
Database — Database Cache, Cache, Key/Value datastore

Content Delivery Network (CDN)

A Content Delivery Network (CDN), is a geographically distributed network of proxy servers and their data centers. The goal is to provide high availability and performance by spatially delivering services in relation to end users. CDNs serve a large portion of Internet content including web objects (text, graphics, and scripts), downloadable objects (media files, software, documents), applications (commercial electronics, portals), live streaming media, on-demand streaming media, and social media sites.

External Storage

External storage is used to store content including images, videos, documents, and other large files. In many cases, operations are also performed on these files. Example – Youtube automatically converts user-uploaded videos in multiple resolutions. Facebook converts users’ images and videos into a mobile-friendly format. Because storing these data on the VM’s local disk can be expensive and consuming a lot of computing resources, they are usually stored in external storage. Cloud storage is one of the most popular options.

Cloud storage is a cloud computing model that stores data on the Internet through a cloud computing service provider that manages and operates data storage services. It is offered at the right capacity and cost, while eliminating the need to purchase and manage your own data storage infrastructure.

Web Services

Web services provide a common platform that allows many applications built in different programming languages to communicate with each other.

Web services use SOAP (Simple Object Access Protocol) to send XML data between applications. Data is sent via HTTP Request. The data sent from the web service to the application is called a SOAP message. SOAP message is nothing but an XML document. Since the document is written in XML, the client calling the web service can be written in any programming language.

There are mainly two types of web services.

Simple Object Access Protocol or SOAP web services.
Representational State Transfer or REST.

Data Warehouse

Data Warehouse is a system used for reporting and analyzing data and is considered a core component of business. Every modern application collects, stores, and analyzes data. DW is a central repository of integrated data from one or more disparate sources. They store past and present data in a single place used to perform business intelligence and generate analytical reports for the business.

The two main approaches used to build a data warehouse system are Extract, Transform, Load (ETL) and Extract, Load, Transform (ELT).

These three mandatory processes are:

Extract: Extract data from multiple sources.
Transform: Transform data including cleaning, filtering, and classification.
Load: Load the data in the storage to import the datastore.

Model of web application components

There are only three models of web application components. It is closely related to the number of services and databases used for a web application.

A web server, a database
Multiple web servers, one database
Multiple web servers, multiple databases
Application Service

The three models are called “Monolithic” due to the stable and rigid nature of their servers. In contrast, application services (microservices and serverless) tend to be more agile because they simplify upgrading and scaling. Applying this model allows to divide web servers into smaller parts: ‘services’ in microservices and ‘function’ in serverless. Therefore, it is easier to modify and scale independently using each type.