Web Application Architecture
Web Application Architecture enables the connection and interactions of multiple components such as the application, database, and middleware so that numerous applications can function together with each other. From tapping in keystrokes to type the URL in the address bar of the browser to connect to the DNS server, and the browser loading the page requested, the web application passes through multiple levels of functioning. This is managed, organized, and processed through various means and structures. This article explains various patterns and architecture that can be implemented to develop web applications.
Patterns
While developing Web Application Architecture, the solution architect and developer should focus on working with the preexisting methods instead of reinventing the wheel. Various patterns have been in use to develop complex systems and they are discussed below.
Layered Approach
Multi-tier, Three Tiered
The Three-Tiered architecture is a widely practiced application architecture for software where the organizing is done into three tiers:
- Presentation Tier
- Logic Tier
- Data Tier
Tier is designed for implementation. Layers can offer a lot more than tier and are different from tier and thus can’t be used interchangeably.
Presentation Tier
The presentation tier is the communication and user interface layer of the application. This is where the end-user interacts with the system via the application. It is the topmost tier and can be accessed by the end-user in the form of a desktop application, graphical user interface (GUI), or simply by running on a web browser. The Web Presentation tiers are mostly developed by using HMTL, CSS, and Javascript while desktop applications could be written in multitudes of languages which depends on the platform. The main types of presentation tiers are in the following forms.
- Mobile Application
- Web Application
- Desktop Application
Logic Tier
Also known as the application tier or middle tier, this is the heart and soul of the application. The information which is collected in the presentation tier is processed using specific sets of business rules which are known as business logic This layer is responsible to process CRUD (Create, Read, Update, Delete) in the data tier. This tier is mostly developed using programming languages such as C#, Python, Java and is communicated to the data tier through API calls. Some examples of functionality performed in the Logic tier can be as follows.
Data Tier
This tier has multiple names, data access tier, back-end, and even database tier. The main information is processed in this tier for the application where storage and management of data are also performed. It can be of two types.
- Database eg., MySQL, PostgreSQL, Oracle, NoSQL, Microsoft SQL, and more.
- Storage
Here, the communication is performed through the application tier such that the presentation tier and data tier can’t connect to each other directly.
Model View *
There are numerous forms of software design pattern which are widely used to develop user interfaces to subdivide program logic into elements that are interconnected. Some of the ways are as follows.
Model – View – Controller (MVC)
This is one of the most commonly used software design patterns for designing web applications where the development of user interfaces is done by dividing the related logic of the program into three interconnected elements – Model, View, and Controller. The data structure of the application is present in the model which manages the logic, rules, and data of the application. The view consists of the various representation form of the information the controller accepts input to convert it into commands for view and model.
![]()
Model – View – Presenter (MVP)
The MVP user interfaces architectural pattern enables automated unit testing with the presenter taking the role of the middle person with all presentation logic which is pushed to the presenter.
![]()
Model – View – View Model (MVVM)
The MVVM architectural pattern enables the development of GUI to be separated through markup languages and GUI code such that business logic doesn’t depend upon any certain model platform.
![]()
Event-Driven Architecture
The development of highly scalable applications is enabled by the distributed asynchronous architecture pattern also known as event-driven architecture. It mainly consists of two topologies: the broker and the mediator. Thus, with Event Sourcing, it is ensured that the event object handles and captures the state of an application with the event objects storing in sequence. This is done via Publish and Subscribe events.
![]()
It can process the activities as events such as order placing and order ready.
Order Placed
- Account Charge
- Inventory Check
- Inventory Deduct
Order Ready
- Ship Package
- Update Order
Watch this video to learn more about Application/ Web Architecture.
Command & Query Responsibility Segregation (CQRS)
The CQRS stands for Command Query Responsibility Segregation. This pattern separates the operations of reading and updates for data storing. Maximization of Performance, Security, and Scalability are the benefits of implementing the CQRS pattern. Migrating the system to the CQRS approach helps the system to evolve better in time preventing merger conflicts at the domain level due to update commands. Unlike the traditional approach which would be well enough for simple CRUD operations, the complex applications would face issues with the traditional architectures. But with CQRS, making commands task-based rather than data-centric, asynchronous processing and separating the read and write into different models, this isolation provides a better approach to update and query data.
CQRS + Event Sourcing
Command & Query Responsibility Segregation (CQRS) is commonly used with Event Sourcing. This sort of combination leads to a new kind of CQRS which involves modeling the state changes that are the done by applications as a log of events or sequence which are immutable.
![]()
Plug-in
Micro-Kernel
Micro-Kernel is the bare minimum amount of software with which if provided, an operating system (OS) can be implemented. Thread management, low-level address space managed and inter-process communication are included in this mechanism.
![]()
Service-Oriented Architecture (SOA)
The SOA architectural style supports the orientation of service such that application components provide services to other components. The SOA is implemented with web services using standard internet protocols to make functional building blocks accessible.
![]()
Microservice Architecture
Microservices Architecture is basically an architectural style of structuring an application as a collection of services such that they are loosely coupled, highly maintainable, independently deployable, and are organized about the business capabilities. This architecture of structuring the application enables even complex, large applications to be delivered in a rapid and reliable manner. The technology stack of the system is also supported to be evolved easily in time. Microservices basically focuses on the single–responsibility principle.
Acme Widget
In order to design an Acme Widget with services like Account Service, Inventory Service, Shipping Service, Order Service, Microservices can be used as each of these services are independent of each other.
Serverless Architecture
This architecture is all about the Cloud, and not performed on-premises. Serverless is basically a method of computing where the demanded resources are made available as they are needed by the processes. The engineers can code and deploy their systems without having to worry about the infrastructure that lies underneath. Since the client only pays based on the computation used, the old methods of having to pay a fixed amount for specific bandwidth and number of servers have now become obsolete and they play on a rolling basis as the use of the service which supports auto-scaling.
Thus, in this article we learned about three-tiered architecture, model view * patterns, event-driven architecture, and CQRS. We also discussed Micro-Kernel, SOA, Microservice architecture, and Serverless Architecture. This will expand our scope, learning, and understanding of web architecture as a whole.