CS306 Introduction to Web Programming
Lecture 1
Introduction
Lecture :Dr. Ayman Mohamed
1
Course Contents
• The Internet & World Wide Web
• Introduction to web programming using:
— HTML
— CSS
— JavaScript
— PHP
2
The Internet
• The Internet is a public communication system
linking hundreds of thousands of individual
networks all over the world.
• The word Internet is derived from internetworking.
• The Internet makes information instantly
accessible worldwide.
• Using Internet, people can communicate with
each other in a faster and effective way.
• One can do all his shopping sitting back at home
(electronic commerce), etc.
3
Packet Switching
• The Internet operates based on a technique
called packet-switching, in which data is sent in
small packets.
• Packets from different senders are intermixed on
the same line.
• The packets contain address information so that
it can be routed to their destinations.
• This greatly reduces transmission costs
compared to dedicated communications lines.
4
Internet Overview :
Network: is a group of two or more devices
connected together .
Computer network : Is a group of computers
that are connected with each other in order to
sharing resources such as: Printers, Exchange files
Internet: It is a world-wide global system of
interconnected computer networks.
Internet Overview :
TCP/IP : the standard Internet Protocol. Every
computer in internet is identified by a unique
IP address.
IP Address :is a unique set of numbers which
identifies a computer location.
IP address: every computer in internet is
identified by a unique IP address.
IP Address: is a set of numbers which identifies
a computer location.
DNS Domain Name server: is used to give name
to the IP Address so that user can locate a
computer by a name.
Internet Overview :
Web browser:
is a program that runs on users' computers and allows
them to view and interact with the web pages on the World Wide
Web.
The most common web browsers are called Internet
Explorer and Google Chrome.
Hypertext : is a text document that contains links to
other text document.
It allows a user to move from one web page to another .
Internet Overview :
Webpage : Webpage is a single document that may
contain text, graphics, and icon. They are created using
HTML.
Web site : It is a group of well-structured and
interlinked webpages.
Internet Overview :
Uniform Resource Locator (URL) : To visit a Web
site, users type the URL, which is the site's
address, into the web browser. An example of a
URL is [Link].
A complete URL is generally made up of three
components: the protocol, the site name, and the
absolute path .
Internet Overview :
Web server :
A web server is a computer that stores a web site,
and is responsible for checking requests for
viewing that web site.
Client computers send requests for particular
URLs to the web server, which then finds the
appropriate web page, and sends it back to the
client computer.
A web server on the Internet must have a
permanent Internet connection, so that whenever a
client computer requests a URL, the web server can
respond straight away.
Internet Overview :
Internet Service Provider (ISP) :
A company that provides Internet connections to
customers.
Hypertext Transfer Protocol (HTTP/HTTPS) :
It is a communications protocol, it is the means by
which computers on the WWW communicate.
HTTPS : is the secure version of HTTP. It is used
on web sites where sensitive information such as
bank details is exchanged.
How the Web Works?
1. The user types a URL into the Web browser to identify
which Web page they would like to view.
2. The browser parses the URL and requests a DNS server
using broadcast IP. It then sends the URL to the DNS to
resolve the IP address. In other words, it converts
[Link] to [Link].
3. The browser then uses the IP address to send the HTTP
packet to the browser’s ISP connection, which passes it to
the next server, routing it from server to server until it
reaches the destination Web server.
How the Web Works?
4. The Web server locates the request page either on its hard
drive or cached in memory.
5. The Web server sends its contents back to the requested
browser.
6. The browser interprets the HTML formatting instructions
and displays the content to the user.
How the Web Works?
How the Web Works?
Web programming (Web Development) Overview:
Web programming
Is the creation of
dynamic web applications
Examples of WP
social networking sites e-commerce sites
like Facebook like Amazon
Web programming Overview :
Web programming
1- Front-end 2- Back-end
also called client-side also called server-side
development development
Refers to constructing what a Controls what goes on behind
user sees when they load a web the scenes of a web application.
application: the content, design Often uses a database to generate
and how you interact with it the front-end
done with three codes written in many different coding
HTML, CSS and JavaScript languages and frameworks,
such as: PHP, Java, Python…
HTML Vs. CSS Vs. JavaScript
HTML Vs. CSS
HTML Vs. CSS Vs. JavaScript
HTML Vs. CSS Vs. JavaScript
HTML Vs. CSS Vs. JavaScript
HTML short for Hypertext Markup Language and it is a
client-side Markup language.
It’s provides the basic structure of sites, which
is enhanced and modified by other technologies like CSS
and JavaScript.
CSS short for Cascading Style Sheets,
It’s used to control presentation, formatting,
and layout.
JavaScript It is a Client-side Scripting language,
It’s used to control the behavior of different elements.