Web Technologies
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Web platforms
Web platforms are comprehensive software environments that
enable the creation, hosting, and management of websites
and web applications on the internet.
They provide a set of tools, services, and infrastructure for
developers and users to interact with digital content and
services online.
Web platforms facilitate the deployment and execution of web
technologies, making it easier to create, publish, and access
web content.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Components of Web Platforms
Web Servers: These are specialized software or hardware systems that store and
deliver web content in response to client requests. Examples include Apache,
Nginx, and Microsoft Internet Information Services (IIS).
Web Browsers: Web platforms interact with web browsers (e.g., Chrome, Firefox,
Safari) that users utilize to access and view web content.
Databases: Many web platforms integrate databases to store and manage data
used by web applications. Examples include MySQL, PostgreSQL, and MongoDB.
Programming Languages and Frameworks: Web platforms support various
programming languages (e.g., PHP, Python, Ruby) and frameworks (e.g., Django,
Ruby on Rails) to build dynamic web applications.
Content Management Systems (CMS): These platforms allow users to create
and manage digital content easily. Examples include WordPress, Drupal, and
Joomla.
Web Hosting Services: Web platforms often include hosting services, allowing
users to deploy their websites on the platform's infrastructure. Examples include
shared hosting, cloud hosting, and dedicated hosting.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Examples of Web Platforms
WordPress:
Overview: WordPress is a popular content management system that simplifies website
creation and management. It's open-source and highly customizable.
Example Use Case: A blogger uses WordPress to create and publish articles on their
personal website.
Amazon Web Services (AWS):
Overview: AWS is a cloud computing platform by Amazon, offering a wide range of
services, including web hosting, databases, and AI tools.
Example Use Case: A startup deploys its web application on AWS, leveraging scalable
infrastructure and services.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Examples of Web Platforms (cont.)
Google Sites:
Overview: Google Sites is a simple web platform for creating collaborative websites. It's
part of Google Workspace.
Example Use Case: A team uses Google Sites to create an internal wiki for project
documentation and information sharing.
Wix:
Overview: Wix is a user-friendly website builder that allows individuals and businesses to
create visually appealing websites without coding.
Example Use Case: An artist uses Wix to showcase their portfolio online.
Heroku:
Overview: Heroku is a cloud platform-as-a-service (PaaS) that simplifies web application
deployment and scaling.
Example Use Case: A developer deploys a Node.js application on Heroku for easy
hosting and scaling.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
URL (Uniform Resource Locator)
A URL is a web address used to identify and locate resources on
the internet.
It consists of several components, including the protocol (e.g.,
http:// or https://), domain name (e.g., www.example.com), and
path (e.g., /page1).
Forexample: https://www.example.com/page1
protocol
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Protocol
HTTP (Hypertext Transfer Protocol):
HTTP is a protocol used for transmitting data between a web server
and a web client (usually a web browser). It defines how requests
and responses should be formatted and handled.
HTTPS (HTTP Secure):
HTTPS is a secure version of HTTP. It encrypts data exchanged
between a web server and a client to protect against eavesdropping
and data tampering.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Domain Name
A domain name is a human-readable address that corresponds to an IP
address on the internet.
It is used to identify websites and resources. For example, "
www.example.com" is a domain name.
A domain name is a string of text that maps to an alphanumeric
IP address, used to access a website from client software.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Web Browser
When a user requests a web page from a particular website,
the browser retrieves its files from a web server and then
displays the page on the user's screen.
Browsers are used on a range of devices, including desktops,
laptops, tablets, and smartphones
Popular web browsers include Chrome, Firefox, Safari, and
Edge.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Web Server
A web server is software and hardware that uses HTTP
(Hypertext Transfer Protocol) and other protocols to respond
to client requests made over the World Wide Web.
Common web server software includes Apache, Nginx, and
Microsoft IIS.
The main job of a web server is to display website content
through storing, processing and delivering webpages to
users.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
HTML (Hypertext Markup Language)
HTML is the standard markup language used to create the
structure and content of web pages. It uses tags to define
elements like headings, paragraphs, links, and images.
It is often assisted by technologies such as Cascading
Style Sheets (CSS) and scripting languages such as
JavaScript.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
CSS (Cascading Style Sheets)
Cascading Style Sheets is a style sheet language used for
specifying the presentation and styling of a document
written in a markup language such as HTML or XML.
CSS is used to style web pages by specifying how
elements should appear, including layout, colors, fonts,
and spacing.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
JavaScript
JavaScript is a scripting language that enables interactive
and dynamic features on websites.
It allows developers to add behavior to web pages,
respond to user actions, and manipulate the Document
Object Model (DOM).
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Responsive Web Design:
Responsive web design is an approach to designing
websites that ensures they adapt and display correctly on
various screen sizes and devices, such as desktops,
tablets, and smartphones.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
CMS (Content Management System):
A CMS is a software platform that enables users to
create, manage, and publish digital content on the web.
Popular CMSs include WordPress, Drupal, and Joomla etc.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Web Hosting
Web hosting is a service that
provides storage, server resources,
and connectivity to make websites
accessible on the Internet.
Different types of hosting include:
shared hosting,
Virtual Private Server (VPS) hosting
dedicated hosting.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Web Development Framework
A web development framework is a pre-built set of tools,
libraries, and best practices that streamline the development
of web applications.
Examples include Ruby on Rails, Django, and Angular.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
API (Application Programming
AnInterface)
API defines how software components should interact with each
other.
Web APIs, often based on HTTP, allow different web services or
applications to communicate and exchange data.
Common Use Cases:
Social Media Integration:
Integrate features from platforms like Facebook, Twitter, or Instagram
into your application.
Payment Processing:
APIs from services like PayPal or Stripe can be used to handle online
payments.
Data Retrieval:
Fetch data from services like weather forecasts, stock market
updates, or news feeds.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Web Applications Categories
Static web applications
Dynamic web application.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Cookies and Sessions
Cookies are small pieces of data stored on a user's device by websites.
Authentication: Remembering logged-in users.
Preferences: Storing user settings like language or theme.
Tracking: Monitoring user behavior for analytics or advertising purposes.
Sessions refer to a way of maintaining user-specific data across multiple
web requests.
Authentication: Keeping users logged in across multiple pages.
Shopping Carts: Storing items in a shopping cart during an online
shopping session.
User Preferences: Remembering user settings and preferences during
their visit
Both are commonly used for user authentication and tracking.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Cookies
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Web 1.0
Late 1980s to early 2000s (Read-only-web).
Web 1.0 was the first generation of the world wide web, also
referred to as the read-only web.
Web 1.0 began as an information place for businesses to
broadcast their information and only allowed users to
search for information and read it.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Hyper Text Transfer Protocol
HTTP, is a fundamental protocol used for communication
between a client (usually a web browser) and a web server
over the internet. It is the foundation of data communication
on the World Wide Web and enables the exchange of text,
images, videos, links, and other resources between a user's
device and web servers.
HTTP operates on a request-response model, where a client
sends a request for a resource, and the server responds with
the requested data (usually in the form of an HTML web
page). It is a stateless protocol, meaning each request from
the client to the server is independent, and the server doesn't
retain any information about previous requests.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
HTTP Example
Client Makes a Request:
A user opens a web browser and enters a URL (Uniform Resource Locator), such as "
http://www.example.com/page1".
The browser translates this URL into an HTTP request, which includes:
The HTTP method (usually "GET" for requesting resources).
The domain name ("www.example.com").
The path to the specific resource ("/page1").
Client Sends the Request:
The client (web browser) establishes a TCP (Transmission Control Protocol) connection to the
server hosting www.example.com.
It sends the HTTP request to the server.
Server Processes the Request:
The web server at www.example.com receives the HTTP request.
It parses the request, identifies the requested resource ("/page1"), and locates the
corresponding file or generates dynamic content.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
HTTP Example (cont.)
Server Sends the Response:
The server constructs an HTTP response, which includes:
An HTTP status code (e.g., 200 for success or 404 for "Not Found").
The content type (e.g., "text/html" for HTML pages).
The requested resource's content (e.g., the HTML code of "page1").
It sends this response back to the client over the established TCP connection.
Client Receives and Renders the Response:
The client's web browser receives the HTTP response.
It processes the response, renders the HTML content, and displays the web page
to the user.
Connection Closes:
After the response is sent, the TCP connection is closed, and the HTTP
transaction is complete.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
HTTP & TCP
For Example: When a user requests a web page on the internet,
somewhere in the world, the server processes that request and sends
back an HTML Page to that user. The server makes use of a protocol
called the HTTP Protocol. The HTTP then requests the TCP layer to set
the required connection and send the HTML file.
Now, the TCP breaks the data into small packets and forwards it toward
the Internet Protocol (IP) layer. The packets are then sent to the
destination through different routes.
The TCP layer in the user’s system waits for the transmission to get
finished and acknowledges once all packets have been received.
Department of Computer Science, COMSATS University Islamabad, Attock Campus
TCP
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Department of Computer Science, COMSATS University Islamabad, Attock Campus
Department of Computer Science, COMSATS University Islamabad, Attock Campus
