CHP NO1 Web Technology Hamid IBIT IP-1

Download as pdf or txt
Download as pdf or txt
You are on page 1of 93

Internet Programming

Web Technology
CHAPTER 1
Internet Programming

Hamid Raza Malik


[email protected]

03228463026
Course Aims
• To explain and demonstrate how to build static sites using client
side technologies such as
• HTML
• Cascading Style Sheets(CSS)
• JAVA Script
• To explain and demonstrate how to build dynamic sites using
server side technologies
• ASP.NET
• Database Connectivity
• Securing Sites
• Web Server
• Validation
• Performance
Course Contents
• Introduction
• HTML and XHTML
• Document Object Model (DOM)
• Cascading Style Sheets(CSS)
• Web servers management and Administration
• Web Forms and ASP/APSX Pages
• Server Side Controls
• Database Connectivity
• Validation
• Authentication and Authorization
• Session and state management
Grading
5
Quizzes 10%
Project 15%
Homework 5%
Mid exam 30%
Final exam 40%
Total 100%

 Homework and Programming projects will be posted


online on the class group
Programming Project
▪ You can start working on this from the first
week of the class
▪ Design and implementation of a
professional website:
– Professional Style
– Interactive
▪ I will post topics: mostly websites needed
by faculty and staff in our school
▪ You can complete the project in teams of
two
Programming Project
▪ Your project should have five out of the
following features (choose and document
these):
1. Use a Server-Side Framework - use a
technology other than HTML/CSS on the server.
2. AJAX - use AJAX to turn your web pages
into dynamic web applications.
3. Web Service - use an external web service,
mashed up with your own application to create
something even better.
Programming Project
4. Design & Evaluate - think carefully about
how users will use your site, design a great
interface, and evaluate it with real people.
5. Go Mobile - create a version of your project
designed to go mobile.
6. Server-Side Processing - do processing on
the server to prepare for user requests in
advance.
7. Multimedia – use sound or video to enhance
the user experience.
Homework
▪ It will involve:
– Applying what we learned in class
– Clean design and coding
– Clear documentation
▪ Homework will be completed individually
How the Web Works

Chapter 1
Objectives
1 Definitions and
History 2 Internet
Protocols

3 Client-Server
Model 4 Where is the
Internet?

Domain Name Uniform


5 System 6 Resource
Locators (URL)
Hypertext
7 Transfer Protocol
(HTTP)
8 Web Servers
Web Technology
• Web Technology is Set of
technologies used to create
web application and make
the web pages interactive,
and more powerful.

• Web technology refers to the means by which


computers communicate with each other using
markup languages and multimedia packages.

• It gives us a way to interact with hosted information,


like websites.
What is the internet of things?
▪ Network of Networks – Connectivity of many
independent or local computer networks with
each other
▪ The Internet is the global system of interconnected
computer networks that uses the standard Internet
protocol (TCP/IP) to communicate between networks
and devices.
How it Works?
• You send a request for information from your computer connected to
a modem (Device that connects your computer to a communication
link).
• You requests reaches the Internet Service Provider (ISP), who in turn
arranges to send it to the requested internet server.
• The returned response follows back to you using the same ISP.
• There are millions of ISPs who are internetworked together. Each
message travel through multiple routers belonging to any one of the
ISPs.
Web History
• Tim Berners-Lee invented the World
Wide Web in 1989.

• The WWW project was initiated at


CERN (European Center for Nuclear
Research) to create a system to
handle distributed resources for
scientific research.
Brief history
▪ Began as a US Department of Defense network called
ARPANET (1960s-70s)
▪ Packet switching (in the 60s)
▪ E-mail is born on 1971
▪ TCP/IP beginning on 1974 (Vinton Cerf)
▪ USENET (1979)
▪ By 1987: Internet includes nearly 30,000 hosts
Brief history (cont.)
▪ WWW created in 1989-91 by Tim Berners-Lee
▪ Popular web browsers released:
– Netscape 1994
– IE 1995
▪ Amazon.com opens in 1995
▪ Google January 1996
▪ Wikipedia launched in 2001
▪ MySpace opens in 2003
▪ Facebook February 2004
Key aspects of the internet

▪ Sub-networks are independent


▪ Computers can dynamically join and leave the
network
▪ Built on open standards
▪ Lack of centralized control (mostly)
▪ Everyone can use it with simple, commonly
available software
People and organizations

▪ Internet Engineering Task Force (IETF): internet


protocol standards
▪ Internet Corporation for Assigned Names and
Numbers (ICANN): decides top-level domain names
▪ World Wide Web Consortium (W3C): web standards
Commonly Used Terms - 1
▪ Client-Server: An information-passing scheme that works as
follows: a client program, such as Netscape, sends a request to
a server. The server takes the request, disconnects from the
client and processes the request.
▪ Protocol: a protocol is a set of rules which is used by computers
to communicate with each other across a network
▪ TCP/IP: (Transmission Control Protocol/Internet Protocol)
▪ TCP/IP specifies how data is exchanged over the internet by
providing end-to-end communications that identify how it should
be broken into packets, addressed, transmitted, routed and
received at the destination.
▪ These two are end to end protocols: TCP works at host level to
control assembly of packets and IP works at internet router level
to control the direction of traffic.
Commonly Used Terms - 1
▪ URL: Uniform Resource Locator:
▪ URL is the address of a specific location on the web. a URL is a
reference to a web resource that specifies its location on a computer
network and a mechanism for retrieving it.
▪ A URL has two main components:
▪ Protocol identifier: For the URL http://example.com , the
protocol identifier is http .
▪ Resource name: For the URL http://example.com , the resource
name is example.com .
▪ IP address:
▪ An IP address is a unique address that identifies a device on the
internet or a local network. IP stands for "Internet Protocol," which is
the set of rules governing the format of data sent via the internet or
local network.
▪ A numeric unique value usually defined in four octets (32Bits) like
168.34.123.255 . A new scheme of 128 (Called IPv6) is also
available now. One with 32 bits is called IPv4.
Commonly Used Terms - 1
▪ Domain Name:
• A domain name is a string of text that maps to an
alphanumeric IP address, used to access a website from client
software.

• In plain English, a domain name is the text that a user types


into a browser window to reach a particular website.

• For instance, the domain name for Google is 'google.com'.


Concept of HyperText and HTTP
• Terms was first coined by Ted Nelson in 1965.
• The Hypertext Transfer Protocol (HTTP) is the
foundation of the World Wide Web, and is used
to load webpages using hypertext links.

• HTTP is an application layer protocol designed to transfer


information between networked devices and runs on top of other
layers of the network protocol stack.

• HTTP laid the foundation of developing WWW in 1990 by Tim


Berners Lee.

• Hypertext is structured text that uses logical links, or


hyperlinks, between nodes containing text.
Web Protocol Layers
Commonly Used Terms - 2
World Wide Web (WWW): -- refers to all the public websites or
pages that users can access on their local computers and other
devices through the internet. These pages and documents are
interconnected by means of hyperlinks that users click on for
information.

• Homepage: the opening page of a web site


• Web-Portals, Websites: A web portal is a specially designed
website that brings information from diverse sources, like
emails, online forums and search engines, together in a uniform
way.
• Search Engines: are tools that help you to find things on the
Internet. One example of a popular search engine is Google.
Internet Protocol (IP)
• The Internet Protocol (IP) is a protocol, or set of rules,
for routing and addressing packets of data so that they can
travel across networks and arrive at the correct destination.
What is the internet protocol IP address used for?
• An IP address identifies every device connected to the internet.
• IP address stands for internet protocol address; it is an identifying
number that is associated with a specific computer or computer
network.
• There are two versions of IP that currently coexist in the global
Internet: IP version 4 (IPv4) and IP version 6 (IPv6).
• IP addresses are normally expressed in dotted-decimal format,
with four numbers separated by periods, such as 192.168.
123.132.
Internet Protocol (IP)
• The Internet uses the Internet Protocol (IP) addresses to identify
destinations on the Internet.
• Every device connected to the Internet has an IP address, which
is a numeric code that is meant to uniquely identify it.
IP Addresses
• In order for IP to send packets from a source computer to a
destination computer, it must have some way of identifying
these computers.
• All computers on the Internet are identified using IP addresses.
• IP addresses are 32-bit numbers.

• find out your internet IP address: whatismyip.com


• find out your local IP address:
• in a terminal, type: ipconfig (Windows) or ifconfig (Mac/Linux)
• Demonstrate "ifconfig". IPv6
IP Addresses

4 - 8 bit components
IPv4
(32 bits)
232 addresses

192.168.123.254

8 - 16 bit components
IPv6
(128 bits)
2128 addresses

3fae:7a10:4545:9:291:e8ff:fe21:37ca
Transmission Control Protocol (TCP)
▪ TCP is a standard that
defines how to establish
and maintain a network
conversation by which
applications can
exchange data.
▪ TCP works with the
Internet Protocol (IP),
which defines how
computers send packets
of data to each other.
Internet = Web?
▪ The World-Wide Web (WWW or simply the
Web) is certainly what most people think of when
they see the word “internet.”

▪ But the WWW is only a subset of the Internet.


Internet
• World Wide Web or WWW is a
framework for accessing linked Email
documents spread out over millions of
Web
machines all over the Internet.
Online
• The WWW has a unique combination of gaming

flexibility, portability, and user- friendly FTP

features.
A website is a collection of web pages.

Web pages are developed with the help of a


language called Hyper Text Markup
Language(HTML). It is also a language of Internet.

A web page may contain texts, graphics, sounds,


animations, and movies.
How is this website made available on
the Internet?

These web pages are to be stored in web


servers connected to the Internet, to be
made available to others.
Communication on web
Communication on web

A very simplified view of web technology


Communication on web
Request “document A”

Receive “document A”

Client Server

In order to communicate on the web, computers/devices


need to understand each other. This is made possible by
making all devices follow the same protocol, namely
TCP/IP.
Communication on web

In order to communicate on the web, computers/devices


need to understand each other. This is made possible
by making all devices follow the same protocol,
namely TCP/IP.
Routing of a data packet from sender to a
recipient

TCP reassembles the


TCP breaks the data data packets back to
into packets original form

The packets travel from router to router


over the internet according to the IP
Communication on web
In the Internet, there are several types of
communication.

• Websites are accessed using HTTP.

• Email communication happens using SMTP.

• Internet Protocol provides the basics of communication


over Internet.
The role of routers in transporting
data in Internet

• The routers need not be programmed separately


to handle different types of data.

• They do not need to know about the data they


are transporting.

• It concerned only about the address to which the


packet is to be delivered
• The openness of the data part of the packet gives
the freedom to design new protocols for the
Internet.

• This openness and flexibility of TCP/IP that led to


the development of protocols for

• social media websites to handle messages,


• content websites to handle video and audio,
• banking websites to handle money transfer securely,
etc

• It is a deciding factor for the economic success of the


Internet.
Communication on the web can be
categorized as
1. Client (browser) to webserver

Request “document A”

Receive “document A”
Client Server

2. Web server to Web server communication

Server Server
Essential for Communication over the
Internet
• Authentication : is the process of determining
whether a computer / server is the computer that
it claims to be.

• Security : it should be provided to communication


over Internet so that the messages are not
intercepted and modified by hackers.
1. Client (browser) to webserver
• It does not usually require authentication.
• But in the case of web based banking applications / e-mail services, user
names and passwords are required to be sent to the server.
• This information cannot be sent to the server in plain text due to security
reasons.
• The hackers may steal usernames and passwords, if it is communicated
and shared as plain text.
HTTPS
(Hyper Text Transfer Protocol Secure)

• HTTPS (Hyper Text Transfer Protocol Secure) technology to


encrypt the username and password and then send it to the
server.

• It works using SSL (Secure Sockets Layer)


SSL (Secure Sockets Layer)
• SSL provides a standard security technology for establishing
an encrypted connection between computers on Internet.

• It provides security capabilities to HTTP.

• This protocol not only ensures privacy, but also ensures that no
other website can impersonate the user’s login account not
alter the information sent.

• Verisign Inc. is a certification authority.


Client-Server authentication
process
• Browser requests to start a secure SSI session
• Server returns its SSL certificate
• Browser checks that : Certificate is valid, signed by
someone user trusts. If valid, browser initiates and
encrypted session

• Server and Browser encrypts all the transmitted data.


2. Web server to web server
communication
• It may be required in certain web applications.
• The web server of an online shopping website needs to
send confidential information to a bank web server and
vice versa.
• In such cases the web servers of the merchant and the
bank are to be authenticated.
• Digital certificates –
• Payment gateway – a bridge
Web server technologies
Web server
It is a server computer that hosts
websites

It enables us to deliver web pages or


services like e-mail, blog etc., to users
on the Internet

It consists of a server computer that


runs a server OS and a web software
installed on it for providing services Server

over the Internet


Web server
• It is a powerful computer which is always switched on and
connected to a high bandwidth Internet connection

• This will facilitate Internet users around the world to access


the websites and services hosted by it at any point of time

• It can have single or multiple processors, fast access RAM,


high performance hard disks, Ethernet cards that supports
fast communication

• It is usually installed in a data center to ensure faster Internet


connectivity and redundant power supply
Data center
• It is a dedicated physical location where organizations
house their servers and networking systems

• It is used for storing, processing and serving large


amounts of mission-critical data to their clients

• It requires extensive backup power supply systems,


cooling systems, high speed networking connections
and security systems
Popular Server OS
• Linux distributions

• Microsoft Windows Server

• FreeBSD (Berkeley Software Distribution)

• Oracle Solaris etc.,


Web server software
• After setting up a server, a web server software has to be
installed in it and configured according to the given OS

• The web server software is a program that uses the client-


server model and the HTTP to ensure timely distribution of
files stored in it to the users
Some of the preferred web server
packages are
• Apache Server
• Microsoft Internet Information Server (IIS)
• Google Web Server (GWS)
• enginex (engine-x):
open source software for web serving, reverse proxying, caching, load
balancing, media streaming, and more. ...

Other Software packages :


FTP, e-mail, DNS, databases etc
What is a DNS?
• Domain Name System (DNS) is a protocol under which a domain
address is converted into an IP address and redirects the browser
to a particular web server where the website files are hosted.

• This server then returns the requested web page and displays it in
your device’s browser.
Domain Levels
Top Level Domain (TLD)
Third-Level Domain

server1.www.funwebdev.com

Fourth-Level Domain Second-Level Domain (SLD)

Most general Top-Level Domain (TLD) com

Second-Level Domain (SLD) funwebdev

Third-Level Domain www

Most specific Fourth-Level Domain server1


How does DNS work?
(A basic Step by Step Process)
Step 1: When you enter the URL or domain name of the website into
a browser, the browser sends a message i.e. recursive DNS query to
the network, To search and find out which IP address the domain
name belongs to.

Step 2: This particular recursive DNS query is received by a recursive


DNS server also known as a recursive resolver that your ISP generally
manages. If this recursive resolver has the website’s address, the
website will load instantly.

Step 3: If the recursive resolver does not find the website’s address, it
will send messages to other servers in the following hierarchy:
▪ DNS root name servers
▪ TLD or Top-level domain name servers
▪ authoritative name servers.
How does DNS work?
(A basic Step by Step Process)
Step 4: These three types of servers work simultaneously until they are
not able to get back a DNS record that has the website’s IP address. If
found, the information will be sent to the recursive DNS server and the
webpage will start loading.

Step 5: Here the recursive server tends to store A record that contains
the IP address of the website in the cache so that when it receives the
same request for the same website again, it can directly respond
rather than going through all the query processes through server types.

Step 6: In case the other server types unable to find the domain’s
address and the request reaches the authoritative server and is still not
able to find the information. It will return an error message such as
404 error not found.
DNS Overview
How the DNS searches and locates the IP
address of a domain name?
URL Components
• In order to allow clients to request particular
resources from the server, a naming mechanism is
required so that the client knows how to ask the
server for the file.
• For the web that naming mechanism is the
Uniform Resource Locator (URL).

http://www.funwebdev.com/index.php?page=17#article

Protocol Domain Path Query String Fragment


HTTP Request Methods
• The HTTP protocol defines several different types of
requests, each with a different intent and characteristics.

• The most common requests are


• GET filename : download
• POST filename : send a web form response
• PUT filename : upload

• Other requests, such as PUT, DELETE, CONNECT, TRACE


and OPTIONS are seldom used, and are not covered
here.
GET versus POST requests
Internet Media (“MIME”) types
MIME type file extension
text/html .html
text/plain .txt
image/gif .gif
image/jpeg .jpg
video/quicktime .mov
application/octet-stream .exe
Web Designing

The first step in setting up a website is


planning the web pages for the websites
Popular web designing software's
HTML
• Hyper Text Markup Language

• It consists of tags and its attributes used to


format web pages
Static web pages
• Web pages that remain the same all the time until
their code is changed manually.

• Web site whose content are fixed. Every time


show same information

• It is created using HTML.


Dynamic web pages
• The web pages that contain server side code which
creates a web page each time it is accessed are
called dynamic web pages.

• Program code that runs on the server is called


server side code.

• Technologies like PHP, ASP, JSP, etc., are used to


develop dynamic web pages
Comparison of static and dynamic web
pages
Static web page Dynamic web page

• The content and layout of • The content and layout may change
web page is fixed during run time

• It never use databases • It uses the databases to generate


dynamic content through queries
• It directly run on the
browser and do not require • It runs on the server side
application program and displays
any server side application
the results
program
• This web page development
• These are easy to develop
requires programming skills
scripts
• These are program codes written inside HTML
page.

• They are written using a text editor like notepad.

• Scripting languages like JavaScript, VB script,


PHP, Perl, etc., are used to create dynamic web
pages.
scripts
• In an HTML page, a script is written inside <SCRIPT> and
</SCRIPT> tags.

• <SCRIPT> is used to embed or refer to an executable script


within an HTML document.
• It has the attributes type and src. (system reference code )

• Type attribute is used to identify the scripting language code


embedded within the script tag
• Src attribute is used to specify the URL of an external file
containing scripting code to be linked to a web page.

• <SCRIPT type = “text/javascript” src = “scriptcode.js”>


Types of scripting languages

• Client Side scripting

• Server Side scripting


Client Side scripting
• It is used to perform any task at the client side and is executed
in the browser.

• Since the script code is executed on the client browser, it


provides a quick response to the users.

• Disadvantage: there are browsers that do not support scripts. In


some cases users may turn off the execution of scripts in the
browser.
• Eg. JavaScript, VB script
• It is mostly used for validations and also for performing
simple calculations
Server Side scripting

• It is used to create dynamic web pages and are


executed in the server.

• Since the scripts are executed at the sever, the type


and version of the browser or OS on the client’s
computer does not affect its execution.

• Eg. Perl, PHP, ASP, JSP etc.,


Working of server side scripts
Working of server side scripts

1. The web page containing server side scripts requested


by the user

2. Server side scripts which executes and access the result


from the database

3. Creates simple web pages dynamically

4. This web page is then sent to the client browser and the
browser displays it
Comparison of the classifications of scripting
languages
Client side scripting Server side scripting
• Script is copied to the client • Script remains in the web server and is
browser and executed in the executed in the web server and the
client browser web page produced is returned to the
client browser
• Client side scripts are mainly used
for validation of data at the • Server side scripts are usually used to
client connect to database and return data
from the web server
• Users can block client side
• Server side scripting cannot be
scripting
blocked by the user
• The type and version of the web
• The features of the web browser does
browser affects the working of a
not affect the working of server side
client side script
script
Scripting Languages
Some of the popular scripting languages are given
below:

• JavaScript
• VB Script
• PHP (Hypertext PreProcessor)
• ASP (Active Server Pages)
• JSP (Java Server Pages)
Cascading Style Sheet (CSS)

• It is a style sheet language used for describing the formatting of


a document written in HTML.

• Using CSS, we can control

• The colour of the text,


• The style of fonts,
• The spacing between paragraphs,
• How columns are sized and laid out, borders and its colours,
• What background images or colours are used, as well as a variety of
other effects in a web page.
What You’ve Learned

1 Definitions and
History 2 Internet Protocols

3 Client-Server Model
4 Where is the
Internet?

5 Domain Name System


6 Uniform Resource
Locators (URL)

7 Hypertext Transfer
Protocol (HTTP) 8 Web Servers

You might also like