BSE 1208 Introduction to Web

Development
Lecture 1
Course Goals
• A general understanding of the fundamentals of the
Internet and WWW
• Knowledge and experience with the major web
technologies
• Introduction to terms and acronyms
• Insight into what constitutes a well designed, usable
web application
Recommended reading
•Online references:
▫http://www.w3schools.com
▫http://howstuffworks.com
Web development
• Web development, also known as website
development, refers to the tasks associated with
creating, building, and maintaining websites and
web applications that run online on a browser. It
may, however, also include web design, web
programming, and database management.

• Web development is closely related to the job of

designing the features and functionality of apps
(web design). The term development is usually
reserved for the actual construction of these things
(that is to say, the programming of sites).
Enabling Infrastructure
• Networks and Communications
• The Internet
• The World Wide Web
The Internet and the WWW
• The WWW is one service running over the Internet - The letters
''www'' stand for World Wide Web, the service that
links documents and allows people to access
information, pictures, sounds, and movies.

• The World Wide Web is an information system that

enables content sharing over the Internet through user-
friendly ways meant to appeal to users beyond IT
specialists and hobbyists
• The WWW is now the major conduit to the Internet and the
major vehicle for e-commerce
• The computers on the Web communicate using standard protocols.

• Documents in the form of hypertext

 Hypertext
Hypertext is text displayed on a computer display or other electronic
devices with references (hyperlinks) to other text that the reader
can immediately access. Hypertext documents are interconnected by
hyperlinks, which are typically activated by a mouse click, keypress set, or
screen touch

A page
A page of text
of text A page
A page of text
of text A page
of text
A page
of text A page
of text
A page A page
of text of text
A page
of text

A page
A page
of text
of text
A page
A page A page
of text
of text of text

A page
of text
World Wide Web
HTTP Server Client
Apache Mozilla Firefox
MS IIS MS Internet
HTTP Explorer

HTML data
Internet Protocols
• Internet Protocols are a set of rules that
governs the communication and exchange
of data over the internet. Both the sender
and receiver should follow the same
protocols in order to communicate the
data. In order to understand it better,
let’s take an example of a language.
• HTTP stands for HyperText Transfer Protocol. Tim
Berner invents it. HyperText is the type of text that is
specially coded with the help of some standard coding
language called HyperText Markup Language (HTML)
• HTTP provides a standard between a web browser and
a web server to establish communication.
• It is a set of rules for transferring data from one
computer to another. Data such as text, images, and
other multimedia files are shared on the World Wide
Web.
• Whenever a web user opens their web browser, the
user indirectly uses HTTP
HTTPS
• HTTPS stands for HyperText Transfer
Protocol Secure. It is the most common
protocol for sending data between a web
browser and a website
Web Programmer’s Toolbox
• HTML
• CSS
• JavaScript
The Internet
A vast network
of networks

Figure from “Web Applications”, C. Knuckles and D. Yuen, Wiley

Internet Reference Model
(TCP/IP)
IP (Internet Protocol)
• Layer 3 protocol

• IP is responsible for moving packet of data from machine to

machine

• IP forwards each packet based on a four byte destination address

(the IP number is a unique identifier for TCP/IP), such as:
192.168.8.2
TCP (Transmission Control
Protocol)
• Layer 4 protocol

• TCP is responsible for verifying the correct delivery of

data between machines

▫ detection of errors or lost data

▫ management of retransmission until the data is correct
and completely received
▫ assembles packets of data into the correct order
without duplication
▫ handles multiplexing
Domain name conversion
• Fully qualified domain names must be converted to IP
numbers before communication can take place over the
Internet
▫ DNS servers
Web Browsers
• Browsers are clients
▫ always initiate, servers react

• Allow user to browse resources available on server

▫ either existing or dynamically built documents

• Current common browsers

▫ Firefox, Internet Explorer, Google Chrome, Safari
Web Servers
• Provide responses to browser requests

• All communications between browsers and servers use

Hypertext Transfer Protocol (HTTP)

• Common servers
▫ Apache, Internet Information Server (IIS), Google Web
Server
Uniform Resource Locators
(URLs)
• Standard way of specifying entities on networks

• http:// www.mak.ac.ug

• ftp://

• Optional third parts

▫ Query string (preceded by ?)
▫ Fragment identifier (preceded by #)
World Wide Web Overview
HTTP Server Client
Apache Netscape
MS IIS Navigator
HTTP request
MS Internet
(URL)
Explorer

HTTP response
(HTML data)
HTTP Operation
• On the Internet HTTP usually uses TCP/IP
connections

• TCP Port 80 is the default (though others can be

specified)

• HTTP uses a Request/Response paradigm

▫ Client establishes a connection to the server, and
sends it a request
▫ Server responds to the request by generating a
response (which may or may not contain content)
HTTP Request
• Delivered from a client to a server containing instructions for the
server

• Contains
▫ the method to be applied to the data resource
▫ the identifier of the resource
▫ the protocol version in use

• Most commonly used methods:

▫ GET - Fetch a document
▫ HEAD - Fetch just the header of the document
▫ POST - Execute the document, using the data in body
▫ PUT - Store a new document on the server
▫ DELETE - Remove a document from the server
Request message
General request message structure
METHOD /path-to-resource HTTP/version-number
Header-Name-1: value
Header-Name-2: value

[optional request body]

Example
GET /index.html HTTP/1.1
Host: www.mak.ac.ug
Accept: text/*
User-Agent: Mozilla/2.02Gold (WinNT; I)
HTTP Response
• Message generated by a server after receiving and
interpreting a request
• Responses contain:
▫ Status line with the protocol version, a status code,
and a “reason phrase”
▫ Response-Header (containing information about the
server)
▫ Entity Header (meta-information)
▫ Entity Body (data)
Response message
General response message structure
HTTP/version-number status-code message
Response-Header-Name-1: value
Response-Header-Name-2: value
Entity-Header-Name-1: value
Entity-Header-Name-2: value Example
HTTP/1.1 200 OK
[optional entity body] Server: Apache (Red-Hat/Linux)
Content-Type: text/html
Content-Length: 9934

<HTML>
<HEAD>
<TITLE>Department of IT</TITLE>
…
Some HTTP Status Codes
• 200 : OK
• 201 : Created
• 202 : Accepted
• 204 : No Content
• 301 : Moved Permanently
• 302 : Moved Temporarily
• 400 : Bad Request
• 401 : Unauthorized
• 403 : Forbidden
• 404 : Not Found
• 500 : Internal Server Error
• 503 : Service Unavailable
Web development IDEs
• --Find out