Teknik Informatika UAJY

PEMROGRAMAN WEB
(INF2332)
V2013-YSP-DEV

Minggu 1
Web Basics

Lesson Objectives

Understand the concept of World Wide Web

Understand the technology that support the World
Wide Web
Understand the Future of World Wide Web

V2013-YSP-DEV

Teknik Informatika UAJY

Outline

Introduction to World Wide Web

Technology that Support the World Wide Web
The Future of World Wide Web

V2013-YSP-DEV

Teknik Informatika UAJY

Teknik Informatika UAJY

INTRODUCTION TO
WORLD WIDE WEB
V2013-YSP-DEV

What is World Wide Web?

Wikipedia

World

Wide Web (Web) is a system of interlinked

hypertext documents accessed via the Internet.

V2013-YSP-DEV

Teknik Informatika UAJY

How the Web Works?

V2013-YSP-DEV

Teknik Informatika UAJY

How the Web Works?

The Internet is a collection of computers around the world

connected to each other via a high-speed series of networks.
The World Wide Web or Web consists of a vast assortment
of files and documents that are stored on these computers and
written in some form of HyperText Markup Language (HTML)
that tells browsers how to display the information.
The computers that store the files are called servers because
they can serve requests from many users at the same time.
Users access these HTML files and documents via applications
called browsers.
A Web browser is a program that displays Web pages and
other documents on the Web
V2013-YSP-DEV

Teknik Informatika UAJY

How the Web Works?

With a Web browser, a user views Web pages that

may contain text, images, videos, and other
multimedia and navigates between them using
hyperlinks
HTML, or HyperText Markup Language, is the
authoring language that describes how a Web
page should be displayed by a Web browser

V2013-YSP-DEV

Teknik Informatika UAJY

How the Web Works?

The Major Components of Web

Networks
 The

local-area and wide-area networks connecting

computers world-wide forming the Internet.

Clients
 Web

browsers that enable end-users to access the Web.

Servers
 Constantly

running programs that serve up information to the

Web.

V2013-YSP-DEV

Teknik Informatika UAJY

How the Web Works?

The Major Components of Web

Documents
 Web

pages, mostly coded in HTML, that supply information

on the Web.

Protocols
 The

Hyper Text Transfer Protocol HTTP that Web clients and

servers use to talk to one another and the TCP/IP
(Transmission Control Protocol) on which HTTP depends.

V2013-YSP-DEV

Teknik Informatika UAJY

History of World Wide Web

In 1980

Tim

Berners-Lee built ENQUIRE

 personal

database of people and software models,

 each new page of information in ENQUIRE had to be linked
to an existing page

In March 1989

Tim

Berners-Lee wrote a proposal

 referenced

ENQUIRE and described a more elaborate

information management system

V2013-YSP-DEV

Teknik Informatika UAJY

History of World Wide Web

In November 1990

Tim Berners-Lee publish a formal proposal with Robert

Cailliau

In December 1990

Tim Berners-Lee built all the tools necessary for a working

Web




the first Web browser (which was a Web editor as well),

the first Web server,
the first Web pages which described the project itself

V2013-YSP-DEV

Teknik Informatika UAJY

History of World Wide Web

In August 1991

Tim

Berners-Lee posted a short summary of the World

Wide Web project on the alt.hypertext newsgroup

On April 1993

CERN

(the European Laboratory for Particle Physics in

Switzerland by Tim Berners-Lee and co-workers.)
announced that the World Wide Web would be free to
anyone

V2013-YSP-DEV

Teknik Informatika UAJY

History of World Wide Web

In 1993

introduction

of the Mosaic Web browser

a

graphical browser developed by a team at the National

Center for Supercomputing Applications at the University of
Illinois at Urbana-Champaign (NCSA-UIUC)

In October 1994

Tim

Berners-Lee found the World Wide Web

Consortium (W3C)

V2013-YSP-DEV

Teknik Informatika UAJY

History of World Wide Web

The 1st Web Page

V2013-YSP-DEV

Teknik Informatika UAJY

History of World Wide Web

Mozaic Web Browser

V2013-YSP-DEV

Teknik Informatika UAJY

Teknik Informatika UAJY

TECHNOLOGY THAT SUPPORT

THE WORLD WIDE WEB
V2013-YSP-DEV

URL

The Web uses Uniform Resource Locators (URLs) to

identify (locate) resources (files and services)
available on the Internet.
A URL may identify a host, a server port, and the
target file stored on that host
Format

scheme://server:port/pathname

scheme://host.domain:port/path/filename

V2013-YSP-DEV

Teknik Informatika UAJY

URL: scheme://host.domain:port/path/filename

A full Web address like this:

The scheme is defining the type of Internet service: e.g. http or ftp
The domain is defining the Internet domain name like

http://www.w3schools.com/html/lastpage.htm follows these syntax rules:

scheme://host.domain:port/path/filename

w3schools.com

The host is defining the domain host. If omitted, the default host for http
is www
The :port is defining the port number at the host. The port number is
normally omitted. The default port number for http is 80
The path is defining a path(a sub directory) at the server
The filename is defining the name of a document. The default filename
might be default.asp, or index.html or something else depending on the
settings of the Web server./path/filename
V2013-YSP-DEV

Teknik Informatika UAJY

DNS

DNS (Domain Name System)

The

domain name system (DNS) provides a distributed

database service that supports dynamic update and
retrieval of information contained in the name space

it translates easily memorized domain names to the
numerical IP addresses needed for the purpose of
locating computer services and devices worldwide.

V2013-YSP-DEV

Teknik Informatika UAJY

DNS

DNS (Domain Name System)

V2013-YSP-DEV

Teknik Informatika UAJY

HTTP

Hyper-text Transfer Protocol

Protocol that used for browser-server communication

Transaction framework
1.
2.
3.
4.

5.

Connection: A browser (client) opens a connection to a server.

Query: The client requests a resource controlled by the server.
Processing: The server receives and processes the request.
Response: The server sends the requested resource back to the
client.
Termination: The transaction is done and the connection is closed
unless another transaction will take place immediately between
the client and server.

V2013-YSP-DEV

Teknik Informatika UAJY

HTTP

Hyper-text Transfer Protocol

HTTP Query and Response Formats

V2013-YSP-DEV

Teknik Informatika UAJY

HTTP

Hyper-text Transfer Protocol

V2013-YSP-DEV

Teknik Informatika UAJY

Teknik Informatika UAJY

THE FUTURE OF WORLD

WIDE WEB
V2013-YSP-DEV

Web 2.0

Tim O'Reilly

"Web

2.0 is the business revolution in the computer

industry caused by the move to the Internet as platform,
and an attempt to understand the rules for success on
that new platform"

V2013-YSP-DEV

Teknik Informatika UAJY

Web 2.0

Characteristics

network

as platform"

 delivering

(and allowing users to use) applications entirely

through a browser

users

owning the data on the site and exercising control

over that data

V2013-YSP-DEV

Teknik Informatika UAJY

Web 2.0

Characteristics

an

architecture of participation and democracy that

encourages users to add value to the application as
they use it
 this

stands in sharp contrast to hierarchical access control in

applications, in which systems categorize users into roles with
varying levels of functionality

a

rich, interactive, user-friendly interface based on

Ajax or similar frameworks

some social-networking aspects

V2013-YSP-DEV

Teknik Informatika UAJY

Web 2.0

Technology

The

complex and evolving technology infrastructure of

Web 2.0 includes
 server-software,
 content-syndication,
 messaging-protocols,
 standards-based

browsers with plugins and extensions,

 and various client-applications

V2013-YSP-DEV

Teknik Informatika UAJY

Web 2.0

Features

A Web 2.0 website may typically feature a number of the

following techniques







Rich Internet application techniques, optionally Ajax-based

CSS
Semantically valid XHTML markup and the use of Microformats
Syndication and aggregation of data in RSS/Atom
Clean and meaningful URLs
Extensive use of folksonomies (in the form of tags or tagclouds, for
example)

V2013-YSP-DEV

Teknik Informatika UAJY

Web 2.0

Features

A Web 2.0 website may typically feature a number of the

following techniques






Use of wiki software either completely or partially (where partial use

may grow to become the complete platform for the site)
Use of Open source software either completely or partially, such as
the LAMP solution stack
Weblog publishing
Mashups
REST or XML Webservice APIs

V2013-YSP-DEV

Teknik Informatika UAJY

Web 2.0 Examples

V2013-YSP-DEV

Teknik Informatika UAJY

Web 2.0 Examples

V2013-YSP-DEV

Teknik Informatika UAJY

Application on The Web

V2013-YSP-DEV

Teknik Informatika UAJY

References

World Wide Web

Web 2.0

http://en.wikipedia.org/wiki/Web_2.0

What Is Web 2.0: Design Patterns and Business

Models for the Next Generation of Software

http://en.wikipedia.org/wiki/World_Wide_Web

http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/
09/30/what-is-web-20

Java Network Programming, OReilly Media

V2013-YSP-DEV

Teknik Informatika UAJY

Mind Mapping Session

V2013-YSP-DEV

Teknik Informatika UAJY

Its Discussion Time!

@#!$%&&*(((!#

V2013-YSP-DEV

Teknik Informatika UAJY