Web Based Application Architecture
The HTTP protocol is a request/response protocol based on the
client/server architecture where web browsers, robots and search
engines, etc. act like HTTP clients, and the Web server acts as a server.
Client: sends a request to the server in the form of a request method,
URL, and protocol version, followed by a MIME-like message containing
request modifiers, client information, and possible body content over a
TCP/IP connection.
Server: responds with a status line, including the message's protocol
version and a success or error code, followed by a MIME-like message
containing server information, entity Meta information, and possible
entity-body content.
Three Tier Application in Web Development
In web development, the tiers have different names but perform similar functions:
- Web Server: presentation tier that provides UI (webpage/website). The content can be
static or dynamic. Developed using HTML, CSS, Javascript.
- Application Server: middle tier, houses the business logic used to process user inputs.
Developed using Python, Ruby, PHP. Runs a framework like Symphony, ASP.NET.
- Database Server: data or backend tier of a web app. Runs on DBMS.
Web Application Architecture
It is a blueprint of simultaneous interactions between components, databases, middleware
systems, user interfaces, and servers in an application. Also described as the layout that
logically defines the connection between the server and client-side for a better web experience.
Why is Web Application Architecture Important?
- Web app needs an architecture to lay a strong foundation
- A well-thought web app architecture can handle the various loads and adapt to the
changing business requirements to deliver a fast user experience that further improves
the app performance.
- Several dev tasks can be done simultaneously by dividing the structure into small
modules. This rescues the development time as well.
- Makes it easier to integrate new functionalities without affecting other components.
How does the Web App Architecture Work?
All applications involve 2 primary components:
- Client-side: the frontend, coded in HTML, CSS, Javascript & stored in the browser.
Allows user interactions.
- Server-side: backend, coded in Java, PHP, Ruby, Python etc.
Database server is an additional component which sends the requested data to the server-side.
Layers of Web App Architecture
1. Presentation layer: built with HTML, CSS, JavaScript, and its frameworks, enables
communication between the interface and browser to facilitate user interaction.
2. Business layer: defines the business logic and rules. Processes browser requests,
executes the business logic associated with the requests, and then sends it to the
presentation layer.
3. Persistence layer: responsible for data persistence (aka Data Access Layer). It’s closely
connected to the business layer and has a database server that retrieves data from
corresponding servers.
4. Database layer: (aka Data Service Layer), holds all the data and ensures data security
by separating the business logic from the client-side.
All these layers work independently in isolation. Components of one layer are closed and deal
with its logic. This does not let the changes in one layer affect the others.
Web Application Components
Web app components are divided into 2 parts:
1. UI components: part of the visual interface of a web app. Have no interaction with the
architecture.
2. Structural web components: client and server components. Client components exist the
the user’s browser and interact with the functionality of web apps. HTML, CSS, JS are
commonly used to build these components.
Model of Web Apps
- One web server, One DB Model: a little outdated as there’s only one server and db to
handle all requests. If the server goes down, so will the app. Used for test practices and
a good option for startups with budgetary constraints.
- Multiple web servers, One DB Model: Backup server is available hence data failure risk
is reduced but, with only one db, chances of website crash still exist.
- Multiple web servers, Multiple DB Model: reduces the app’s performance risk since
there are two options for db storage. You can store identical data on all the dbs or
distribute it evenly among all servers.
Ensure your web app’s architecture has: system flexibility and efficiency, component reusability,
well-thought code structure, high scalability, stability, reliability, sections to collect user
feedback, easy bug detection through A/B testing, Utilization of security standards.