Web Development

Introduction
Introduction
● Internet
● World Wide Web
● Web Page
● Web Servers
● Server-Side Programming
● Web Browsers
● Client-Side Programming
● DNS – The Domain Name Service
● HTTP
Internet
● Late 1950s, U.S. government formed the Advanced Research Projects
Agency (ARPA)
● During the 1960s, the agency created a decentralized computer network
known as ARPAnet
⚪ Initially linked four computers located at
● The University of California at Los Angeles,
● Stanford Research Institute
● The University of California at Santa Barbara
● The University of Utah
● Email was implemented in 1972
● Telnet protocol for logging on to remote computers
● File Transfer Protocol (FTP), enabling file transfer between computers
● During 1989 Berners-Lee and his colleagues at the European particle
physics laboratory CERN (Conseil Europeen pour le Recherche Nucleaire)
proposed the concept of linking documents with hypertext that the now
familiar World Wide Web began to take shape
● The use of hypertext pages and hyperlinks helped to define the page-
based interface model that we still regard as the norm for web applications
today
What is internet?
• The Internet is a worldwide collection of computer networks
● connecting academic, governmental, commercial, and
● organizational sites.
• It provides access to communication services and
● information resources to millions of users around the globe.
• Internet services include:
• direct communication (e-mail, chat)
• online conferencing (Usenet News, e-mail discussion lists)
• remote login and file transfer (telnet, ftp)
• and many other valuable tools and resources

● → The Internet and the WWW are no synonyms

World Wide Web (WWW)
• WWW also known as the web
• Collection of hyperlinked text documents,
audio, and video files, and remote sites etc.
● Accessed via Internet, computers can contact
each other
● Public files on computers can be read by
remote user
⚪ usually Hypertext Markup Language (.
html)
● URL - Universal Resource Locator - is name
of file on a remote computer
● http://www.microsoft.com
The World Wide Web

● A world wide collection of electronic

documents
● The World Wide Web operates using a
client/server networking principle
The World Wide Web

● HTTP request contains several pieces of

information needed so that your page may be
correctly identified and served to you, including
the following:
⚪ The domain at which the page is stored (for example,
mydomain.com)
⚪ The name of the page (This is the name of a file in the
web server’s file system - for example, mypage.html.)
⚪ The names and values of any parameters that you want
to send with your request
Web Page, Website

● Each electronic document on Web is called a

Webpage
● Contain text, graphics, sound, video, and built-in
connections
● A website is a collection of web pages
● Generally speaking, each web page is actually
a separate file on the server. The collection of
individual pages constituting a website is
managed by a program called a web server
 Web Fundamentals
● Web Page
⚪ Each page available on the website is called a web page.
⚪ It is usually written in Hypertext Markup Language (HTML).
⚪ It contains text, graphics, images, videos and may also contain
hyperlinks to other web pages.
⚪ It is identified by a unique URL (Uniform Resource Locator).
● URL is the the unique address of any document available
on the web.

● Website
⚪ A collection of several related web pages written in HTML markup
language.

● Home Page
⚪ The first page of any website is called home page.
Web Fundamentals (Con’t)
Web Server
A machine that responds to client requests and sends the requested page
back to user.
popular web server software:
• Apache: www.apache.org

• Web Browser
• Web browser is a software tool used to access and search
information on web.
• Some of popular web browser software are:
• Mozilla Firefox: getfirefox.co
• Microsoft Internet Explorer (IE): part of Windows
• Apple Safari: part of Mac OS X
• Opera: opera.com
• Google Chrome
Web Server

● A web server is a program that interprets HTTP

requests and delivers the appropriate web page
in a form that your browser can understand
● Examples
⚪ Apache Web Server from the Apache Software
Foundation (http://www.apache.org), an open source
project used to serve millions of websites around the
world
⚪ Microsoft’s IIS (Internet Information Services), often
used on host computers running the Microsoft Windows
operating system
Server-Side Programming

● Server-side programs, scripts, or languages,

refer to programs that run on the server
computer
● Languages and Tools
⚪ PHP, Java, and ASP
● Server-Side scripting allows web pages to be
served with rich and varied content that would
be beyond the scope of any design using only
static pages—that is, pages with fixed content
Client-Side Programming

● Client-side programming, on the other hand,

happens not at the server but right inside the
user’s browser after the page has been received
● Such scripts allow you to carry out many tasks
relating to the data in the received page
⚪ Calculations, changing display colors and styles,
checking the validity of user input, and much more
● JavaScript, a client-side programming language
DNS – The Domain Name Service

● IP Address
⚪ 198.105.232.4
● Domain Name
⚪ www.somedomain.com
● DNS Server
⚪ Maps domain name to the corresponding IP
● DNS servers around the Internet are connected
together into a network that constantly updates
itself as changes are made
Introducing HTTP

● HTTP defines a set of rules regarding how

messages and other data should be formatted
and exchanged between servers and browsers
⚪ HTTP Client – The Browser
⚪ HTTP Server – Web Server
● The HTTP Request and Response
⚪ The HTTP protocol can be likened to a conversation
based on a series of questions and answers, which we
refer to respectively as HTTP requests and HTTP
responses
The HTTP Request and Response
● HTTP Request
⚪ After opening a connection to the intended server, the HTTP
client transmits a request in the following format:
● An opening line
● Optionally, a number of header lines
● Optionally, a message body
⚪ Opening Line
● The opening line is generally split into three parts; the name of the
method, the path to the required server resource, and the HTTP
version being used.
• GET /sams/testpage.html HTTP/1.0
⚪ Header lines
● Used to send information about the request, or about the data
being sent in the message body. One parameter and value pair is
sent per line, the parameter and value being separated by a colon
• User-agent: Mozilla/4.0
• Accept: text/plain, text/html
The HTTP Request and Response
● The HTTP Response
⚪ In answer to such a request, the server typically issues
an HTTP response
⚪ Status Line
● server echoes the HTTP version and gives a response
status code (a three-digit integer)
⚪ Reason Phrase
⚪ HTTP/1.0 200 OK
⚪ The response may also contain header lines each
containing a header and value pair, containing
information about the server and/or the resource being
returned:
● Server: Apache/1.3.22
● Last-Modified: Fri, 24 Dec 1999 13:33:59 GMT
The HTTP Request and Response
● Some Commonly Encountered HTTP Response Status Codes
URL

A URL is one type of Uniform Resource

Identifier (URI); the generic term for all
types of names and addresses that refer to
objects on the World Wide Web. The term
"Web address" is a synonym for a URL that
uses the HTTP or HTTPS(Hypertext
Transfer Protocol Secure) protocol.
Some Web programming technologies

• Hypertext Markup Language (HTML/XHTML):

• used for writing web pages

• Cascading Style Sheets (CSS):

• supplies stylistic info to web pages

• JavaScript: allows to program the behavior of web pages

• Hypertext Processor (PHP): allows the web server to create

pages dynamically

• Structured Query Language (SQL): interaction with databases

Websites Categories

● Personal websites
⚪ These websites are used by people for their personal use such as to
share information about themselves or their products, to enhance their
skills or post their curriculum vitae online to improve their chances of
getting a job.
⚪ Another most common use is to publish virtual journals called blogs
that describe events in people’s lives, their interests and their personal
opinions on different topics.

● Professional websites
⚪ These are created as portals that provide platform for businesses and
provide information on their products and services. Some of these
portals enable businesses to sell products online and act as virtual
storefronts for receiving orders and payment.
⚪ Such sites can directly generate revenue for businesses.
Websites Categories (Con’t)

● Static websites are developed with fixed-content pages that do not

contain any programmatically controlled content.
● Fixed contents pages are pages with content that does not change
dynamically.
● The content will only change when the website designer manually modifies
it.

● Dynamic websites are driven by dynamic content that is loaded or created

using programming and databases.
 What is Database and Database Management
System (DBMS)?

● Database
⚪ Collection of related data stored on a
particular topic
⚪ Storage and retrieval is in an organized
and efficient way
⚪ Examples: Hospital database, Library
database, Student database etc.

● Database Management System (DBMS)

⚪ Collection of programs that allows users to
create and maintain a database
⚪ Examples: MS Access, MySQL, DB2, SQL
Server etc.
Why is ‘Databases on the Web’ Important?

Databases are established technology for managing large

amounts of data.
Achieving complete separation between your site's design and
the content you want to present.
Interaction in real time
 What is a database-driven Web site?
● A database-driven Web site is a
Web site that uses a database to
gather, display, or manipulate
information

● Examples:
⚪ News sites: CNN.com and
MSNBC.com
⚪ E-commerce companies:
Amazon.com, which is a Web
interface of a big-sized
database system containing
customer and transactional
information.
Database-driven Web site Architecture

HTTP request Client

(Browser)

SQL Web
query Server HTML
page

Database
Server SQL
result
How to Integrate Databases
and the Web?

⚪ Databases
● MS Access
● MySQL, mSQL
● Oracle, Sybase, MS SQL Server

⚪ Integration tools
● PHP or CGI, Servlets, JSP, ASP etc.
Common Gateway Interface (CGI) is a
standard way for web servers) is a
standard way for web servers to interface
with executable programs) is a standard
way for web servers to interface with
executable programs installed on a
server that generate web pages
dynamically.
Home tasks
● Describe the different type of the websites.
● Explore the various option of your favorite Browser
● Describe in detail for the Port.
● Describe the sitemap.
● Describe Storyboarding
● What do you mean by a page layout? What are
the technology available for preparing page
layout? List the design point to be considered
while preparing page layout.
● Discuss the XHTML.