INFO2180 - LECTURE 1
INTERNET/WWW
Photo by Benjamin Dada on Unsplash
WHAT IS THE
INTERNET?
A CONNECTION OF
COMPUTERS USING
THE INTERNET
PROTOCOL (IP)
Wikipedia
WHAT IS THE
WWW?
IT IS THE PART OF THE INTERNET
THAT CAN BE ACCESSED
THROUGH WEBSITES.
A BRIEF HISTORY
1960-1970
ARPANET
WHO IS THIS GUY?
CREATOR OF THE WORLD WIDE WEB
(WWW): 1989-1991
TIM BERNERS-LEE
NETSCAPE NAVIGATOR -
1994
INTERNET EXPLORER - 1995
BROWSER WARS
INTERNET/WWW
NOTABLE INTERNET COMPANY LAUNCHES
▸ Amazon.com - went online in 1995
▸ Google - Built in 1996, of cially a company in 1998
▸ Yahoo! - Founded in 1994
fi
1997–2000
DOT-COM BUBBLE
1999–2001
DOT-COM COLLAPSE
SINCE THEN THE WEB HAS
BECOME AN INTEGRAL
PART OF OUR LIVES
KEY ASPECTS OF
THE INTERNET
INTERNET/WWW
KEY ASPECTS OF THE INTERNET
▸ sub-networks can stand on their own
▸ computers can dynamically join and leave the network
▸ built on open standards; anyone can create a new internet
device
▸ lack of centralized control (mostly)
▸ everyone can use it with simple, commonly available
software
THE INTERNET USES A
LAYERED ARCHITECTURE
INTERNET/WWW
OSI MODEL LAYERS
▸ Physical - hardware to send and
receive data. e.g. ethernet cables,
modems, coaxial cable.
▸ Data Link - handles the moving of
data in and out across a physical
link in a network
INTERNET/WWW
OSI MODEL LAYERS
▸ Network - decision is made as to
which physical path the
information should follow from its
source to its destination.
▸ Transport - ensures the reliability of
data delivery by detecting and
attempting to correct problems
that occurred
INTERNET/WWW
OSI MODEL LAYERS
▸ Session - manages the setting up
and taking down of the association
between two communicating end
points that is called a connection.
▸ Presentation - transforms data into
a form that application layer can
accept. e.g. JPEG, MPEG, ASCII,
encrypted or non-encrypted, etc.
INTERNET/WWW
OSI MODEL LAYERS
▸ Application - web browser, email,
ftp
INTERNET
PROTOCOL (IP)
INTERNET/WWW
SPECIFIES THE FORMAT OF
PACKETS, ALSO CALLED
DATAGRAMS, AND THE ADDRESSING
SCHEME.
Webopedia
INTERNET/WWW
HOW CAN YOU FIND OUT YOUR IP ADDRESS
▸ Your Internet IP Address can be found on a site like
whatismyip.com
▸ Your local IP address:
In a terminal type ifconf g (Mac/Linux) or ipconf g
(Windows)
i
i
INTERNET/WWW
IPV6
▸ We are running out of IPv4 addresses
▸ IPv6 increases the address space.
TRANSMISSION CONTROL
PROTOCOL (TCP)
INTERNET/WWW
ADDS MULTIPLEXING, GUARANTEED
MESSAGE DELIVERY ON TOP OF IP
Webopedia
INTERNET/WWW
TCP MULTIPLEXING
▸ Multiple Programs can use the Same IP address.
▸ This is done using different ports, which is a number given
to each program or service
▸ port 80 - web browser (443 for SSL)
▸ port 25 - email
▸ port 21 - ftp
▸ port 22 - ssh
THE WORLD WIDE WEB (WWW)
WEB SERVERS
INTERNET/WWW
COMPUTERS THAT DELIVER
(SERVES UP) WEB PAGES.
webopedia
INTERNET/WWW
WEB SERVER SOFTWARE
▸ Apache
▸ Nginx
▸ Microsoft Internet Information Server (IIS)
WEB BROWSERS
INTERNET/WWW
SOFTWARE USED TO LOCATE,
RETRIEVE AND DISPLAY CONTENT
ON THE WORLD WIDE WEB
webopedia
POPULAR WEB BROWSERS
Google Chrome, Microsoft Edge, Safari, Opera, Mozilla Firefox
DOMAIN NAME
SYSTEM (DNS)
INTERNET/WWW
AN INTERNET SERVICE THAT
TRANSLATES DOMAIN NAMES
INTO IP ADDRESSES
webopedia
EXAMPLE
.mona.uwi.edu —> 196.2.1.120
w
w
w
UNIFORM RESOURCE
LOCATOR (URL)
INTERNET/WWW
GLOBAL ADDRESS OF DOCUMENTS
AND OTHER RESOURCES ON THE
WORLD WIDE WEB.
webopedia
EXAMPLE
http: .mona.uwi.edu/foo/
Protocol Host Path
/
/
w
w
w
INTERNET/WWW
WHAT DOES THE BROWSER DO?
▸ The Browser asks the DNS server for IP address for
www.mona.uwi.edu
▸ Next, it connects to that IP address on port 80 (default
port)
▸ Ask the server to GET /foo/bar.html (and any other
resources on that page)
▸ Displays the web page in your browser
INTERNET/WWW
OTHER TYPES OF URLS
▸ Anchors - http://example.com/index.html#download
allows you to jump to a point within a page
▸ Port - http://example.com:8080/my le.html
The when not using the default port 80
▸ Query String - http://example.com/about?
id=1&property=value
Pass additional parameters to the page
fi
HYPERTEXT TRANSFER
PROTOCOL (HTTP)
INTERNET/WWW
PROTOCOL THAT DEFINES HOW MESSAGES ARE
FORMATTED AND TRANSMITTED, AND WHAT
ACTIONS WEB SERVERS AND BROWSERS
SHOULD TAKE IN RESPONSE TO VARIOUS
COMMANDS
webopedia
INTERNET/WWW
EXAMPLE HTTP REQUEST
EXAMPLE HTTP GET REQUEST
GET /hello.htm HTTP/1.1
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X)
Host: www.mona.uwi.edu
Accept-Language: en-us
Accept-Encoding: gzip, deflate
Connection: Keep-Alive
EXAMPLE HTTP POST REQUEST
POST /process.php HTTP/1.1
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X)
Host: www.mona.uwi.edu
Content-Type: application/x-www-form-urlencoded
Content-Length: 2978
Accept-Language: en-us
Accept-Encoding: gzip, deflate
Connection: Keep-Alive
licenseID=string&content=string
INTERNET/WWW
EXAMPLE HTTP RESPONSE
INTERNET/WWW
SOME HTTP REQUEST METHODS
▸ GET
▸ POST
▸ PUT
▸ PATCH
▸ DELETE
▸ HEAD
▸ OPTIONS
INTERNET/WWW
SOME HTTP COMMANDS/METHODS
▸ GET - often used to read or retrieve a resource
▸ POST - often used to create a new resource
▸ PUT - most often used for Updates
▸ PATCH - used to modify resource but only contains the
changes.
▸ DELETE - Deletes the resource
▸ HEAD - Same as GET but returns only HTTP headers and no
document body
▸ OPTIONS - Returns the HTTP methods that the server
supports
INTERNET/WWW
HTTP RESPONSE STATUS CODES
▸ 200
▸ 301
▸ 304
▸ 403
▸ 404
▸ 500
INTERNET/WWW
HTTP RESPONSE STATUS CODES
▸ 200 - OK
▸ 301 - Moved Permanently
▸ 304 - Not Modified
▸ 403 - Access Forbidden
▸ 404 - Not Found
▸ 500 - Internal Server Error
INTERNET/WWW
MIME TYPES/CONTENT TYPES
▸ Multipurpose Internet Mail Extensions (MIME)
▸ Used to specify the type of data
▸ text/html for .html
▸ text/plain for .txt
▸ image/jpeg for .jpg
INTERNET/WWW
OTHER WEB LANGUAGES/TECHNOLOGIES
▸ HTML - HyperText Markup Language: basic building block
of a webpage and used for creating a webpage.
▸ CSS - Cascading Stylesheets: used to style of your
webpages.
▸ JavaScript - a lightweight, interpreted, programming
language used to control the behaviour of your web pages.
▸ PHP - PHP Hypertext Preprocessor: server-side language
used to dynamically create pages.
INTERNET/WWW
OTHER WEB LANGUAGES/TECHNOLOGIES
▸ AJAX - Asynchronous JavaScript + XML: the use of the
XMLHttpRequest object to communicate with server-side scripts
▸ XML - eXtensible Markup Language: for exchanging and
representing data
▸ JSON - JavaScript Object Notation: for exchanging and
representing data.
▸ SQL - Structured Query Language: used to interact with a
database.
ANY QUESTIONS?
