Web essentials

By-Shraddha Nikam
Client-Server Model

The Client-server model is a distributed application structure that partitions tasks or

workloads between the providers of a resource or service, called servers, and service
requesters called clients.

In the client-server architecture, when the client computer sends a request for data to the
server through the internet, the server accepts the requested process and delivers the data
packets requested back to the client. Clients do not share any of their resources.
Examples of the Client-Server Model are Email, World Wide Web, etc.
How Does the Client-Server Model Work?

● Client: When we say the word Client, it means to talk of a person or an organization
using a particular service. Similarly in the digital world, a Client is a computer (Host)
i.e. capable of receiving information or using a particular service from the service
providers (Servers).
● Servers: Similarly, when we talk about the word Servers, It means a person or
medium that serves something. Similarly in this digital world, a Server is a remote
computer that provides information (data) or access to particular services.

So, it is the Client requesting something and the Server serving it as long as it is in the
database.
How the Browser Interacts With the Servers?

There are a few steps to follow to interacts with the servers of a client.

● User enters the URL(Uniform Resource Locator) of the website or file. The Browser
then requests the DNS(DOMAIN NAME SYSTEM) Server.
● DNS Server lookup for the address of the WEB Server.
● The DNS Server responds with the IP address of the WEB Server.
● The Browser sends over an HTTP/HTTPS request to the WEB Server’s IP
(provided by the DNS server).
● The Server sends over the necessary files for the website.
● The Browser then renders the files and the website is displayed. This rendering is
done with the help of DOM (Document Object Model) interpreter, CSS interpreter,
and JS Engine collectively known as the JIT or (Just in Time) Compilers.
Advantages of Client-Server Model

● Centralized system with all data in a single place.

● Cost efficient requires less maintenance cost and Data recovery is possible.
● The capacity of the Client and Servers can be changed separately.
Disadvantages of Client-Server Model

● Clients are prone to viruses, Trojans, and worms if present in the Server or uploaded
into the Server.
● Servers are prone to Denial of Service (DOS) attacks.
● Data packets may be spoofed or modified during transmission.
● Phishing or capturing login credentials or other useful information of the user are
common and MITM(Man in the Middle) attacks are common.
HTTP Request Message
HTTP - Requests

An HTTP (Hypertext Transfer Protocol) request is a fundamental part of web

communications, forming the basis of data exchange on the internet.

It’s a protocol used for fetching resources, such as HTML documents, images, and other
files, from web servers.

The communication between a client (like a web browser) and a server occurs through
these HTTP requests.

Here’s a breakdown of how it works:

1. Request Line: An HTTP request starts with a request line, which includes the
following:
● Method: This indicates the action to be performed on the resource. Common methods
include GET (retrieve a resource), POST (submit data to the server), PUT (update a
resource), DELETE (remove a resource), and others.
● Request URL: The URL of the resource being requested.
● HTTP Version: The version of the HTTP protocol being used.
1. Request Headers: Following the request line are headers, which provide additional
information about the request. This can include details about the client’s browser, the
types of responses that the client will accept, cookies, and more.
2. Blank Line: A blank line indicates the end of the headers section.
3. Request Body (Optional): Not all requests have a body. Bodies are typically
included in POST or PUT requests, where you’re sending data to the server (like form
inputs or file uploads). The body contains the data being sent.
The server, upon receiving this request, processes it and sends back a response. The
response typically contains a status line (indicating if the request was successful or if there
were errors), response headers (providing metadata about the response), and often a
response body (which contains the requested resource or a message).

In summary, an HTTP request is a structured way for a client to ask for resources or
actions from a server, and it’s an essential component of how the internet functions,
allowing for the exchange of information and resources across the web.

When you visit a website through a browser, your browser is constantly sending requests
and the server responds to them by providing data. That is it in a nutshell. The real process
is much more complicated. What are HTTP requests and how do they work? Let’s find out.
What is HTTP?

HTTP (HyperText Transfer Protocol) is a protocol for transferring hypertext. It is a set of

rules for transferring data between computers and servers on the Internet. HTTP is the
template for data transfer requests. It consists of text only. However, it transfers all kinds
of file formats, such as video, audio, and text.
HTTP is at the top of the OSI model where applications exchange data with each other. It
is part of the TCP/IP protocol family.
Another protocol is called HTTPS. The letter S in the acronym stands for secure. The
principle is the same, the difference being that messages are encrypted before
transmission.
What is an HTTP request?

An HTTP protocol is based on a client/server architecture where a web browser, robot,

search engine, and so on act as HTTP clients, and the web server acts as a server. The
session is a sequence of request-response network operations.
The client
An HTTP client sends a request to the server over a TCP/IP connection using one of the
request methods, URI and protocol version, followed by a MIME-like message containing
the request modifiers, client information, and any body content. Typical HTTP clients are
web browsers, file downloaders, web crawlers, etc.
The server
The HTTP server receiving the request responds with a status string including message
protocol version and success/error code, followed by a MIME-like message containing
server information, object meta-information, and possible object body content.
How the HTTP protocol works

1. In a search box or by clicking on a link, a user enters a Uniform Resource Locator

(URL). A URL begins with HTTP, indicating to the browser (the client) that the
HTTP protocol must be used to obtain data.
2. Browser receives address and generates HTTP request.
3. The request is sent to your Internet Service Provider (ISP) and they send it over the
Internet to a server.
4. The server reads the request. It knows how to read it because it is formatted as an
HTTP request.
5. An HTTP response is generated by the server.
6. The server sends the response to the ISP and then over the Internet to your computer.
7. Your browser reads the response. It knows how to read it because it’s formatted as an
HTTP response.
8. Your browser displays the data.
The structure of HTTP requests
HTTP requests can look like this GET https://www.cloud4u.com/ HTTP/1.1

Here you can see that the method used is GET, the resource https://www.cloud4u.com is
accessed, and the protocol is HTTP/1.1.
Queries have the following structure:

● The start line. It is used to describe the request or the status of the request. Indicates
the protocol version and other information. Contains the requested resource or a
response code (eg error). It is exactly one line in length.
● HTTP header. Looks like a few lines of text specifying the request or describing the
content of the message body.
● An empty string. This is necessary as an indication that the metadata for a particular
request has been successfully sent.
● The request body. This contains information about the request or the document sent
in response to the request.
The start line

Includes three main components: the request method, the request target, and the version of
the transfer protocol.

Request are used in the headers of HTTP messages and allow the server and client to
understand exactly what the message is about.

An HTTP method is a sequence of characters, excluding controls and delimiters,

indicating the resource’s basic operation. A method is usually a short, capitalized English
word. The method name is case-sensitive.
Let’s review a few common ones:

GET — a request for data from a server.

POST — used to send data to the server.

HEAD — identical to the GET method, except that the server response has no body. A
HEAD request is usually used to get metadata, check if the resource exists (URL
validation) and see if it has changed since the last request.

PUT — similar to POST except that there is no need for a server response in the case of
background process execution.
The request target is actually a pointer to the URL the user needs. It consists of the
protocol, the URL or IP address, and the path to the resource stored on the server. The
request target may also include port and request parameters.

The version of the data transfer protocol used. Currently, common versions are HTTP/1.1
and HTTP/2. The data structure following the start line depends on the protocol.

It’s worth noting that the start line can contain other useful information as well. For
example, the User-Agent header contains information about the browser agent being used.
Or the Referer header, the URL from which a request was made.
HTTP header

The headers look like pair _name:value_. The line is case insensitive, and the structure of
the value is determined by the header. The header looks like a single, sometimes extremely
long, line. Headers are used to provide additional information along with the request and
may fall into one of four categories.

Headers — are essential for any type of message and are independent of the data to be
transmitted.

Request Headers — contain the parameters of the requested data or define parameters with
information about the client making the request.

Response Headers — provide information about the server’s response.

Entity headers — allow you to describe the contents of the message body.
Request body

Not all HTTP requests may have a request body. For example for methods GET, HEAD,
DELETE, and OPTIONS body usually is not needed. But for POST-type methods, it is
necessary to send information to the server for an update, for example.

A request body can be divided into two categories, single-source, and multiple-source. The
first category includes request bodies that consist of a single standalone file with two
headers: Content-Type and Content-Length.

A multi-resource body consists of multiple parts, each containing its own bits of
information. These parts are associated with HTML forms.
Advantages of HTTP

Wide range of possibilities. The protocol is designed to be extensible. HTTP is constantly

evolving.

Comprehensive documentation. Easy to use for a wide range of developers, with

documentation available in several languages.

The protocol is designed to work with the server and its resources, but does not include
any means of navigating within them. For example, it is not possible to request a list of
available files directly from the client, as you would be able to do with FTP. The client is
supposed to know the URI of the required document and navigate through it using
hyperlinks. This scheme is acceptable to the user but very inconvenient for the means of
automatic processing and analysis of the server and its resources.
HTTP Response Message
HTTP Response

An HTTP response is what a server sends back to the client after receiving and processing
an HTTP request. It is a key part of the data exchange in web communications, essentially
being the server’s answer to the client’s request. Here’s a breakdown of the components of
an HTTP response:
1. Status Line: This is the first line of the response and includes:
● HTTP Version: Indicates the HTTP protocol version used (e.g., HTTP/1.1).
● Status Code: A three-digit number that indicates the outcome of the request.
Common status codes include 200 (OK, request succeeded), 404 (Not Found, the
resource can’t be found), 500 (Internal Server Error), etc.
● Status Text: A brief, human-readable explanation of the status code (e.g., OK, Not
Found, Internal Server Error).
1. Response Headers: These are key-value pairs providing additional information about
the response. They can include details such as the server type, content type, content
length, caching policies, set cookies, and other metadata.
2. Blank Line: A blank line signifies the end of the header section.
3. Response Body: This part of the response contains the actual data or resource that the
client requested. For example, it could be an HTML file, JSON data, an image, etc. In
some cases, particularly when the response indicates an error (like a 404), the body
might contain a message explaining the error.
The combination of the status code and response body allows the client to understand
whether the request was successful and to process the returned data accordingly.

For instance, a web browser would render the HTML from the response body, a REST API
client might process JSON data, or handle redirection if the status code indicates a
redirection (like 301 or 302).

In summary, the HTTP response is a crucial component in the client-server communication

over the web, allowing servers to provide the necessary data, resources, or feedback in
response to the client’s requests.
Web Clients
A web client is software that accesses a web server by sending an HTTP request message
and processing the resulting HTTP response.

A web client is an application that communicates with a web server, using Hypertext
Transfer Protocol (HTTP). Any web client that is designed to directly support user access
to web servers is known as a user agent.

Browser is the most commonly used web client. The most common interface to the World
Wide Web is a browser, such as Mosaic, Netscape Navigator, or Internet Explorer.
Functions of browser:

The primary function of a web browser is to render HTML, the code used to design or
mark up webpages. Each time a browser loads a web page, it processes the HTML, which
may include text, links, and references to images and other items, such as cascading style
sheets and JavaScript functions. The browser processes these items, then renders them in
the browser window.
Parts of browser:

Each webpage has an address. This is indicated in the Address Bar. Most webpages will
have titles. The actual webpage itself is displayed in the Main Webpage Window. You can
reload a page by hitting the "Refresh" button. This will update it to the latest version. If a
webpage takes a long time to load you can stop loading it by hitting the "Stop" button.
Uniform Resource Locators (URL)

The URI (Uniform Resource Identifier) is a string that associates a particular resource

on the web. There are two types of URI:

URN (Uniform Resource Name)

This identifies the resource using unique names. They do not signify the location of

the resource. It consists of three parts:Scheme name, Namespace identifier and

Namespace string

Syntax:Urn: name: resource name

Example: URN: ISBN: 5427877

URL (Uniform Resource Locator )
Uniform Resource Locator (URL) refers to a web address which uniquely

identifies a document over the internet.

The computer that supplies files or services to the requesting computer over the internet is
called as a web server. This document can be a web page, image, audio, video or anything
else present on the web.
URL Types

There are two forms of URL as listed below:

AbsoluteURL:

Absolute URL is a complete address of a resource on the web. This completed address
comprises of protocol used, server name, path name and file name.

Example:http:// www.abc.com / xyz /index.html.

Here http is the protocol, abc.com is the server name and index.htm is the file name.

The protocol part tells the web browser how to handle the file. Other protocols also that
can be used to create URL are: FTP, https, Gophe, mailto, news
Relative URL

Relative URL is a partial address of a webpage. Unlike absolute URL, the

protocol and server part are omitted from relative URL. Relative URLs are used

for internal links i.e. to create links to file that are part of same website as the

WebPages on which you are placing the link

Generations of Web Applications
Web 1.0 was all about fetching, and reading information. Web 2.0 is all about reading,
writing, creating, and interacting with the end user. It was famously called the
participative social web. Web 3.0 is the third generation of the World Wide Web, and is a
vision of a decentralized web which is currently a work in progress. It is all about
reading, writing, and owning.

Web 1.0:The Static Web

Web 1.0 refers to the first stage of the World Wide Web evolution. Earlier, there were only
a few content creators in Web 1.0 with a huge majority of users who are consumers of
content. Personal web pages were common, consisting mainly of static pages hosted on
ISP-run web servers, or free web hosting services.
In Web 1.0 advertisements on websites while surfing the internet are banned. Also, in Web
1.0, Ofoto is an online digital photography website, on which users could store, share,
view, and print digital pictures.
Web 1.0 is a content delivery network (CDN) that enables the showcase of the piece of
information on the websites. It can be used as a personal website. It costs the user as per
pages viewed.
It has directories that enable users to retrieve a particular piece of information. The era of
Web 1.0 was roughly from 1991 to 2004.
Four Design Essentials of a Web 1.0 Site Include:
● Static pages.
● Content is served from the server’s file system.
● Pages built using Server Side Includes or Common Gateway Interface (CGI).
● Frames and Tables are used to position and align the elements on a page.
Features of the Web 1.0

● Easy to connect static pages with the system via hyperlinks

● Supports elements like frames and tables with HTML 3.2
● Also has graphics and a GIF button
● Less interaction between the user and the server
● You can send HTML forms via mail
● Provides only a one-way publishing medium
Web 2.0: The Social Web
2004 When the word Web 2.0 become famous due to the First Web 2.0 conference (later
known as the Web 2.0 summit) held by Tim O’Reilly and Dale Dougherty, the term was
coined by Darcy DiNucci in 1999. Web 2.0 refers to worldwide websites which highlight
user-generated content, usability, and interoperability for end users. Web 2.0 is also called
the participative social web. It does not refer to a modification to any technical
specification, but to modify the way Web pages are designed and used. The transition is
beneficial but it does not seem that when the changes occur. Interaction and collaboration
with each other are allowed by Web 2.0 in a social media dialogue as the creator of
user-generated content in a virtual community. Web 2.0 is an enhanced version of Web 1.0.
Web browser technologies are used in Web 2.0 development and it includes AJAX and
JavaScript frameworks. Recently, AJAX and JavaScript frameworks have become very
popular means of creating web 2.0 sites.
Features of the Web 2.0

● Free sorting of information, permits users to retrieve and classify the information
collectively.
● Dynamic content that is responsive to user input.
● Information flows between the site owner and site users using evaluation & online
commenting.
● Developed APIs to allow self-usage, such as by a software application.
● Web access leads to concerns different, from the traditional Internet user base to a
wider variety of users.
Usage of Web 2.0

The social Web contains several online tools and platforms where people share their
perspectives, opinions, thoughts, and experiences. Web 2.0 applications tend to interact
much more with the end user. As such, the end-user is not only a user of the application but
also a participant in these 8 tools mentioned below:
● Podcasting
● Blogging
● Tagging
● Curating with RSS
● Social bookmarking
● Social networking
● Social media , Web content voting
Web 3.0 :The Semantic Web

It refers to the evolution of web utilization and interaction which includes altering the Web
into a database, with the integration of DLT (Distributed Ledger Technology blockchain is
an example) and that data can help to make Smart Contracts based on the needs of the
individual.
It enables the up-gradation of the backend of the web, after a long time of focusing on the
frontend (Web 2.0 has mainly been about AJAX, tagging, and other front-end
user-experience innovation).
Web 3.0 is a term that is used to describe many evolutions of web usage and interaction
among several paths. In this, data isn’t owned but instead shared but still is, where services
show different views for the same web / the same data.
The Semantic Web (3.0) promises to establish “the world’s information” in a more
reasonable way than Google can ever attain with its existing engine schema. This is
particularly true from the perspective of machine conception as opposed to human
understanding.
The Semantic Web necessitates the use of a declarative ontological language like OWL to
produce domain-specific ontologies that machines can use to reason about information and
make new conclusions, not simply match keywords.
Web 3.0 is the latest and updated version of the web.
Features of the Web 3.0

● Semantic Web: The succeeding evolution of the Web involves the Semantic Web.
The semantic web improves web technologies in demand to create, share and
connect content through search and analysis based on the capability to comprehend
the meaning of words, rather than on keywords or numbers.
● Artificial Intelligence: Combining this capability with natural language
processing, in Web 3.0, computers can distinguish information like humans to
provide faster and more relevant results. They become more intelligent to fulfill the
requirements of users.
● 3D Graphics: The three-dimensional design is being used widely in websites and
services in Web 3.0. Museum guides, computer games, e-commerce, geospatial
contexts, etc. are all examples that use 3D graphics.
● Connectivity: With Web 3.0, information is more connected thanks to semantic
metadata. As a result, the user experience evolves to another level of connectivity
that leverages all the available information.
● Ubiquity: Content is accessible by multiple applications, every device is connected
to the web, and the services can be used everywhere.
● DLT and Smart Contracts: With the help of DLT, we can have a virtually
impossible-to-hack database from which one can have value to their content and
things they can own virtually, this is the technology that enables a trustless society
through the integration of smart contracts which does not need to have a middle
man to be a guarantor to make that contract occur on certain cause its based on data
from that DLT. It’s a powerful tool that can make the world a far better place and
generate more opportunities for everyone on the internet.
Web 4.0: The Intelligent Web
Web 4.0 refers to the fourth generation of the World Wide Web and is marked by a shift
from physical to digital technologies. It is still in its early developmental stages, but some
key features and changes can be expected in the years to come.

The goal of Web 4.0 is to make the Internet more user-friendly, efficient, personalized,
interactive, intelligent, and collaborative. Some of the most noticeable changes in Web 4.0
will be how users interact with websites, making the web more collaborative, and
interactive.

Web 4.0 will introduce new technologies that are designed to make the internet more
efficient, personalized, and user-friendly, including AI, big data, semantic web, and social
networking sites, among others.
Web 5.0: The Immersive Web
Web 5.0 is a term that has been recently coined to refer to the next iteration of the internet
after Web 4.0, which is not yet defined or established.

According to some sources, Web 5.0 is an extension of Web 2.0 and Web 3.0, which aims
to provide users with complete ownership and control of their data and identity on the
Internet. It is meant to be fully decentralized, which means that intermediaries or
governments cannot store or control a user’s data.

Web 5.0 is being developed by Jack Dorsey’s Bitcoin business unit, The Block Head
(TBH). The goal is to create a platform that merges the sociability aspects of Web 2.0 with
the foundations of Web 3.0, built on a blockchain structure.

The platform’s main significance is to enable computers to respond to emotional cues

based on a person’s electric signals in their brain, which is not possible with Web 3.0.