CS-344: WEB ENGINEERING

Dr. Qaiser Riaz [email protected]

BESE-10AB Lecture-1ABC Fall-2021

School of Electrical Engineering and Computer Science (SEECS)

National University of Science and Technology (NUST)
 2

Outline
• Web Engineering (3+1)
• Course Objectives

• Course Learning Outcomes (CLOs)

• Course Contents

• Course Assessment

• World Wide Web, Internet and Related

Concepts
WEB ENGINEERING
Motivation
 4

Motivation Source: Statista 2020

 5

Motivation - Facebook's annual revenue

Source: Statista 2020

 6

Motivation – Amazon’s annual revenue

Source: Statista 2020

 7

Motivation: Alibaba Group

Appr. 54.5b US $

Source: Statista 2020

 8

E-COMMERCE IN
PAKISTAN
 9

Motivation: E-commerce in Pakistan

 10

Motivation: Fastest Growing Freelance

Markets
 11

Motivation: Alibaba vs Local Exports

 12

Motivation
WORLD WIDE WEB &
INTERNET
World Wide Web & Internet
• The internet is a network of computer networks worldwide
• The web is a tool used to retrieve information published on the
internet
• To navigate the web we use a web browser i.e. Firefox, Edge,
Chrome, Safari, …
 15

Who defines the Web Standards?

• W3C or World Wide Web Consortium

• W3C is the main international standards organization for

the World Wide Web
• Develops open standards to ensure the long-term growth of
the Web

• Founded and currently led by Tim Berners-Lee, the

inventor of the World Wide Web
• Tim Berners-Lee implemented the first successful
communication between a Hypertext Transfer Protocol
(HTTP) client and server via the Internet in Nov. 1989
 Q: How to find IP address of any website16on internet!
Hack: In Windows, go to command prompt. Write
‘ping <URL of the website>’ e.g. ping facebook.com.
The Internet! Hit enter!

“The Internet is not a thing, a place, a single

technology, or a mode of governance. It is an
agreement”
- John Gage, Director of Science, Sun Microsystems, Inc.

• Internet is a global network of computers.

• Nobody company or government owns it (it’s global!)

• Each computer has a unique Internet Protocol (IP)

address in the form of xxx.xxx.xxx.xxx
• Each xxx is a number from 0 to 255
• Example: 31.13.92.36 (facebook.com)
 17

Communicating on the Web

• Web pages are viewed in
Web browsers

• Web Browsers
• Google Chrome
• Mozilla Firefox
• Microsoft Edge
• Apple Safari
• Others (Opera, Lynx)
• …

• Web Browsers are also

known as HTTP Client
 18

Accessing a Website

Client computer Server computer

Internet
connection

Web browser Web server

Database server
 19

Components of a Web Application

• Web applications
• Client/server application
• In a client/server application
• A client computer accesses resources on a server
computer
• For a web application,
• The client and server computers are connected via
the Internet.
• Web browser acts as client
• Web applications run on a server computer under
the control of web server software
 20

Client – Server Communications Using Browser

• Type the URL in the web browser’s address bar
• If the URL contains a domain name, the browser first
connects to a domain name server (DNS) and retrieves
the corresponding IP address for the web server

• The web browser connects to the web server and

sends an HTTP request

• The web server receives the request and checks for

the desired page
• If the page exists, the web server sends it back
• If the server cannot find the requested page, it will send
an HTTP error code
• E.g. Error 400 – Bad Request, 403 – Forbidden, 404 – Not
Found etc.
 21

Client – Server Communications Using Browser

• The web browser receives the page back
• The connection is closed.
• The browser then parses the page and looks for any
other resources it needs
• For example, images, videos, applets, …
• For each required component
• The browser makes additional HTTP requests to the server
• Once everything is received
• The page is rendered and loaded in the browser

• Question: What if some of the resources are not

available on the server? How browse will handle it?
UNIFORM RESOURCE
LOCATOR (URL)
 23

Uniform Resource Locator (URL)

• Also known as web address

• It’s a reference to a web resource that specifies

• Its location on a computer network &
• A mechanism for retrieving it

• Syntax
scheme:[//[user:password@]host[:port]][/]path[?query][#fragment]
 24

Uniform Resource Locator (URL)

http://seecs.nust.edu.pk:80/Departments/Department-of-Computing/Degrees-Offered/BSCS/index.php

scheme:[//[user:password@]host[:port]][/]path[?query][#fragment]
Type Content
Scheme http
User None
Password None
Host seecs.nust.edu.pk
Port 80 [default port]
Path Departments/Department-of-Computing/Degrees-
Offered/BSCS/index.php
Query None
Fragment None
 25

Uniform Resource Locator (URL)

https://www.google.com.pk/search?q=nust

scheme:[//[user:password@]host[:port]][/]path[?query][#fragment]

Type Content
Scheme https
User None
Password None
Host www.google.com.pk
Port default port [80]
Path search
Query q=nust
Fragment None
 26

Uniform Resource Locator (URL)

https://www.google.com.pk/search?q=nust#top

scheme:[//[user:password@]host[:port]][/]path[?query][#fragment]

Type Content
Scheme https
User None
Password None
Host www.google.com.pk
Port default port [80]
Path search
Query q=nust
Fragment top
 27

IP addresses
• IP addresses can be
• Permanent also called static or
• Temporary also known as dynamic

• If you connect via dial-up then most likely you

will be assigned a temporary IP address

• If you have computer on a corporate network

then most likely it has a static IP address
• Usually DHCP is used to distribute IP address
• DHCP = Dynamic Host Configuration Protocol
DOMAIN NAMES
RESOLUTION
 29

Domain Names and Address Resolution

• An IP Address is used to connect from computer
A to computer B

• Remembering IP addresses is not easy for

general public

• Instead domain names like www.nust.edu.pk

are used as they are easier to remember

• But how to map between IP addresses and

hostnames?
 30

DNS: Domain Name System

• DNS is a distributed database of computers’ names and
their corresponding IP addresses

• Domain Name system or DNS serves as a phone book

for the Internet
• It translates human-friendly computer host names into IP
addresses
• It is used to map domain names to IP addresses

• DNS servers are used to host the DNS database and

software to use it

• Since the DNS database is too large to be stored on any

specific computer only a subset of the database is usually
kept on any DNS server
 31

How DNS Work

Image source: Google

 32

DNS Hierarchy
 33

DNS
 34

Internet hierarchy http://library.seecs.edu.pk

PK …………….. FR UA US

ORG GOV EDU COM NET MIL

SEECS MIT IBM Apple

Library Sub-domain
PROTOCOL STACK
 36

Internet Protocol
• In order to send a message from one computer to
another, Protocols are used

• There are several layers of protocols which we call

Protocol Stack because they are built on top of each
other.

• The protocol stack used on the Internet is referred to as

the TCP/IP protocol stack because of the two major
communication protocols used.
 37

Protocol Stack
Computer A Computer B
Application Layer Application Layer
(Telnet, HTTP, FTP, (Telnet, HTTP, FTP,
SMTP, SSL etc.) SMTP, SSL etc.)
Transport Layer Transport Layer
(TCP, UDP, …) (TCP, UDP, …)
Network (Internet) Layer Network (Internet) Layer
(IP, ICMP, IPsec, …) (IP, ICMP, IPsec, …)
Physical (Link) Layer Physical (Link) Layer

INTERNET (Transmission Channel)

 38

Protocol Stack Application Layer

Transport Layer
• Application Layer is specific to
Network Layer
applications e.g. HTTP, E-mail, FTP, etc.
Physical Layer

• Transport Layer uses Transmission Control Protocol

(TCP) to direct packets to a specific application on a
computer using a port number

• Network Layer uses Internet Protocol (IP) to direct

packets to a specific computer using an IP address.

• Physical Layer is responsible for physical transfer of

packet data over the network (e.g. using Ethernet,
modem wireless etc.)
 39

Sending a message from computer A to B

 40

Sending a message from computer A to B

• A message will start at the top of
the protocol stack on computer A
and will go in the downward Application Layer
direction Transport Layer
Network Layer
• If the message is long, each stack Physical Layer
layer can break the message up
into smaller chunks of data

• Data sent over the Internet is in

manageable chunks. These chunks of
data are known as packets.
 41

Sending a message from computer A to B

• The data packets go through the
application Layer to Transport layer
Application Layer
• Each packet is assigned a port Transport Layer
number.
Network Layer

• Different programs can use TCP/IP Physical Layer

stack to send are receive messages.

• Each program listens to the port

assigned to it to send and receive
messages.
 42

Sending a message from computer A to B

 After transport layer, the packets proceed to the network
layer. This is where each packet receives it's destination
IP address.
 Once we have a port number and an IP address, our
message is ready to be sent over the Internet.
 The physical layer takes care of turning data packets into
electronic signals and transmitting them over the physical
medium

Application Layer Application Layer

Transport Layer Transport Layer
Network Layer Network Layer
Physical Layer Physical Layer

INTERNET (Transmission Channel)

 43

Sending a message from computer A to B

• ISP’s router examines the address of each packet and
decides where to send it ( usually to another router)
• Once the packet reaches the destination computer the
process works upward and the packets are reassembled.
• All extra information such as port and address numbers
are stripped from the packets
Application Layer Application Layer
Transport Layer Transport Layer
Network Layer Network Layer
Physical Layer Physical Layer

INTERNET (Transmission Channel)

 44

Application protocols (HTTP)

• Hypertext Transfer Protocol or HTTP is Application Layer
the foundation of data communication
over WWW Transport Layer
Network Layer
• Hypertext is structured text that uses Physical Layer
logical links (hyperlinks) between nodes
containing text

• HTTP is the protocol to exchange or

transfer hypertext

• HTTP is an application level protocol

 45

Application Protocols: (FTP)

• File Transfer Protocol or FTP Application Layer

Transport Layer
• FTP is used to send files between Network Layer
computers Physical Layer

• FTP is connection based protocol

• FTP can be used to transfer either text or

binary data

• For using FTP, usually a login is required

 46

Transmission Control Protocol (TCP)

• TCP is responsible for routing
application protocols to the correct Application Layer
application on the destination Transport Layer
computer Network Layer
Physical Layer
• What TCP does
• Get data from application to application
reliably! Two applications using TCP
must first establish a connection
before exchanging data.
• TCP is a connection-oriented,
reliable, byte stream service
For each packet received, an
acknowledgement is sent to the
sender to confirm the delivery
 47

Transmission Control Protocol (TCP)

TCP Header (20 bytes)

16 bit source port number 16 bit destination port number

32 bit sequence number

32 bit acknowledgment number

Misc. data 16 bit window size

16 bit TCP checksum 16 bit urgent pointer

 48

Internet Protocol (IP)

• Delivers packets across networks through
routers Application Layer

• IP provides Internet-wide addressing Transport Layer

• IP provides connectionless and Network Layer

unreliable packets service Physical Layer
• Packets may or may not be delivered
• Packets may arrive at destination out of
order
• Packets may be arbitrarily delayed
• Current version: IPv4. Next generation:
IPv6
 49

Internet Protocol (IP)

IP Header (20 bytes)

Version, header length, type of 16 bit total length in bytes
service
16 bit identification Flags and 13 bit fragment offset

8 bit time to live 16 bit header checksum

8 bit protocol

32 bit source IP address

32 bit destination IP address

 50

Complete Packet

IP Header ( 20 bytes )

TCP Header ( 20 bytes )

Application
Layer
Data
 51

Internet Port Numbers

• The following are default port numbers:

• FTP 20/21
• Telnet 23
• SMTP 25
• DNS 53
• HTTP 80
• POP2 109
• POP3 110
• SFTP 115
• IMAP 143
• HTTPS 443
 52

Summary
• World wide web and internet

• Uniform Resource Locator (URL)

• Domain Name System (DNS)

• Protocol Stack