Università di Genova DIRAAS Informatica per Umanisti‹N› Dipartimento Tecnologie Web...

‹N›Dipartimento InformaticaTecnologie Web

Università di Genova

DIRAAS

Informatica per Umanisti

Antonio Lieto


ARGOMENTI DI QUESTO GRUPPO DI LUCIDI

• Introduzione a XML • Introduzione al Web 2.0 • SaaS e Cloud Computing • RSS e Atom • Social tagging • Open API • Esempi di applicazioni basate su tecnologie Web


XML (eXtensible Markup Language) - I

• L’XML è un complesso di tecnologie, definite a mantenute dal W3C, incentrate sui linguaggi di markup, le quali giocano un ruolo importante in numerosi ambiti dell’informatica e, fra questi, in ambito Web.

• Difficile dare una definizione che contempli tutti gli aspetti essenziali delle tecnologie XML… con accettabile approssimazione, possiamo dire che: ➢ XML è un complesso di tecnologie che consentono la definizione di una famiglia di

linguaggi di markup (accomunati da alcune caratteristiche essenziali) e la scrittura, lettura e manipolazione via software di documenti specificati in linguaggi XML

➢ Dal sito del W3C: «The Extensible Markup Language (XML) is a simple text-based format for representing structured information: documents, data, configuration, books, transactions, invoices, and much more.» e ancora: «XML is one of the most widely-used formats for sharing structured information today: between programs, between people, between computers and people, both locally and across networks.»


• Tramite i linguaggi XML, è possibile costruire documenti strutturati il cui contenuto è arricchito con meta-informazioni espresse per mezzo di tag, attributi e valori per gli attributi (secondo il classico meccanismo offerto dai linguaggi di markup)

Esempio: consideriamo una ditta che importa e rivende caffè e supponiamo di voler rappresentare il suo listino prezzi in maniera da facilitarne l’uso e la manipolazione da parte di processi software

XML (eXtensible Markup Language) - II

nome prezzoMocha Java 11.95Sumatra 12.50

Listino prezzi caffè


• Una possibilità è quella di rappresentare il listino in un documento XML (di cui qui di seguito riportiamo solo le parti più rilevanti):

<listinoPrezzi> <caffe> <nome>Mocha Java</nome> <prezzo>11.95</ prezzo> </caffe> <caffe> <nome>Sumatra</nome> <prezzo>12.50</ prezzo> </caffe> </listinoPrezzi>

XML (eXtensible Markup Language) - III


• Una possibilità è quella di rappresentare il listino in un documento XML (di cui qui di seguito riportiamo solo le parti più rilevanti):


XML (eXtensible Markup Language) - III

TAG…

…


• Da dove vengono i tag usati nella rappresentazione del listino dei caffè?

• …sono stati inventati!

• Con XML, ciascuno (individuo, azienda, organizzazione,…) ha la possibilità di inventare i propri tag, i propri attributi, l’insieme di valori ammissibili per gli attributi e le caratteristiche strutturali per i propri documenti XML

• Per questa ragione XML: • è «extensible» (cioè non prevede un insieme predefinito e fisso di tag, attributi e valori,

ma ne consente la creazione) • Non è un singolo linguaggio di markup, ma è piuttosto un complesso di tecnologie per la

definizione di una famiglia di linguaggi di markup (di cui ciascuno può inventare nuovi membri)

XML (eXtensible Markup Language) - IV


• Principali analogie e differenze fra HTML e XML: • L’analogia è evidente: sia HTML che un qualunque linguaggio XML sono

linguaggi di markup

• Le principali differenze: ▫ HTML è un particolare linguaggio di markup; XML è un insieme di tecnologie che

consentono la definizione di molteplici linguaggi di markup

▫ HTML serve a specificare pagine Web; i linguaggi XML trovano applicazioni in molteplici ambiti (non solo nella specifica di pagine Web1 e non solo nel Web)

1 XHTML è un particolare linguaggio XML che può essere usato in alternativa ad HTML nella specifica di pagine Web

XML (eXtensible Markup Language) - V


• In che senso ogni linguaggio XML «appartiene ad una famiglia»?

• Nel senso che ogni linguaggio XML (da chiunque sia stato inventato) deve rispettare un insieme di regole sintattiche, stabilite dallo standard XML e sono proprio queste regole che lo accomunano a tutti gli altri linguaggi della «famiglia XML»

• Quali sono queste regole? Ne ricordiamo le principali…

XML (eXtensible Markup Language) - VI


Regola: Ogni documento XML deve avere una struttura gerarchica («ad albero (con un’unica radice)», dicono gli informatici):


XML (eXtensible Markup Language) - VII

listinoPrezzi

prezzo 11.95

nome Mocha Javacaffe

prezzo 12.50

nome Sumatracaffè

listinoPrezzi

caffe

nome prezzo nome prezzo

caffe

Mocha Java 11.95 12.50Sumatra

Rappresentazione del documento che mette in evidenza l’annidamento degli elementi

Rappresentazione della struttura gerarchica (ad albero) del documento


Regola: i tag sono bilanciati (cioè: ogni tag aperto viene anche chiuso). Controesempio: <listinoPrezzi> <caffe> <nome>Mocha Java <prezzo>11.95</ prezzo> </caffe> </listinoPrezzi>

Regola: gli elementi sono correttamente annidati (cioè l’apertura e la chiusura dei tag segue regole analoghe a quelle delle parentesi nelle espressioni algebriche). Controesempio:

<listinoPrezzi> <caffe> <nome>Mocha Java </caffe> </nome> <prezzo>11.95</ prezzo> </listinoPrezzi>

XML (eXtensible Markup Language) - VIII

Il tag «nome» è aperto ma non viene chiuso ➔ violazione della regola

il tag «nome» è chiuso dopo la chiusura del tag «caffe» ➔ violazione della regola


Regola: i tag sono case-sensitive (un carattere maiuscolo è considerato diverso dal medesimo carattere minuscolo) Controesempio: <listinoPrezzi> <caffe> <nome>Mocha Java</Nome> <prezzo>11.95</ prezzo> </caffe> </listinoPrezzi>

…vi sono altre regole sintattiche di base che qui non menzioniamo. Un documento che soddisfa le regole sintattiche di base dell’XML si dice documento XML ben formato

XML (eXtensible Markup Language) - IX

Viene aperto il tag «nome» e chiuso il tag «Nome»➔ violazione della regola


• Ciascuno è libero di inventare il proprio linguaggio XML con cui scrivere i propri documenti

• Talvolta, può essere utile non limitarsi ad usare il linguaggio XML che si è inventato e specificare tale linguaggio in appositi documenti (e/o file) che ne costituiscono, per così dire, la ‘grammatica ufficiale’

• Questo è utile se, ad esempio, uno stesso linguaggio XML deve essere condiviso con soggetti terzi o se, addirittura, esso ambisce a diventare uno standard

• Per scrivere la ‘grammatica’ di un linguaggio XML si possono usare appositi linguaggi con cui scrivere specifici documenti: il linguaggio dei DTD (Document Type Definition) o quello messo a disposizione da XML Schema

XML (eXtensible Markup Language) - X


• Non entriamo nel merito né di DTD, né di XML Schema. Per aiutare la comprensione di che cosa significhi scrivere la ‘grammatica’ di un linguaggio XML, riportiamo l’esempio di una grammatica per il linguaggio dei cataloghi di caffè, espressa usando il Document Type Definition:

<!ELEMENT listinoPrezzi (caffe)*> <!ELEMENT caffe (nome, prezzo)> <!ELEMENT nome (#PCDATA)> <!ELEMENT prezzo (#PCDATA)>

• Un documento XML è detto valido rispetto ad una ‘grammatica’ data se:

1. E’ un documento XML ben formato 2. Rispetta le regole sintattiche specificate dalla grammatica data

XML (eXtensible Markup Language) - XI


COS'È IL WEB 2.0 (I)

• Web 2.0 = termine introdotto per la prima volta nel 2004 come titolo di una conferenza promossa dalla casa editrice O’Reilly

• L'idea è che ci si stia avviando verso una nuova concezione del web ("versione" 2.0), in contapposizione con la "vecchia" concezione ("versione" 1.0)

• Concetto confuso e sfaccettato… è difficile darne una definizione, generalmente si indicano una serie di concetti emergenti

• La maggior parte dei siti attualmente online (es. Google, Yahoo, eBay, Amazon, YouTube, del.icio.us, Wikipedia, ecc.) possono essere considerati a pieno titolo Web 2.0

15


COS'È IL WEB 2.0 (II)

• Web come "partecipazione" gli utenti non sono più semplici lettori, ma diventano

autori di contenuti: sono i navigatori a generare i contenuti e a destare l’attenzione su ciò che ritengono più interessante

→ es: blog e communities (es. Facebook)

• Markup semantico utilizzo di linguaggi basati su XML, in cui i tag

"descrivono" il contenuto

16


COS'È IL WEB 2.0 (III)

• I siti diventano servizi interattivi (non più semplici collezioni di pagine) → la navigazione di un sito diventa un'esperienza interattiva estremamente più ricca

• Sito web = aggregazione, ri-combinazione di contenuti eterogenei e sempre aggiornati

• Mashup ("rimescolamento"): applicazioni Web che riutilizzano funzionalità e contenuti offerti in rete per creare servizi e contenuti nuovi

• Open API (servizi "aperti"): servizi e funzionalità sono messe a disposizione sulla rete (per es. Google Maps)

17


• Cambia il modo di definire i programmi: non sono più "prodotti", ma "servizi", offerti secondo il modello SaaS (Software as a Service)

• SaaS: il software non necessita di essere installato sul computer dell’utente, ma è reso disponibile come servizio, tramite un’applicazione Web che gli utenti possono utilizzare attraverso un normale browser

• Moltissime applicazioni tradizionalmente stand-alone stanno diventando Web-based (= basate su tecnologie Internet/Web, in contesto Internet o Intranet): scrittura, foto-ritocco, disegno, calcolo, montaggio video o audio, email, ma anche contabilità, CRM, ecc.

• I siti Web sono sempre più applicazioni Web (o servizi Web): non si limitano più a offrire contenuti informativi, ma offrono agli utenti un'esperienza interattiva e servizi anche complessi (es: e-commerce, social networks, blog, giochi di ruolo online, software collaborativi, ecc...)

COS'È IL WEB 2.0 (IV) SaaS: Software as a Service - I


[Some] notable service providers [lista incompleta tratta da Wikipedia]: • Amazon Web Services (aws.amazon.com/about-aws) • Google Apps (www.google.com/apps/index1.html) • iCloud (www.apple.com/icloud) • Microsoft Office 365 (www.microsoft.com/office365) • Oracle Cloud (www.oracle.com/us/solutions/cloud/overview/

index.html) • Salesforce (www.salesforce.com) • Windows Azure (www.windowsazure.com) • Zoho Suite (www.zoho.com)

COS'È IL WEB 2.0 (V) SaaS: Software as a Service - II


• Cloud computing = i dati e i programmi non risiedono sul computer dell'utente, ma "nella nuvola" ("in the cloud") e l'utente vi accede e interagisce attraverso un Web browser o una app (da smartphone o tablet)

• La "nuvola" ("cloud") è un insieme di server e infrastrutture che garantiscono la gestione dei dati e il funzionamento dei programmi, in modo totalmente trasparente per l'utente

• I programmi messi a disposizione come cloud services (servizi disponibili "nella nuvola") sono - di fatto - applicazioni Web, cioè programmi basati sulle tecnologie Web (HTTP, HTML/CSS, PHP, Javascript, AJAX, ecc...)

COS'È IL WEB 2.0 (VI) Cloud Computing e SaaS - I


Cloud computing → tipicamente suddiviso in tre livelli: • Infrastructure as a Service (IaaS): il provider offre l'infrastruttura

computazionale (server, data-center, risorse di rete, …) come servizio accessibile via Internet/Web (es: Amazon Amazon Elastic Compute Cloud: http://aws.amazon.com/ec2/)

• Platform as a Service (PaaS): il provider offre una piattaforma computazionale (ambiente di sviluppo per applicazioni "cloud") come servizio accessibile via Internet/Web (es: the Google Apps Engine: http://code.google.com/appengine/)

• Software as a Service (SaaS): il provider offre programmi (applicazioni) come servizi accessibili via Internet/Web (e.g., GoogleDocs: http://docs.google.com/)

COS'È IL WEB 2.0 (VI) Cloud Computing e SaaS - II


Quali strumenti ci permettono di realizzare il Web 2.0 e il Software as a Service? Tutte le tecnologie viste sin qui... + Open API (mashup) + AJAX e JQuery

Open API: • API = Application Programming Interface (Interfaccia di

Programmazione di un'Applicazione) = strumento per rendere disponibile ad altri programmatori le funzionalità di un programma

• Open = "aperte", disponibili a tutti

…vedremo anche questi «strumenti»…prima però vediamo alcuni altri esempi di applicazioni tecnologiche caratteristiche del Web 2.0…

COS'È IL WEB 2.0 (VII)


• RSS è un interessante esempio di: • tecnologia importante per il Web 2.0

• uso del markup semantico

• aggregazione/combinazione/mashup di contenuti provenienti da fonti diverse

• RSS è un formato per la pubblicazione su Web di contenuti ad alta frequenza di aggiornamento (es.

notizie, post su blog, ecc.)

• “RDF Site Summary” si riferisce alle versioni di RSS basate su RDF (Resource Description

Framework), un modello dati a sua volta esprimibile in un linguaggio XML

• “Really Simple Syndication” si riferisce a quelle versioni di RSS direttamente basate su XML

1Syndication: diffusione di notizie tramite un’agenzia di stampa

RSS: RDF Site Summary o anche Really Simple Syndication1 (I)


• RSS: • un formato, basato su XML, per la distribuzione di

contenuti sul web

• lo standard RSS definisce la struttura di una “notizia” (contenuto informativo), articolata in vari campi (es. autore, titolo, categoria, data di pubblicazione, ...)

• un sito può pubblicare i propri contenuti in formato RSS (RSS feed) e altri siti/applicazioni possono leggerli automaticamente

RSS: RDF Site Summary o anche Really Simple Syndication1 (II)


• Un documento RSS è un particolare tipo di documento XML

• Un documento RSS è chiamato feed RSS, il simbolo del feed è:

RSS: RDF Site Summary o anche Really Simple Syndication1 (III)


• Un altro formato per i feed, alternativo e più recente di RSS è Atom

• Anche il formato Atom è un linguaggio XML

• E’ stato definito per superare alcune limitazioni di RSS, ma quest’ultimo è ancora molto diffuso

• I documenti ATOM sono chiamati feed ATOM; il simbolo del feed è sempre lo stesso:

ATOM


<?xml version="1.0" encoding="UTF-8"?> <rss … version="2.0"> <channel> <title>Repubblica.it > Politica</title> <link>http://www.repubblica.it/politica</link> <description> <![CDATA[Repubblica.it: gli ultimi articoli della sezione Politica]]> </description> <language>it-IT</language> <copyright>Copyright 2012 - Gruppo Editoriale l'Espresso</copyright> <pubDate>Thu, 22 Mar 2012 20:54:26 +0100</pubDate> … … <item> <title> <![CDATA[Articolo 18, la frenata di Cisl e Ugl "Cambiare la norma sui licenziamenti"]]> </title> … <author> <![CDATA[[email protected] (Redazione Repubblica.it)]]> </author> <category domain="http://www.repubblica.it"><![CDATA[politica]]> </category> <pubDate>Thu, 22 Mar 2012 09:35:00 +0100</pubDate> … <description> … Domani la riforma arriva al Cdm; il governo si impegna "a evitare abusi", ma esclude passi indietro sulla mobilità in uscita. Bonanni chiede il reintegro per i...</p>]]> </description> … </item> <item> … </item> </channel> </rss>

Un esempio di (frammento di) feed RSS...


<?xml version="1.0" encoding="UTF-8"?> <rss … version="2.0"> <channel> <title>Repubblica.it > Politica</title> <link>http://www.repubblica.it/politica</link> <description> <![CDATA[Repubblica.it: gli ultimi articoli della sezione Politica]]> </description> <language>it-IT</language> <copyright>Copyright 2012 - Gruppo Editoriale l'Espresso</copyright> <pubDate>Thu, 22 Mar 2012 20:54:26 +0100</pubDate> … … <item> <title> <![CDATA[Articolo 18, la frenata di Cisl e Ugl "Cambiare la norma sui licenziamenti"]]> </title> … <author> <![CDATA[[email protected] (Redazione Repubblica.it)]]> </author> <category domain="http://www.repubblica.it"><![CDATA[politica]]> </category> <pubDate>Thu, 22 Mar 2012 09:35:00 +0100</pubDate> … <description> … Domani la riforma arriva al Cdm; il governo si impegna "a evitare abusi", ma esclude passi indietro sulla mobilità in uscita. Bonanni chiede il reintegro per i...</p>]]> </description> … </item> <item> … </item> </channel> </rss>

Un esempio di (frammento di) feed RSS...

Come detto, si tratta di un file XML

In questo caso, il file contiene la descrizione del “canale” (sezione di un sito che pubblica notizie) Repubblica>Politica e di una sequenza di notizie pubblicate su quel “canale”


<?xml version="1.0" encoding="UTF-8"?> <rss … version="2.0">

<channel> <title>Repubblica.it > Politica</title> <link>http://www.repubblica.it/politica</link> <description> <![CDATA[Repubblica.it: gli ultimi articoli della sezione Politica]]>

</description>

<language>it-IT</language> <copyright>Copyright 2012 - Gruppo Editoriale l'Espresso</copyright> <pubDate>Thu, 22 Mar 2012 20:54:26 +0100</pubDate> … …

<item> <title> <![CDATA[Articolo 18, la frenata di Cisl e Ugl "Cambiare la norma sui licenziamenti"]]>

</title> …

<author> <![CDATA[[email protected] (Redazione Repubblica.it)]]>

</author> <category domain="http://www.repubblica.it"><![CDATA[politica]]>

</category> <pubDate>Thu, 22 Mar 2012 09:35:00 +0100</pubDate> …

<description> … Domani la riforma arriva al Cdm; il governo si impegna "a evitare abusi", ma esclude passi indietro sulla mobilità in uscita. Bonanni chiede il reintegro per i...</p>]]>

</description> …

</channel> </rss>

Un esempio di (frammento di) feed RSS...E’ un esempio di markup semantico: vengono usati tag definiti in un linguaggio XML (in questo caso, RSS) per caratterizzare il contenuto e specificare il significato delle varie porzioni di informazione. Es. il tag <title> specifica che una certa sequenza di caratteri, racchiusa fra <title> e </title> è il titolo (di un canale o di una notizia); ogni notizia è racchiusa fra i tag <item> e </item>, <category> e </category> racchiudono la specifica della categoria a cui appartiene il canale o la notizia, ecc.


Produttori e consumatori di feed

• Un sito può pubblicare “notizie” sia in (X)HTML (il cui contenuto è visualizzato da browser), sia in RSS o Atom (cioè come feed) e metterle a disposizione di apposite applicazioni o di altri siti

• Vi sono due categorie di “consumatori” di feed:

• particolari applicazioni dette “feeedreader”: sono applicazioni client alle quali vengono fornite le indicazioni di quali feed devono “scaricare” e che periodicamente scaricano tali feed (anche da fonti diverse) e li visualizzano

• altri siti che aggregano notizie scaricate dai siti che pubblicano feed e le visualizzano (eventualmente riorganizzandone il contenuto)

...sono esempi di aggregazione/mashup di contenuti, tipici nel Web 2.0

‹N›Dipartimento InformaticaTecnologie Web – Diego Magro ©

Un esempio di descrizioni di notizie visualizzate da un feedreader


Un esempio di descrizioni di notizie visualizzate da un feedreader

Si notino le diverse sorgenti di informazione, in questo esempio, ANSA.it, Repubblica>Politica, Repubblica>Scienze, Torino Cultura-Musica-oggi

Naturalmente, è possibile indicare al feedreader un diverso insieme di fonti da cui aggregare le informazioni


Un esempio di sito che integra e riorganizza notizie provenienti da varie fonti: http://news.google.it


Feed e e-commerce

• I feed possono avere un ruolo anche nell’ambito dell’e-commerce

• Un azienda può pubblicare informazioni (ad esempio descrizioni dei propri prodotti o servizi, ma non solo) e metterle a disposizione di altri siti (ad esempio dei rivenditori) che possono presentarle (riorganizzate, inserite in opportuno contesto, ...)


SOCIAL TAGGING (I)

Ma che cos’è il social tagging? −Tag = “etichetta” (formata da una o più parole) collegata

ad un contenuto −Metadato = “dato sui dati” = informazione che descrive il

contenuto (es. autore di un documento, data dell’ultima modifica, …)

⇒i tag possono essere considerati metadati Sul Web 2.0 gli utenti (social) possono assegnare dei tag a

dei contenuti (tagging); per esempio: • del.icio.us: gli utenti possono assegnare dei tag a dei

segnalibri (preferiti)

• Flickr: gli utenti possono assegnare dei tag a delle immagini

35


Esempio: www.flickr.com – inserimento tag

36

SOCIAL TAGGING (II)


Esempio: www.flickr.com – ricerca per tag

37

SOCIAL TAGGING (III)


Esempio: www.flickr.com – click on beach tag

38

SOCIAL TAGGING (IV)


Generalmente i tag inseriti dagli utenti vengono mostrati in una tag cloud, utilizzata per navigare e trovare i contenuti desiderati all’interno del sito: cliccando su un tag (link), verranno mostrati tutti i contenuti a cui è associato quel tag

NB generalmente, in una tag cloud i tag più popolari sono visualizzati con caratteri più grandi…

39

SOCIAL TAGGING (V)

‹N›Dipartimento InformaticaTecnologie Web Tecnologie Web

SOCIAL TAGGING (VI)

L’insieme dai tag assegnati dagli utenti ai contenuti di un sito rappresenta una categorizzazione “sociale”, che esprime il punto di vista degli utenti, il modo in cui gli utenti classificano quei contenuti

Per esempio, in un archivio di immagini, il webmaster può suddividerle in un certo numero di categorie e sottocategorie:

ma queste non necessariamente corrispondono al modo

in cui le classificherebbe l’utente… i tag rappresentano una classificazione alternativa, più flessibile ed intuitiva:

40

…animali mare montagna arte

vacanze

felicitàMario_e_Maria pitturamare

tramonto

bianco_e_nero compleanno

Venezia


OPEN API (I)

Open API:

• API = Application Programming Interface (Interfaccia di Programmazione di un'Applicazione) = “strumento” per rendere disponibile ad altri programmatori le funzionalità di un programma. Ogni API di un programma è un insieme di procedure/funzioni invocabili (cioè attivabili) da un altro programma

• Open = "aperte", disponibili a tutti

Nell'ambito del Web 2.0 le Open API sono disponibili sul web (sfruttano le tecnologie – i protocolli, per es. HTTP – del web)

⇒ un programmatore può includere nel suo programma (per es. in un suo sito dinamico o applicazione web) funzionalità offerte da altri programmi = MASHUP


Web appgeocoder=new google.maps.Geocoder(); var latlng=new google.maps.LatLng(45,7); var myOptions = { zoom: 12, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP } ...

UI (User Interface)

API (Application Programming Interface)

OPEN API (II)

• Spesso (ma non sempre!) una stessa applicazione Web è offerta sia per l’uso da parte di utenti umani (tramite interfaccia utente), sia per l’uso da parte di agenti software (tramite Application Programming Interface)


servizio di

mappe

previsioni del tempo

tassi di cambio valute

condivi-sione di

foto

calen-dario

...

bla, blabla, blabla, bla, bla, bla, bla, bla, bla, bla bla, bla bla bla bla bla bla, blabla, blabla, blablabla, bla, bla.

MASHUP

OPEN API (III)


Open API (servizio di

mappe)

Open API (previsioni del tempo)

Open API (tassi di cambio valute)

Open API (condivi-sione di

foto)

Open API (calen-dario)

...

<script type="text/javascript"> var map = new GMap2(document.getElementById("map")); map.setCenter(new GLatLng(45.069,7.688), 14); map.addControl(new GSmallMapControl()); map.addControl(new GMapTypeControl()); map.addControl(new GScaleControl()); var iconUt = new GIcon(); iconUt.image = "http://labs.google.com/.../mm_20_green.png"; iconUt.shadow = "http://labs.google.com/.../mm_20_shadow.png"; iconUt.iconSize = new GSize(12,20); iconUt.shadowSize = new GSize(22,20); iconUt.iconAnchor = new GPoint(6,20); iconUt.infoWindowAnchor = new GPoint(5,1); GEvent.addListener(map, 'click', function(overlay, point) { ...

Dietro le quinte...

dallo script contenuto nella mia pagina “invoco” (utilizzo) funzionalità “remote” (definite e implementate su altri server)

OPEN API (IV)


OPEN API (V)

Per farvi un'idea... http://www.programmableweb.com/apis/directory dove (al 4/11/2014) risultano elencate più di 12.282 APIs...! (+ esempi di utilizzo = mashup) Qualche esempio (tra i tanti)...

Yahoo Traffic API Traffic Web Services from Yahoo! enable you to get traffic alert information

from a given location. Use the Traffic REST API to customize your request with many parameters including indicating locations based on city state, zip code, or a combination of any of these things, latitude-longitude, whether to include a map image, or a search radius in miles. [...]

Currencies Exchange Rates API The Currencies API provides a single JSON structure that is a matrix

containing the exchange rates for all known currencies. It is a read only service.


OPEN API (VI)

WeatherBug API WeatherBug is a full source weather provider featuring exclusive data

from its own network of over 8,000 weather observation stations in the USA. The API gives you access to live weather conditions, forecasts and severe weather warnings for all US zip codes.

WhitePages PRO API WhitePages PRO gives users access to the biggest database of

contact information for North American people and businesses. It covers 91% of U.S. adults and includes their names, household members, addresses, ages, and phone numbers.[...]

Flickr API The Flickr API can be used to retrieve photos from the Flickr photo

sharing service using a variety of feeds - public photos and videos, favorites, friends, group pools, discussions, and more. The API can also be used to upload photos and video. [...]


Agile CRM API Agile CRM is a customer relationship management (CRM) service

geared toward small businesses. It helps users manage individual contacts using tags, a lead scoring system, event tracking, and timelines. […]

Google Calendar API Google Calendar allows client applications to view and update

calendar events in the form of Google data API, GData, feeds. The Calendar Data API lets users incorporate Calendar functionality into their own application or website. Users can edit calendars, create and delete events, query for events that match particular criteria, send invitations, and more [...].

OPEN API (VII)


OPEN API (VIII)

Google Visualization API

The Google Visualization JavaScript API lets you access structured data and visualize that data using JavaScript in your web pages. The Google Visualization API also enables creation of gadgets.

…

48


OPEN API: GOOGLE MAPS (I)

Google Maps API • Google Maps consente di visualizzare la mappa di un

luogo prescelto e richiedere informazioni di vario tipo, per es. dove si trova un’azienda o una località, insieme ai dati di contatto e alle indicazioni stradali per raggiungerli

49


• L’utente può effettuare sulla mappa varie operazioni, per es. il trascinamento (per vedere zone adiacenti senza ricaricare la nuova area), l’ingrandimento o la riduzione

• Può anche scegliere se visualizzare una semplice mappa con le sole indicazioni stradali, o una carta satellitare

50

OPEN API: GOOGLE MAPS (II)


APPLICAZIONI BASATE SULLE TECNOLOGIE WEB

Le tecnologie web di cui abbiamo parlato sin qui architettura client-server, HTTP, (X)HTML, fogli di stile, linguaggi di

scripting client-side come Javascript o server-side come PHP, tecnologie come le Java Servlet, AJAX e le Open API, ...

possono essere utilizzate direttamente, per costruire un sito dinamico, o (più spesso) indirettamente, per costruire strumenti che a loro volta supportano la costruzione di siti dinamici

Alcuni esempi: • sistemi per la costruzione e gestione di Blog, Community

on-line e siti di Social Tagging • Content Managment Systems

51tecnologie

webstrumenti

(CMS, ecc...)siti web

usate per costruire

usati per costruire


BLOG (I)Che cos'è un blog? • blog = contrazione di web-log ("traccia sulla rete") • blog = "diario in rete" • un blog si crea e si gestisce attraverso un programma

(applicazione web) che permette di pubblicare contenuti su una pagina web (anche senza conoscere HTML)

• l'aspetto del blog può essere personalizzato con diverse vesti grafiche (template)

• l'autore può pubblicare dei post (messaggi/articoli) e i lettori possono pubblicare i loro commenti

• molti blog sono diari personali, ma spesso diventano veri e propri forum di discussione

52


BLOG (II)

53

Marco Travaglio (http://www.ilfattoquotidiano.it/blog/mtravaglio/)

A. Ferretti (su Il Fatto Quotidiano): www.ilfattoquotidiano.it/blog/aferretti/


BLOG (III)

• esistono molte applicazioni per creare e gestire blog, per es: • Google Blogger - www.blogger.com • Io Bloggo - www.iobloggo.com • Altervista- it.altervista.org/crea-blog-gratis.php • Blog.com - blog.com • Libero - blog.libero.it • MyBlog di Unito - https://www.serviziweb.unito.it/blog/ • Wordpress - wordpress.org/about/ CMS per costruire siti/

app web e mobile e blog • ecc...


COMMUNITY ON-LINE

• Rete sociale (social network) = gruppo di persone connesse da legami sociali (semplice conoscenza, rapporti di lavoro, ...)

• Comunità virtuale (on-line) = insieme di persone, spesso interessate ad un argomento specifico, che corrispondono tra loro attraverso una rete telematica

• Software sociale (social software) = software web-based che supporta l'interazione sociale in rete

Le comunità on-line si sviluppano secondo un modello collaborativo bottom-up: i contenuti sono stabiliti dai membri della comunità (modello top-down: i contenuti sono stabiliti da un'autorità esterna, gli utenti sono passivi)

I social software supportano la creazione di comunità on-line secondo diversi modelli di comunicazione:

• uno-a-uno (e-mail, instant messaging) • uno-a-molti (blog) • molti-a-molti (wiki)

55


COMMUNITY ON-LINE - ESEMPI (I)

Facebook (it-it.facebook.com): social software che supporta una rete sociale; gli utenti creano profili (foto, interessi personali, ...), scambiano messaggi, fanno parte di "gruppi di amici“,...

56


LinkedIn (www.linkedin.com): social software che supporta una rete sociale di relazioni professionali; è utile per:

• ottenere una presentazione a qualcuno che si desidera conoscere • trovare offerte di lavoro, persone, opportunità di business • ...

57

COMMUNITY ON-LINE - ESEMPI (II)


Anobii (www.anobii.com): social software che supporta una rete sociale di relazioni basate sui libri

58

COMMUNITY ON-LINE - ESEMPI (III)


SITI DI SOCIAL TAGGING

• Li abbiamo visti parlando del Web 2.0… • Spesso coincidono con le Community on-line • Esempio (già visto…): Flickr (www.flickr.com)

59


BLOG, COMMUNITY ON-LINE E SITI DI SOCIAL TAGGING

Ricordiamoci che... • sia gli strumenti per costruire e gestire blog, • sia i social software (strumenti che supportano la

creazione di comunità on-line e quindi di reti sociali) • sia gli strumenti utilizzati per costruire e gestire il social

tagging sono basati sulle tecnologie web di cui abbiamo parlato

sin qui (architettura client-server, HTTP, (X)HTML, fogli di stile, linguaggi di scripting client-side come Javascript o server-side come PHP, tecnologie come le Java Servlet, AJAX e le Open API, ...)

60

tecnologie web strumenti community,

blog, ecc...usate per costruire

usati per costruire

Università di Genova DIRAAS Informatica per Umanisti‹N› Dipartimento Tecnologie Web...

Documents

Transcript of Università di Genova DIRAAS Informatica per Umanisti‹N› Dipartimento Tecnologie Web...