World Wide Web

Aaditya BhatiaCS 147

Agenda

• History• OSI model • Hardware • IP address• DNS• Server - Client• Peer-to-peer• Web-Sites • Web programming• Search engines • Questions?

History

• 1960'so US DoD develops the world's first packet-switched

network, ARPAnet, for resistance against nuclear attack.o First Universities gain access and inter-connections.

• 1970'so NSFNet developedo More Universities added to the network

• 1980'so The first commercial and private ISPs gain access to the

network• 1990's to Present

o Technological advances increase individual access and perpetuates the internet's exponential growth.

 

OSI Model

TCP/IP vs OSI

• Not exactly the same

• Only 4 layers in TCP

Hardware

• Network Adapter • Hub

 • Switch

 • Router

 • Gateway

 • Modem

Hardware - Network Adapter

• Connects a computer to another device

• Deals with OSI layers 1 and 2  • Ethernet Wired

o 10 Mbpso 100 Mbpso 1 Gbps

 • 802.11 Wireless

o ao bo go n

Hardware - Hub

• Connects multiple devices

• Doesn’t manage packets • Packet Collision

 • Relatively slower

Hardware - Switch

• Layer 2 device

• Routes packets • Packets don't collide

 • Much faster

• Telephone exchange

Hardware - Router

• Creates an internal LAN • Outer network - single IP

• Layer 3 device • NAT - Masks the internal

machines • Routing table

 • Wired or wireless

Hardware - Gateway

Hardware - Modem

• Modulator – Demodulator

• OSI layer 1

• Relatively Slow • Economical

IP Address

• Unique identifier

• 4 octets

• Assigned by o ISPo DHCP servero Network admin

DNS

• Domain Name System • Address resolution

 • Analogous to an phone book

 • hostname => IP address

DNS - IP lookup

DNS - Address resolution

Server-client mode

• Request   • Response

 • e.g. a website

Server

• Dedicated machine • Serves multiple clients

 • Handles incoming requests

 • Provides services

Client

• Invokes remote services • Generates request

 • A workstation

Peer-to-peer

• Peers - equal • Act as a server and a client

 •  Invoke and provide services

 • e.g. BitTorrent

Web-Sites

• Web servero Apache

 • Web browser

o Firefox • HTTP Protocol

o Stateless connection o Simulated statefulness

Cookie Server-side session

HTTP Protocol

• Stateless connection  

• Simulated statefulnesso Cookie o Server-side session

Web Programming

• HTML • CSS

• Server • Client

 • AJAX

  

Web Programming - HTML

• HyperText Markup Language • Content of websites

 • Server response

 • Understood by Browser

 • Static content

Web Programming - CSS

Cascading Style Sheet • Defines style of a page

 • Easily changeable or replaceable 

 • "Themes" 

 • CSS sample:

p{    color: red;    font-size: 18px; }

Web Programming - Server

• Server side scriptingo PHPo Perlo Python

 • Programs that execute on server

  • Access

o Databaseo Internal systems

 • Efficiency

o Servers are faster 

Web Programming - Client

• Client side scriptingo DHTML  o JavaScript 

 • Make changes to page after it has loaded 

o periodically o based on user input

• JavaScript sample:

document.write( "<h1>Hello World</h1>" );for( i = 0; i < 10; i++ )    alert( "Hello again " + i ); 

Web Programming - AJAX

Asynchronous JavaScript And XML

• Update only a part of page with server's response • Avoid multiple refreshes

 • Lesser network traffic

 • Example: Yahoo! Mail

 • Counter example: SJSU eCampus

Search Engines

• Help find information• Web pages• Locations• News• Images etc.

 • Crawl throughout the Internet

 • Gather information continuously

 • Key role in advertising market

o Context-based ads

References

• http://en.wikipedia.org/ 

• http://www.comptechdoc.org/

• http://www.isoc.org/internet-history/

for your patience

Questions?