Web 2.0 – The Web's Edge

advertisement
Web 2.0 – The Web’s Edge
Instructor Teresa Pelkie
Technologies that Made Web 2.0 Possible – Class # 3– Chapters 2. 3. 4
Arrival of Web 2.0:
The Internet started in the late 1950’s – early 1960’s as a project by the Department of Defense to enable
communications between various military units. This technology soon was used by scientific and educational institutions.
During 1989-1990, the Web, which is part of the Internet, was born. The Web has grown from a collection of static, readonly pages, to a way that people communicate and interact. This growth has been made possible by the development of
many technologies over the last 10 years. These technologies brought about changes in the behavior of the Web page.
The overall design, navigation, and linking has fundamentally stayed the same.
Understanding the Web Page Technologies:
DOM
JavaScript
CSS
DHTML
HTML
XML
CSS
HTML
•
Hypertext Markup Language – a markup language
•
Cascading Style Sheets
•
The language the Web page is written in
•
Formats the HTML elements
•
Consists of tags or elements
•
Separates content from presentation
Describes the structure and display of the page in the
browser
JavaScript
DHTML
•
A scripting language that runs in the browser
•
Dynamic HTML
•
Allows manipulation of elements
•
Allows for interactivity in the browser after the page
has been loaded
Document Object Model (DOM)
•
Hierarchical organization of the elements of the
Web page or an XML document
XML
•
Extensible Markup Language
•
Allows access of the element via a scripting
language
•
Use to structure and define data
•
Provides methods to access HTML and XHTML
elements via scripting
•
Also used to create other markup languages
•
Can be used as a data source for the Web page
CSIT 70 Instructor Teresa Pelkie Page 1 The Interaction of CSS, the Document Object Model, JavaScript and the HTML code in the Web Page:
The Web page displayed in the browser
Page changes without a trip to the server using scripting
CSS formats the presentation in browser
JavaScript function allows for display of information upon “click”
HTML “tags” structure content for display in the browser
JavaScript function is
called upon “click”
CSIT 70 Instructor Teresa Pelkie Page 2 Sample XML Document using CSS
Links to the CSS file to define the presentation
XML tags define and structure elements
CSS defines the presentation of the elements
CSIT 70 Instructor Teresa Pelkie Page 3 Server-Side Scripting
Allows for more powerful interactions – browser still needs to wait for the server response
Client-side scripting
•
Processed in the browser
Server-side scripting
•
Processed on the Server then returned to the browser as HTML.
¾
JavaScript
•
The server code is not visible in the browser.
¾
CSS
•
Commonly connects to a data source.
¾
DHTML
¾
CGI / PERL
¾
PHP / ASP.NET / JSP
Sample PHP code written in the same document with the HTML
<body>
<?php echo("Choose a site to visit:"); ?>
CSIT 70 Instructor Teresa Pelkie Page 4 The output in the browser of the PHP code on previous page
1. HTML form in browser programmed using PHP
2. User makes a selection
The PHP code is not visible in the browser
3. User is directed to another page
CSIT 70 Instructor Teresa Pelkie Page 5 Web Applications of XML
Advantages of XML
XML provides a format which can be used to communicate and exchange data between platforms and languages.
Where XML is commonly used in the Web 2.0 applications
1. Web Services
2. Web Feeds
Web Services
•
Web services allow one to publish a function or message so that others can use it on the Internet.
•
Web Services allow computers to exchange information in a highly structured fashion.
•
Web services use XML to code and to decode data.
•
Web services are self-contained and self-describing via the UDDI Protocol
(Universal Description, Discovery and Integration), which is also an XML language
•
Web Services are accessed using the SOAP Protocol
(Simple Object Access Protocol), which is also an XML language
•
Web services are self-contained and self-describing using the WSDL Protocol
(Web Services Description Language), which is also an XML language
Web Services have Two Types of Uses
1. Reusable application components.
Such as currency conversion, weather reports, or even language translation as services.
2. Connect existing software.
With Web services you can exchange data between different applications and different platforms.
SOAP - Simple Object Access Protocol - an XML language
• is a communication protocol
• is a format for sending messages
• is designed to communicate via Internet
• is platform independent
• is language and platform independent
WSDL – Web Services Description Language - an XML language
• is used to describe Web services
• is also used to locate Web services
UDDI - Universal Description, Discovery and Integration - an XML language
• I is a directory for storing information about web services
• I is a directory of web service interfaces described by WSDL
• communicates via SOAP
• Allows businesses to register and search for Web services.
CSIT 70 Instructor Teresa Pelkie Page 6 Two
T
example
es of popular Web Servic
ces deployed
d by Amazon
n.com
The
T below UR
RLS will provide access to this services if you sign up
p
Ama
azon Elastic Compute
C
Clo
oud (Amazon
n EC2) - http://aws.amazon
n.com/ec2/ - processing / computing
c
po
ower
Amazzon EC2 is a web service that provides resizable co
omputing cap
pacity in the
e cloud. It is designed
d
to make
m
webscale
e computing easier
e
for dev
velopers. It’s in
nterface allow
ws you to obta
ain and config
gure capacity. It provides you
y with
comp
plete control of
o your compu
uting resource
es and lets yo
ou run on Am
mazon’s proven computing environment..
Ama
azon Simple Storage
S
Serv
vice (Amazon
n S3) - http:///aws.amazon.com/s3/ - sto
orage of files
Amazzon S3 is sto
orage for the Internet. Am
mazon S3 provvides a simple
e web service
es interface th
hat can be ussed to store
and retrieve
r
any amount
a
of datta, at any time
e, from anywh
here on the web.
w
It gives any developerr access to the
e same highlyy
scala
able, reliable, fast, inexpen
nsive data storage infrastru
ucture that Am
mazon uses to
o run its own global network of web
sites. The service aims to maxiimize benefitss of scale and
d to pass thosse benefits on
n to developerrs.
Web Feeds
s
Web feeds are a data
d
format us
sed for provid
ding users witth frequently
y updated content. Conten
nt distributorss syndicate a
web feed, therebyy allowing use
ers to subscribe to it. Userrs subscribe to
t this conten
nt by means of
o an aggregator. Web
feedss allows one to
t subscribe to
t a blog or a podcast.
Web feeds are
W
e based on th
he XML language RSS (Re
eally Simple Syndication).
S
RSS makes it possible for
p
people
to subs
scribe to theirr favorite web
b sites in an automated ma
anner rather th
han checking manually.
W will cover this topic in more
We
m
detail latter on in this class
c
____
____________
___________
___________
___________
____________
___________
___________
____________
___________
_
P2P Communications
File and
d resource sh
haring -->info
ormation sha
aring --> ope
en source sofftware --> sh
haring of con
ntent
o-peer (or P2P) network is a network off many individ
dual computerrs connected to each
A peer-to
other, without a centra
alized server. Such networkks are useful for many purposes. Sharin
ng content
aining audio, video, data or
o anything in digital formatt is very comm
mon, and reall time data,
files conta
such as te
elephony traffiic, is also passsed using P2
2P technologyy.
A pu
ure P2P netw
work does not have the no
otion of clien
nts or serverrs but only eq
qual peer no
odes that sim
multaneously
y
function as both "clients" and "servers" to the other nodes on the network.
An im
mportant goal in P2P netwo
orks is that all clients proviide resourcess, including ba
andwidth, storage space, and
a
comp
puting power. Thus, as nod
des arrive and
d demand on the system in
ncreases, the
e total capacitty of the syste
em also
incre
eases. This is not true of a client/server architecture with
w a fixed se
et of servers, in which adding more clients could
mean
n slower data
a transfer for all
a users.
CSIT 70 Instructorr Teresa Pelkiee 7 Page 7
o P2P netwo
orks:
Charracteristics of
• Search an
nd download content that is shared by other
o
users
• develop social
s
file-sharring networkss
• file sharing
• media stre
eaming (audio
o, video)
er types of pe
eer-to-peer applications:
a
Othe
• File sharin
ng (using app
plication layerr protocols as BitTorrent)
• VoIP (usin
ng application
n layer protoccols as SIP)
• Streaming
g media
• Instant me
essaging and
d online chat
• Software publication an
nd distribution
n
• Media pub
blication and distribution (rradio, video)
ware Archite
ectures:
Softw
• BitTorrentt and Kazaa
• Gnutella
• Skype
oadens:
This concept bro
c
of P2
2P is increasingly evolving to human to human sharin
ng, with respe
ect to collabo
orative projectts such as
The concept
softw
ware developm
ment. New ty
ype of license
es which reco
ognize individual authorship but not excclusive properrty rights,
such as the GNU General Public License an
nd the Creativve Commons licenses have emerged.
U General Public License
GNU
The GNU Genera
al Public Licen
nse (GNU GP
PL or simply GPL)
G
is a widely used free software lice
ense,
originally written by
b Richard Sttallman for the
e GNU projecct. The GPL iss said to gran
nt the recipien
nts of a
puter program
m the rights off the free softw
ware definitio
on and ensure
es the freedom
ms are preserved, even
comp
when the work is changed or ad
dded to.
•
•
http://www
w.gnu.org/lice
enses/licensess.html
http://www
w.gnu.org/philosophy/free--sw.html
n Source
Open
The Open Source
e Initiative (OS
SI) is a non-profit corporatiion formed to educate abo
out and advoccate for the
benefits of open source and to
o build bridge
es among diffe
erent constitu
uencies in the open-source
e community.
e thought beh
hind open sou
urce is that ap
pplications ca
an evolve as fast
f
or faster through
t
comm
munity input
The
as through com
mmercial drive. A common example
e
of an open sourcce project is th
he Linux operrating system.
•
http://www
w.opensource
e.org/
ative Commo
ons License
Crea
Creative
e Commons liccenses are se
everal copyrig
ght licenses released
r
on December
D
16, 2002 by
Creative
e Commons, a U.S. non-profit corporatio
on founded in
n 2001. Many of the license
es, notably all
the origin
nal licenses, grant certain "baseline righ
hts", such as the right to diistribute the copyrighted
c
nges, at no ch
harge. Some of
o the newer licenses gran
nt more restricctive rights.
work without chan
•
http://crea
ativecommons
s.org/about/liccenses
CSIT 70 Instructorr Teresa Pelkiee Page 8
8 Web 2. 0 = RIA + SOA + End User
1. RIA – Rich Internet Appliations
Bringing the experience of the desktop to the Web
Characteristics:
• immediate response
• moveable windows
• graphical
• drag and drop
Web development frameworks used:
• Flash
• Ajax
• Web Procedure Calls (uses XML encoding to send requests)
• Other Served side technologies
Examples:
• Gmail (other web based email)
• Google Maps
• YouTube / Flickr
2. SOA – Service Oriented Architecture
How Web 2.0 applications expose their functionality so that other application can use and integrate that functionality.
This creates a much richer application.
SOA Examples:
• Mash-ups
• Feeds / RSS
• Web Services
Mash-ups
Mash-ups are the combining of content from web sites or web applications to create a single new site or experience. It is
the combining of data form one source, with data from another source, to develop a new application.
• New breed of applications on the Internet
• Built with APIs (application programming interface) openly developed by various and available to anyone
• Better data usage
Mash-up Examples
• http://anthemsonmap.googlepages.com/index.htm - combines national anthems (via a YouTube video) by clicking
on the country location on the map
Visit some interesting mash-ups!
o Uses a Google Maps API
o Uses a YouTube API
• Map Your Buddies – mash-up on Facebook (need an account)
o uses Facebook, Google Maps and Amazon APIs
• http://twittervision.com/ – track who is “tweeting” in real time – we will cover Twitter (microblog), later in this class
o uses Twitter's public feed and the Google Maps API.
• www.housingmaps.com
• also see www.mashupawards.com – for more mash-ups!
3. End User
Provides the social aspect
• Web 2.0 applications are designed to interact with the end user
• User is the participant - Tagging, providing content, podcasting
• User provides feedback
CSIT 70 Instructor Teresa Pelkie Page 9 Frameworks for Web 2.0 Application Development
Client side Ajax Frameworks
• Dojo
• Prototype
• Kabuki Ajax Toolkit (Ajax TK)
o Zimbra
Server side Frameworks
• Ruby on Rails
• Other traditional server technologies
o PHP
o ASP.NET
o Java
Frameworks for other RIA technologies
• Adobe Flash
• OpenLazlo – generated flash format
Difference between Ajax and Flash
Flash is a compiled program and requires the Flash player. Ajax is just text scripting that runs in the Web page.
CSIT 70 Instructor Teresa Pelkie Page 10 
Download