Sunteți pe pagina 1din 104

Dr. Sabin Buragawww.purl.

org/net/busaco
Dezvoltarea aplicatiilor Web

concepte primare & viziune


Dr. Sabin Buragawww.purl.org/net/busaco
“A defini inseamna a ucide,
a sugera inseamna a crea.”

Stéphane Mallarmé
Prolog:
Ce este Web-ul?

Dr. Sabin Buragawww.purl.org/net/busaco


world wide web

Dr. Sabin Buragawww.purl.org/net/busaco


Web, WWW, “panza de paianjen mondiala”

Serviciu Internet
WWW  Internet
world wide web

Dr. Sabin Buragawww.purl.org/net/busaco


Idee (Sir Tim Berners-Lee la CERN – 1989)

integrarea unor sisteme informaționale


disparate într-un mod unitar,
fără diferențe între sursele de date
world wide web

Dr. Sabin Buragawww.purl.org/net/busaco


Idee (Sir Tim Berners-Lee la CERN – 1989)

integrarea unor sisteme informaționale


disparate într-un mod unitar,
fără diferențe între sursele de date
world wide web

Dr. Sabin Buragawww.purl.org/net/busaco


Idee (Sir Tim Berners-Lee la CERN – 1989)

integrarea unor sisteme informaționale


disparate într-un mod unitar,
fără diferențe între sursele de date
world wide web

Dr. Sabin Buragawww.purl.org/net/busaco


Idee (Sir Tim Berners-Lee la CERN – 1989)

integrarea unor sisteme informaționale


disparate într-un mod unitar,
fără diferențe între sursele de date

anything can link to anything


world wide web

Dr. Sabin Buragawww.purl.org/net/busaco


“a common information space in which
we communicate by sharing information”

Sir Tim Berners-Lee (2013)

“Information Management: A Proposal”


www.w3.org/History/1989/proposal.html
world wide web

Dr. Sabin Buragawww.purl.org/net/busaco


Bazat pe modelul client/server

cerere
client
Web server
(browser) Web
raspuns
…si pe hipertext (hipermedia)

Dr. Sabin Buragawww.purl.org/net/busaco


world wide web

Dr. Sabin Buragawww.purl.org/net/busaco


Scopuri principale:

independenta de dispozitiv
independenta de software
scalabilitatea
ubicuitatea
world wide web

Dr. Sabin Buragawww.purl.org/net/busaco


Scopuri principale:

independenta de dispozitiv
independenta de software
scalabilitatea
ubicuitatea

caracter deschisopen standards


world wide web

Dr. Sabin Buragawww.purl.org/net/busaco


Functioneaza conform reglementarilor
Consortiului Web

MIT, ERCIM, Keio University


Adobe, HP, IBM, Oracle, Microsoft,…

www.w3.org
arhitectura Web-ului

Dr. Sabin Buragawww.purl.org/net/busaco


Resursele sunt identificate prin adresa lor

identificator uniform de resurse


URI – Uniform Resource Identifier

http://slideshare.net/busaco/presentations
arhitectura Web-ului

Dr. Sabin Buragawww.purl.org/net/busaco


Accesul la conţinutul – reprezentarea –
resurselor Web
se realizează printr-un protocol

HTTP – HyperText Transfer Protocol


arhitectura Web-ului

Dr. Sabin Buragawww.purl.org/net/busaco


adrese Web protocoale Web
URI = URL + URN HTTP, HTTPS, SPDY

codificarea nume de protocoalele


datelor domenii Internet
Unicode DNS TCP/IP
Dr. Sabin Buragawww.purl.org/net/busaco
pagini Web

resursele – documentele – includ <marcaje />


Dr. Sabin Buragawww.purl.org/net/busaco
marcajele conțin la rândul lor URI-urihipertext
Relatiile dintre o resursa Web, adresa ei (URI) si
reprezentarea structurata a resursei
adresabilitate via URI

Dr. Sabin Buragawww.purl.org/net/busaco


http://world.info/europe/romania/iasi/#weather?today
reprezentare
<weather>
identifica <point lat=… long=…>
<name lang= "ro">
informatii Iasi
reprezinta </name>
meteo <type>city</type>
despre Iasi …
</point>
resursa Web <temperature when=…>
<value>…</value>
</temperature>
</weather>
Relatiile dintre o resursa Web, adresa ei (URI) si
reprezentarea structurata a resursei
adresabilitate via URI

Dr. Sabin Buragawww.purl.org/net/busaco


http://world.info/europe/romania/iasi/#weather?today
reprezentare
<weather>
identifica <point lat=… long=…>
<name lang= "ro">
informatii Iasi
reprezinta </name>
meteo <type>city</type>
despre Iasi …
</point>
resursa Web <temperature when=…>
<value>…</value>
</temperature>
</weather>
reprezentarea – intr-un format deschis (e.g., HTML, XML,
JSON, RDF,…) – include date propriu-zise + meta-date
Web 1.0
Primul act:

Dr. Sabin Buragawww.purl.org/net/busaco


Dr. Sabin Buragawww.purl.org/net/busaco
Dr. Sabin Buragawww.purl.org/net/busaco
Sit Web

sistem pe care rulează un server Web


găzduind o serie de pagini (resurse) înrudite

ale unei organizaţii, companii sau persoane


Dr. Sabin Buragawww.purl.org/net/busaco
Aplicaţie Web

colecţie interconectată de pagini Web


cu conţinut generat dinamic, menită a oferi
utilizatorilor o funcţionalitate specifică
Dr. Sabin Buragawww.purl.org/net/busaco
Aplicaţie Web

interacţiunea dintre aplicaţie şi utilizatori


are loc via o interfaţă Web
Dr. Sabin Buragawww.purl.org/net/busaco
Aplicaţie Web

interacţiunea dintre aplicaţie şi utilizatori


are loc via o interfaţă Web

uzual, sit Web = aplicaţie Web


Dr. Sabin Buragawww.purl.org/net/busaco
Aplicaţie Web

exemple:
Amazon, Coursera, Dropbox, Expedia, Flickr,
info.uaic.ro, PHPMyAdmin, Reddit, Quora,
SlideShare, Twitter, Vimeo, webmin, WordPress

…și multe, multe altele


Caracterizare

Dr. Sabin Buragawww.purl.org/net/busaco


Arhitectura unei aplicaţii Web
Dr. Sabin Buragawww.purl.org/net/busaco
Aplicaţie Web = Interfaţă + Conţinut (Date) + Program
Dr. Sabin Buragawww.purl.org/net/busaco
Aplicaţie Web = Interfaţă + Conţinut (Date) + Program

mitul 1: cea mai importantă este interfaţa


mitul 2: cel mai important este programul
mitul 3: cele mai importante sunt datele

HTML, CSS, Ajax, Flash, Silverlight, SVG, WebGL,…


Dr. Sabin Buragawww.purl.org/net/busaco
Aplicaţie Web = Interfaţă + Conţinut (Date) + Program

mitul 1: cea mai importantă este interfaţa


mitul 2: cel mai important este programul
mitul 3: cele mai importante sunt datele

server: C#, Java, JavaScript, PHP, Ruby,…; client: JavaScript


Dr. Sabin Buragawww.purl.org/net/busaco
Aplicaţie Web = Interfaţă + Conţinut (Date) + Program

mitul 1: cea mai importantă este interfaţa


mitul 2: cel mai important este programul
mitul 3: cele mai importante sunt datele

relationale (SQL), XML, grafuri, modelare semantica (RDF)


Dr. Sabin Buragawww.purl.org/net/busaco
Aplicaţie Web = Interfaţă + Conţinut (Date) + Program

mitul 1: cea mai importantă este interfaţa


mitul 2: cel mai important este programul
mitul 3: cele mai importante sunt datele

fapt: sunt importante toate!


Web-ul social
Actul al doilea:

Dr. Sabin Buragawww.purl.org/net/busaco


Web-ul prezent

Dr. Sabin Buragawww.purl.org/net/busaco


WWW  platforma în care utilizatorul
îşi controlează propriile date

aşa-numitul Web 2.0, conform Tim O’Reilly, 2005


Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Participare
read/write Web

colaborare, comunităţi,
conectivitate inter-personală & între aplicaţii
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Partajare de artefacte informationale

documente, fotografii, multimedia, cod-sursă etc.


Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Inteligenţa colectivă

editare & management colaborativ al conţinutului

aplicaţii de tip wiki


Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Servicii şi nu pachete software
aplicaţiile masive („mamut”) sunt substituite
de cele constituite din servicii specifice,
disponibile pe Web, uşor de înlocuit

SaaS – Software as a Service


Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Software rulat oriunde

ubicuitatea aplicaţiilor Web

bookmark-uri salvate local (pentru fiecare browser)


vs. bookmark-uri disponibile pe Web, uşor de accesat
şi de partajat cu alţii
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Mediatizare (syndication) Web
date privitoare la un sit Web sunt expuse liber
via un flux (feed)
în format RSS (Really Simple Syndication)
sau Atom
XML
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Podcasting = pod (iPod) + broadcast

flux audio/video automat expediat utilizatorului


pentru a fi redat de un player multimedia – e.g., iTunes
accesibil oricând via un podcast feed
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Transformare/refolosire a datelor

datele sunt – sau ar trebui sa fie – disponibile


în formate deschise, universale, facil de procesat
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Transformare/refolosire a datelor

datele sunt – sau ar trebui sa fie – disponibile


în formate deschise, universale, facil de procesat

vezi succesul JSON (JavaScript Object Notation)


Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Încredere radicală

autentificare si/sau autorizare descentralizată

OpenID
OAuth
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Interactiune bogata cu utilizatorul
RIA – Rich Internet Applications

aplicarea modalitatilor de interactiune traditionala


(la nivel de desktop) in contextul aplicatiilor Web
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Interactiune bogata cu utilizatorul
RIA – Rich Internet Applications

avantajele Web-ului (ubicuitate, date distribuite


via hipertext, posibilitati de cautare etc.) +
interactiune sofisticata + utilizabilitate
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Interactiune bogata cu utilizatorul
RIA – Rich Internet Applications

avantajele Web-ului (ubicuitate, date distribuite


via hipertext, posibilitati de cautare etc.) +
interactiune sofisticata + utilizabilitate

suita de tehnologii HTML5


(inclusiv la nivelul dispozitivelor mobile)
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Valori de bază

deschidere, transparenţă, respect


Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Valori de bază

deschidere, transparenţă, respect

iniţiativa Creative Commons


reasonable, flexible copyright
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


http://creativecommons.org/about/licenses/
Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Valori de bază

partajarea pe Web a datelor deschise (open data)


Web-ul social: Caracteristici

Dr. Sabin Buragawww.purl.org/net/busaco


Valori de bază

partajarea pe Web a datelor deschise (open data)

exemplificari:
Data Hub – thedatahub.org
Open Data Commons – opendatacommons.org
Wikimedia Commons – commons.wikimedia.org
Intermezzo

Dr. Sabin Buragawww.purl.org/net/busaco


remarci

Dr. Sabin Buragawww.purl.org/net/busaco


Constituirea unor “pânze” (web-uri) – grupări,
rețele – de informații disponibile liber, evoluând
conform intereselor unei comunităţi
(e.g., utilizatori, organizație, industrie,…)
Dr. Sabin Buragawww.purl.org/net/busaco
Cum pot fi descrise la nivelul masinii
aceste web-uri?
Actul al treilea:
Web-ul datelor

Dr. Sabin Buragawww.purl.org/net/busaco


necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


o manieră de a atașa meta-date

date privitoare la date


„mai mult decât datele”
necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


o manieră de a ataşa meta-date

vocabulare de termeni descriind „ceva”


(proprietăți, domenii, persoane, lumi,...)
necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


un mod de specificare de relații între resurse

structuri de organizare a datelor


în cadrul unui sau mai multor web-uri
necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


modelarea & procesarea cunoștințelor
despre „lucruri” (knowledge about things)

Mike Bergman, The Rationale for Semantic Technologies (2012)


http://www.mkbergman.com/1015/the-rationale-for-semantic-technologies/
necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


modelarea & procesarea cunoștințelor

realizate sistematic, formalizat

ontologii
descrise riguros
necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


modelarea & procesarea cunoștințelor

create ad-hoc, manual, de către utilizatorii obişnuiţi

folksonomii
necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


modelarea & procesarea cunoștințelor

create ad-hoc, manual, de către utilizatorii obişnuiţi

folksonomii
uzual, tagging
necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


Modelarea datelor trebuie să facă implicitul explicit

„java”  limbajul, insula ori sortimentul de cafea?


necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


„Java este un limbaj de programare.”
„XWiki este o aplicație Web scrisă în limbajul Java.”
„Programarea Java poate fi mai ușoară decât cea în C++.”
necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


„Java este un limbaj de programare.”
„XWiki este o aplicație Web scrisă în limbajul Java.”
„Programarea Java poate fi mai ușoară decât cea în C++.”

ușor de înțeles de
(unii) oameni
necesităţi

Dr. Sabin Buragawww.purl.org/net/busaco


„Java este un limbaj de programare.”
„XWiki este o aplicație Web scrisă în limbajul Java.”
„Programarea Java poate fi mai ușoară decât cea în C++.”

ușor de înțeles de
(unii) oameni

… dar pot fi oare înțelese de către calculatoare?


rdf

Dr. Sabin Buragawww.purl.org/net/busaco


RDF (Resource Description Framework)

folosit la asocierea de meta-date resurselor Web


și la specificarea relațiilor dintre resurse
engleză

Dr. Sabin Buragawww.purl.org/net/busaco


Titlu: Remember That Night
Artist: David Gilmour
Anul apariției: 2007
Format: Blu-ray
Audio: Dolby True-HD
Video: VC-1 (1080i)
Tip: concert
Subtitrare: N/A
Detalii: www.davidgilmour.com

http://www.blu-ray.com/movies/David-Gilmour-Remember-That-Night-Blu-ray/493/
clasa persoanelor

Dr. Sabin Buragawww.purl.org/net/busaco


deține

Alina

relația www.flickr.com/bogdan areTag


knows

proprie-
tatea concert
areNume
photo
Bogdan
rdf

Dr. Sabin Buragawww.purl.org/net/busaco


Interogarea datelor RDF
se poate realiza via limbajul SPARQL
rdf

Dr. Sabin Buragawww.purl.org/net/busaco


Interogarea datelor RDF
se poate realiza via limbajul SPARQL

serviciile SPARQL pot fi descrise și invocate


via tehnologiile serviciilor Web clasice – e.g., REST

exemple:
http://dbpedia.org/sparql/
http://graph.facebook.com/
rdf: utilizări

Dr. Sabin Buragawww.purl.org/net/busaco


vocabulare de meta-date privind resursele

set standardizat de meta-date asociate documentelor


DCMI (Dublin Core Metadata Initiative)

documente multimedia partajabile


Adobe XMP (Extensible Metadata Platform)
rdf: utilizări

http://purl.org/vocab/

Dr. Sabin Buragawww.purl.org/net/busaco


rdf: utilizări

Dr. Sabin Buragawww.purl.org/net/busaco


relații între resurse

rețele sociale
FOAF (Friend Of A Friend)

proiecte software
DOAP (Description Of A Project)

comunități online
SIOC (Semantically Interconnected Online Communities)
rdf: utilizări

Dr. Sabin Buragawww.purl.org/net/busaco


modelarea cunoștințelor
în termeni „înțeleși” de software

RDF Schema

SKOS (Simple Knowledge Organizational System)

OWL (Web Ontology Language)


Dr. Sabin Buragawww.purl.org/net/busaco
AAA – Anyone can say Anything about Any topic
Dr. Sabin Buragawww.purl.org/net/busaco
Cum se asigura interoperabilitatea,
consistența și refolosirea web-urilor?
linked data

Dr. Sabin Buragawww.purl.org/net/busaco


Inițiativă privind publicarea și reutilizarea
datelor structurate disponibile liber pe Web

interconectare a resurselor descrise la nivel de Web

http://linkeddata.org/
linked data

Dr. Sabin Buragawww.purl.org/net/busaco


Inițiativă privind publicarea și reutilizarea
datelor structurate disponibile liber pe Web

inclusiv folosind formatul de date JSON – JSON-LD

http://json-ld.org/
http://lod-cloud.net/

Dr. Sabin Buragawww.purl.org/net/busaco


Dr. Sabin Buragawww.purl.org/net/busaco
Câteva exemplificări concrete?

Dr. Sabin Buragawww.purl.org/net/busaco


Dr. Sabin Buragawww.purl.org/net/busaco
augmentarea cautarii resurselor Web pe baza
microformatelor, schemelor de microdate HTML5 si RDFa

studiu de caz: Google Knowledge Graph


http://www.google.com/insidesearch/features/search/knowledge.html
Dr. Sabin Buragawww.purl.org/net/busaco
definirea unui graf social privind persoanele & relatiile acestora cu
diverse resurse de interes (fotografii, produse, locatii geografice,…)
Facebook Open Graph – developers.facebook.com/docs/opengraph/
curl -H 'Accept: text/turtle' http://graph.facebook.com/fii.uaic
@prefix rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#> .
@prefix api: <tag:graph.facebook.com,2011:/> . in prezent,
@prefix og: <http://ogp.me/ns#> . cu autorizare

Dr. Sabin Buragawww.purl.org/net/busaco


via OAuth
@prefix fb: <http://ogp.me/ns/fb#> .
@prefix : <http://graph.facebook.com/schema/~/> .
@prefix page: <http://graph.facebook.com/schema/page#> .
</215764508465252#>
page:id "215764508465252" ;
page:name "Facultatea de Informatica, UAIC, Iasi (FII)" ;
page:link <http://www.facebook.com/fii.uaic> ;
page:likes 284 ;
page:category "University" ;
page:website <http://www.infoiasi.ro/> ; meta-date
page:username "fii.uaic" ; asociate
page:location [
:street "General Berthelot, 16" ;
unei pagini
:city "Iasi" ; Facebook
:country "Romania" ;
:zip 700483 ] ;
page:general_info "…" ;
Cine este Linus Torvalds?

Dr. Sabin Buragawww.purl.org/net/busaco


PREFIX rdf:
<http://www.w3.org/1999/02/22-rdf-syntax-ns#>

SELECT DISTINCT *
WHERE {
<http://dbpedia.org/resource/Linus_Torvalds>
rdf:type ?val
}
LIMIT 20

interogari asupra DBpedia


(varianta procesabila de catre masina a enciclopediei Wikipedia)
http://dbpedia.org/isparql/
Cine este Linus Torvalds?

Dr. Sabin Buragawww.purl.org/net/busaco


diverse URI-uri
desemnand concepte
(definite in cadrul
unor web-uri)

interogari asupra DBpedia


(varianta procesabila de catre masina a enciclopediei Wikipedia)
http://dbpedia.org/isparql/
modelarea
cunostintelor

Dr. Sabin Buragawww.purl.org/net/busaco


cu aplicabilitate
in mass-media
exemplu: BBC

www.w3.org/2001/sw/sweo/public/
UseCases/BBC/
“Epilog”:
următorii (zeci de) ani…

Dr. Sabin Buragawww.purl.org/net/busaco


“concluzii”

Dr. Sabin Buragawww.purl.org/net/busaco


constituirea unui Web of Data

„Web 3.0”? „semantic


Web”?
“concluzii”

Dr. Sabin Buragawww.purl.org/net/busaco


constituirea unui Web of Data

acces pe baza protocolului HTTP


“concluzii”

Dr. Sabin Buragawww.purl.org/net/busaco


constituirea unui Web of Data

descriere de resurse și a relațiilor dintre ele via RDF


“concluzii”

Dr. Sabin Buragawww.purl.org/net/busaco


constituirea unui Web of Data

datele pot fi „mixate” pe baza vocabularelor multiple


“concluzii”

Dr. Sabin Buragawww.purl.org/net/busaco


constituirea unui Web of Data

datele pot fi „mixate” pe baza vocabularelor multiple

numeroase vocabulare sunt deja standardizate

inclusiv in vederea regasirii de resurse Web via motoare


de cautare – e.g., microdate HTML5: schema.org
“concluzii”

Dr. Sabin Buragawww.purl.org/net/busaco


constituirea unui Web of Data

structurarea avansată via modele conceptuale:


taxonomii, tezaure, ontologii – folosind OWL et al.
“concluzii”

Dr. Sabin Buragawww.purl.org/net/busaco


constituirea unui Web of Data

structurarea avansată via modele conceptuale:


taxonomii, tezaure, ontologii – folosind OWL et al.

managementul cunostintelor (knowledge management)
+
inginerie ontologica (ontology engineering)
Punct de vedere

Dr. Sabin Buragawww.purl.org/net/busaco


Web attitude (Tim Berners-Lee)

Anyone can say anything about anything


Punct de vedere

Dr. Sabin Buragawww.purl.org/net/busaco


Web attitude (Tim Berners-Lee)

No one knows everything about anything


Punct de vedere

Dr. Sabin Buragawww.purl.org/net/busaco


Web attitude (Tim Berners-Lee)

My system is most valuable


because of its interconnection to its peers
rezumat

Dr. Sabin Buragawww.purl.org/net/busaco


De la Web-ul clasic, la cel social
și la viitorul datelor procesabile de către computer
Dr. Sabin Buragawww.purl.org/net/busaco
episodul viitor: servicii Web & API-uri deschise