Web Application Engineering

Lecture 1 – Introduction

Shahbaz Ahmad
 Accessing a Website

Client computer Server computer

Internet
connection

Web browser Web server

Database server
Components of a Web Application

• Web applications are a type of client/server application

• In a client/server application, a user at 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 provides the user interface for the application
• Web applications run on a server computer under the control of web
server software (IIS or Apache)
 Web Server
• A computer program that is responsible for accepting HTTP requests from clients (user agents
such as web browsers), and serving them HTTP responses along with optional data contents,
which usually are web pages such as HTML documents and linked objects (images, etc.).
Static Websites

• “Static” – the contents don’t change (unless they’re edited).

• Web pages (text files) and other needed files (e.g. images) are stored as
files on the web server and are retrieved as needed in response to HTTP
requests

Client Server

HTTP request

Browser Web server HTML file

HTTP response
Dynamic Websites

• Does not have web pages stored on the server in the same form as the
user will view them. Instead, the web page content changes
automatically and/or frequently based on certain criteria.

• The main purpose behind a dynamic website is that it is much simpler to

maintain a few web pages plus a database than it is to build and update
hundreds or thousands of individual web pages and links.
Dynamic Websites

• There are two ways to create dynamic web pages:

• Use client-side scripting to change interface behaviors within a specific web page, in

response to mouse or keyboard actions or at specified timing events. In this case the

dynamic behavior occurs within the presentation (JavaScript , VBScript & ActionScript),

• Use server-side scripting to change the supplied page source between pages, adjusting the

sequence or reload of the web pages or web content supplied to the browser. Server

responses may be determined by such conditions as data in a posted HTML form,

parameters in the URL, the type of browser being used, the passage of time, or a database or

server state (PHP, Perl, ASP ASP.NET, JSP).

• The documents produced by server-side scripts may, of course, contain client-side scripts.
Web Browser

• A Web browser is a software application which enables a user to display and interact with text,

images, videos, music, games and other information typically located on a Web page at a Web

site on the World Wide Web.

• Text and images on a Web page can contain hyperlinks to other Web pages at the same or

different Web site.

• Web browsers allow a user to quickly and easily access information provided on many Web

pages at many Web sites by traversing these links.

• Web browsers format HTML information for display, so the appearance of a Web page may

differ between browsers.

• Internet Explorer, Opera, Mozilla Firefox, Google Chrome

Brower - Server communications

 Type the URL in the web browser. If the URL contains a domain name,
the browser first connects to a domain name server and retrieves the
corresponding IP address for the web server.

 The web browser connects to the web server and sends an HTTP
request (via the protocol stack) for the desired web page.

 The web server receives the request and checks for the desired page.
If the page exists, the web server sends it. If the server cannot find the
requested page, it will send an HTTP 404 error message. (404 means
'Page Not Found')
Brower - Server Communications

 The web browser receives the page back and the connection is closed.

 The browser then parses through the page and looks for other page
elements it needs to complete the web page. These usually include
images, applets, etc.

 For each element needed, the browser makes additional connections

and HTTP requests to the server for each element.

 When the browser has finished loading all images, applets, etc. the
page will be completely loaded in the browser window.
 Universal Resource Location (URL)

http://lms.ntu.edu.pk/moodle/course/view.php?id=146

Protocol (Scheme)
Universal Resource Location (URL)

http:// lms.ntu.edu.pk/moodle/course/view.php?id=146

Host Name
Universal Resource Location (URL)

http:// lms.ntu.edu.pk/moodle/course/view.php?id=146

Port No ?!??!
Universal Resource Location (URL)

http://lms.ntu.edu.pk/moodle/course/view.php?id=146

Path
Domain Names and Address
Resolution
• To connect from computer A to computer B an IP address is used

• Usually people do not use IP addresses directly to access other

computers

• As a rule names like www.ntu.edu.pk are used because they are

easier to remember

• Domain Name Service or DNS distributed database is used to map

names to IP addresses
DNS: Domain Name Service

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

corresponding 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
Name  IP Address

• The job of the DNS server is to map the name to an IP address

• If the DNS server can not resolve the domain request (because it
does not have it in its part of the database) then it redirects the
request to a different DNS server
Hypertext Transfer Protocol (HTTP)

• HTTP is a request/response standard of a client and a server.

• The client making a HTTP request—using a web browser, spider, or

other end-user tool—is referred to as the user agent.

• The responding server—which stores or creates resources such as

HTML files and images—is called the origin server.

• HTTP is a connectionless text based protocol.

Hypertext Markup Language (HTML)

• It provides a means to describe the structure of text-based information in a

document—by denoting certain text as links, headings, paragraphs, lists, etc.—and

to supplement that text with interactive forms, embedded images, and other

objects.

• HTML is written in the form of "tags" that are surrounded by angle brackets.

• HTML can also describe, to some degree, the appearance and semantics of a

document, and can include embedded scripting language code (such as JavaScript)

that can affect the behavior of Web browsers and other HTML processors.
HTML

• HTML stands for Hyper text markup language. It is a formatting

language used to develop web page. It is not a programming
language. It is used to define text, image etc in web page. It uses tags
to specify how the content of web page will be displayed.

Ansar Javed::WAD-F16
Interesting Stuff to Study

• Browser Plug-ins

• Cookies