Introduzione alla creazione di mashup tramite IBM Mashup Center

Transcript

1 Introduzione alla creazione di mashup tramite IBM Mashup Center

2 ii Introduzione alla creazione di mashup tramite IBM Mashup Center

3 Indice Capitolo 1. Esercitazione: introduzione alla creazione di mashup tramite IBM Mashup Center Capitolo 2. Informazioni sullo scenario. 3 Capitolo 3. Modulo A: Introduzione a IBM Mashup Center Lezione 1: Apprendimento della terminologia... 7 Checkpoint della lezione Lezione 2: Acquisizione di informazioni sull interfaccia utente Checkpoint della lezione Modulo A: Riepilogo Capitolo 4. Modulo B: creazione e preparazione della pagina Lezione 1: Creazione di una nuova pagina per il mashup Checkpoint della lezione Lezione 2: Aggiunta del widget Google Gadget al programma di creazione mashup Checkpoint della lezione Lezione 3: aggiunta di widget alla pagina Checkpoint della lezione Lezione 4: Configurazione del widget Google Gadget con un gadget di grafico azionario Checkpoint della lezione Modulo B: Riepilogo Capitolo 5. Modulo C: aggiunta delle informazioni sul cliente alla pagina.. 23 Lezione 1: creazione di un feed di informazioni sul cliente Checkpoint della lezione Lezione 2: Configurazione del widget Visualizzatore dati con informazioni sul cliente Checkpoint della lezione Modulo C: Riepilogo Capitolo 6. Modulo D: Creazione di un feed parametrizzato di dati di vendite pipeline Lezione 1: Creazione di un feed di dati di vendite pipeline Checkpoint della lezione Lezione 2: Importazione del feed pipeline nel programma di creazione mashup di dati Checkpoint della lezione Lezione 3: Creazione di un parametro CustomerName per il feed pipeline Checkpoint della lezione Lezione 4: Pubblicazione e salvataggio del feed parametrizzato di pipeline Checkpoint della lezione Modulo D: Riepilogo Capitolo 7. Modulo E: Creazione di un feed parametrizzato di ordini cliente.. 37 Lezione 1: Creazione di un feed di ordini cliente.. 37 Checkpoint della lezione Lezione 2: Importazione del feed di ordini del cliente nel programma di creazione mashup di dati. 39 Checkpoint della lezione Lezione 3: Creazione di un parametro CustomerName per il feed di ordini Checkpoint della lezione Lezione 4: Pubblicazione e salvataggio del feed parametrizzato di ordini del cliente Checkpoint della lezione Modulo E: Riepilogo Capitolo 8. Modulo F: configurazione dei widget Grafico e Scala del tempo per visualizzare dati Lezione 1: Visualizzazione di dati pipeline in un grafico a barre Checkpoint della lezione Lezione 2: Visualizzazione di ordini cliente come scala del tempo Checkpoint della lezione Modulo F: Riepilogo Capitolo 9. Modulo G: Collegamento di widget per la comunicazione Lezione 1: Collegamento dei widget Visualizzatore dati e Mappa Navteq Checkpoint della lezione Lezione 2: Collegamento dei widget Visualizzatore dati e Google Gadget Checkpoint della lezione Lezione 3: Collegamento dei widget Visualizzatore dati e Grafico Checkpoint della lezione Lezione 4: Collegamento dei widget Visualizzatore dati e Scala del tempo Checkpoint della lezione Lezione 5: visualizzazione del grafico dei collegamenti Checkpoint della lezione Modulo G: Riepilogo Capitolo 10. Modulo H: Pubblicazione e condivisione del mashup Lezione 1: pubblicazione del mashup nel catalogo 65 Checkpoint della lezione iii

4 Lezione 2: condivisione del mashup con altri Checkpoint della lezione Modulo H: Riepilogo Capitolo 11. Riepilogo iv Introduzione alla creazione di mashup tramite IBM Mashup Center

5 Capitolo 1. Esercitazione: introduzione alla creazione di mashup tramite IBM Mashup Center In questa esercitazione si apprenderà il processo end-to-end di utilizzo di IBM Mashup Center per creare un mashup reale e per pubblicarlo nel catalogo al fine di consentirne l utilizzo ad altri utenti. Si imparerà a convertire i dati da fogli di calcolo ad un formato che sia possibile utilizzare nei mashup e successivamente visualizzali in un widget. Si imparerà anche a creare un mashup di dati, memorizzarlo nel catalogo come feed parametrizzato e quindi visualizzare il contenuto del feed nel mashup. Obiettivi di apprendimento Una volta completata questa esercitazione, si apprenderà a raggiungere i seguenti obiettivi: v v v v v v Assemblare e collegare un mashup in base a uno scenario di semplice comprensione Creare un nuovo feed utilizzando i fogli di calcolo come origine dati Utilizzare il programma di creazione mashup dati per aggiungere parametri a feed Pubblicare mashup nel catalogo Configurare widget con origini dati Collegare i widget per inviare e ricevere eventi Tempo richiesto Due ore e venti minuti circa 1

6 2 Introduzione alla creazione di mashup tramite IBM Mashup Center

7 Capitolo 2. Informazioni sullo scenario In questa esercitazione si apprenderà il processo end-to-end di utilizzo di IBM Mashup Center per creare un mashup reale e per pubblicarlo nel catalogo al fine di consentirne l utilizzo ad altri utenti. Si imparerà a convertire i dati da un foglio di calcolo ad un formato che sia possibile utilizzare nei mashup e successivamente visualizzarli in un widget. Inoltre, si imparerà a creare un mashup di dati ed aggiungerlo al proprio mashup. Per consentire la comprensione dei concetti utilizzati in questo supporto didattico, verrà creato un mashup basato su uno scenario aziendale comune. Nello scenario, l utente è un venditore che si sta preparando per una visita del sito del cliente. L utente intende raccogliere tutte le informazioni possibili sul cliente e studiarle prima di arrivare sul sito, ma non ha molto tempo a disposizione. Decide di creare un mashup semplice che consenta di estrarre i dati sul cliente da più fonti, per poi visualizzare tali dati in una singola applicazione dinamica. L obiettivo del mashup è risparmiare tempo fornendo all utente le informazioni necessarie in modo rapido e semplice in occasione della preparazione per la visita. Durante la pianificazione del mashup, l utente decide quali parti dei dati sul cliente intende visualizzare nel mashup. I dati dovranno provenire da diverse fonti, ovvero dati interni ottenuti dal reparto risorse umane e dati esterni ricavati dal Web. L utente dovrà preparare il seguente elenco: v Una vista tabella di nomi cliente, località e altre informazioni pertinenti v Informazioni azionarie aggiornate v Una mappa che visualizzi la località del cliente v Una vista rapida dei dati di vendite pipeline v Una vista temporale che mostri una cronologia degli acquisti Con tutte queste informazioni a portata di mano in una singola interfaccia e disponibili in un singolo clic, l attività di preparazione per la visita del sito risulterà notevolmente semplificata. Nel mashup, il widget contenente la tabella di informazioni sul cliente sarà il pannello di controllo del mashup. Quando si fa clic su un nome cliente nella tabella, il widget inoltrerà il contenuto al resto dei widget. Quando gli altri widget ricevono il contenuto, vengono aggiornati insieme alle informazioni visualizzate in tali widget, per mostrare i dati per il cliente selezionato. Questa esercitazione è divisa in otto moduli. Ciascun modulo contiene una serie di lezioni da completare attraverso le attività richieste per soddisfare gli obiettivi di apprendimento del modulo. Si raccomanda di completare ciascun modulo nell ordine. Ogni modulo termina con un argomento di riepilogo che riprende le lezioni apprese. Tale argomento fornisce inoltre collegamenti a risorse aggiuntive, laddove disponibili. Per brevi descrizioni di ciascun modulo, vedere la tabella seguente: 3

8 Tabella 1. Descrizioni di moduli Modulo Modulo A: Introduzione a IBM Mashup Center Modulo B: creazione e preparazione della pagina Modulo C: aggiunta delle informazioni sul cliente alla pagina Modulo D: Creazione di un feed parametrizzato di dati di vendite pipeline Modulo E: Creazione di un feed parametrizzato di ordini cliente Modulo F: configurazione dei widget Grafico e Scala del tempo per visualizzare dati Modulo G: Collegamento di widget per la comunicazione Descrizione Questo modulo fornisce una panoramica su Mashup Center. Fornisce inoltre informazioni su una parte di terminologia importante e guida in una panoramica sull interfaccia utente. Questo modulo consente di preparare il programma di creazione mashup per il progetto mashup. Si creerà una pagina, si trascineranno widget dalla tavolozza alla pagina e si scaricherà e configurerà un altro widget non incluso nella tavolozza predefinita. Questo modulo fornisce una panoramica su pagine e widget. Questo modulo spiega come creare un feed di informazioni sul cliente memorizzate in un foglio di calcolo e come configurare il widget Visualizzatore dati per visualizzare il contenuto del feed in una tabella. Verranno filtrate alcune parti di contenuto di feed dalla vista tabella e si modificherà l aspetto della tabella stessa. Questo modulo fornisce una panoramica sui feed. Questo modulo spiega come creare un nuovo feed da un foglio di calcolo campione contenente dati di vendite pipeline sui propri clienti. Il contenuto del feed verrà importato nel programma di creazione mashup di dati, si creerà un parametro per il nome cliente e infine si pubblicherà il mashup di dati come nuovo feed. Questo modulo fornisce una panoramica sui mashup di dati. Questo modulo spiega come creare un nuovo feed da un foglio di calcolo campione contenente dati sugli ordini dei clienti. Il contenuto del feed verrà importato nel programma di creazione mashup di dati, si creerà un parametro per il nome cliente e infine si pubblicherà il mashup di dati come nuovo feed. Questo modulo è strutturato nello stesso modo del modulo D. Questo modulo spiega come configurare i widget Grafico e Scala del tempo nella pagina mashup con origini dati, modificare l aspetto della visualizzazione dei dati nei widget e molto altro. Questo modulo fornisce una panoramica sulla configurazione dei widget. Questo modulo spiega come collegare i widget presenti nella pagina mashup. Tale modulo consente la comunicazione tra i widget in base all opzione selezionata dall utente nella pagina mashup. Questo modulo fornisce una panoramica sul processo di collegamento e sui tipi di dati. 4 Introduzione alla creazione di mashup tramite IBM Mashup Center

9 Tabella 1. Descrizioni di moduli (Continua) Modulo Modulo H: Pubblicazione e condivisione del mashup Descrizione Questo modulo spiega come pubblicare il mashup nel catalogo per consentirne il rilevamento e il riutilizzo da parte di altri. Si imparerà inoltre a condividere la pagina mashup per consentire ad altri di aggiungerla alla propria tavolozza. Obiettivi di apprendimento Una volta completata questa esercitazione, si raggiungeranno i seguenti obiettivi di apprendimento: v Comprendere la terminologia di base e l interfaccia utente v Assemblare e collegare un mashup v v v Convertire i dati presenti in un foglio di calcolo in un feed e aggiungerli al proprio mashup Ristrutturare i dati del feed in un mashup dati e aggiungerli al proprio mashup Pubblicare il mashup nel catalogo per consentirne il rilevamento e il riutilizzo da parte di altri Tempo richiesto Il completamento di questa esercitazione dovrebbe richiedere circa due ore. Se si esplorano altri concetti correlati a questa esercitazione, il suo completamento potrebbe richiedere più tempo. Pubblico Gli utenti line-of-business che intendono imparare ad utilizzare Mashup Center per creare e condividere mashup per risolvere le situazioni quotidiane in ambito lavorativo. Lettura supplementare Man mano che si procede con questa esercitazione, è possibile consultare le seguenti fonti per ulteriori informazioni. Tali fonti si trovano nel wiki di Mashup Center. v v v v Getting starting using Mashup Center 2.0 fornisce una descrizione di tutti i componenti principali utilizzati nel prodotto e descrive le attività che è possibile svolgere con ciascun componente. Mostra inoltre immagini che richiamano i componenti per un accesso agevolato. Documentazione del prodotto Mashup Center 2.0 fornisce collegamenti all intera documentazione dei prodotti IBM. Offre sia le edizioni IBM che le edizioni della comunità della documentazione. Mashup Center 2.0 galleria di supporti include demo, video, esercitazioni, schede di riferimento e seminari Web per consentire agli utenti di iniziare ad utilizzare Mashup Center. Esercitazioni di Mashup Center 2.0 include collegamenti ad esercitazioni semplici per apprendere la modalità di creazione e pubblicazione di mashup, creazione di feed e trasformazione di dati. Capitolo 2. Informazioni sullo scenario 5

10 v Risorse di apprendimento di Mashup Center 2.0 tali piani di apprendimento forniscono collegamenti esaustivi a materiali concepiti per consentire a creatori di mashup, sviluppatori di widget e amministratori di aumentare la loro conoscenza di Mashup Center. Convenzioni utilizzate in questa esercitazione Ogni volta che viene utilizzata questa immagine accanto a una parola,, passare con il cursore del mouse sull immagine per visualizzare una definizione della parola. 6 Introduzione alla creazione di mashup tramite IBM Mashup Center

11 Capitolo 3. Modulo A: Introduzione a IBM Mashup Center In questo modulo, si apprenderanno informazioni su IBM Mashup Center. Si imparerà una parte di terminologia importante e sarà presentata una breve panoramica dell interfaccia utente. Mashup Center fornisce una soluzione di semplice utilizzo per applicazioni aziendali. Tramite Mashup Center, è possibile assemblare applicazioni situazionali dinamiche, con le funzionalità di gestione, sicurezza e direzione richieste dall IT (Information Technology). Con Mashup Center, è possibile svolgere le seguenti attività di alto livello: v Assemblare nuove applicazioni riutilizzando servizi e dati esistenti v Sbloccare informazioni aziendali, Web, personali e di reparto v Creare widget da sistemi aziendali v Rilevare e condividere applicazioni mashup, widget, feed e servizi v Trasformare e combinare informazioni in nuovi feed v Esplorare differenti combinazioni per scoprire nuovi approfondimenti v Incrementare la produttività e favorire l innovazione offrendo supporto allo sviluppo di applicazioni autonome Vedere le lezioni in questo modulo per capire come esplorare ed eseguire attività in Mashup Center. Obiettivi di apprendimento Completando le lezioni in questo modulo, verranno soddisfatti i seguenti obiettivi: v Imparare la terminologia comune di Mashup Center v Effettuare una panoramica sull interfaccia utente per comprendere lo scopo di ciascun componente Tempo richiesto Il completamento di questo modulo dovrebbe richiedere circa 10 minuti. Lezione 1: Apprendimento della terminologia In questa lezione, si apprenderà la terminologia comune utilizzata in IBM Mashup Center. Una volta completati i moduli di questa esercitazione, ritornare a questa lezione per comprendere termini e definizioni. Inoltre, per comodità, è possibile accedere al alcune di queste definizioni all interno delle lezioni stesse. È sufficiente passare con il cursore su questa immagine, immediatamente precedente ad essa., per visualizzare la definizione del termine Di seguito viene riportato un elenco dei termini più comuni utilizzati in Mashup Center: 7

12 catalogo Il catalogo è un repository comune per la condivisione e il rilevamento di widget, feed e mashup, con funzioni di comunità integrate come la valutazione, l utilizzo di tag e di commenti. mashup di dati Un mashup di dati è un feed che si manipola in qualche modo. Ad esempio, è possibile manipolare un feed in modo che i dati visualizzati vengano filtrati in base ad una qualche condizione. Per creare un mashup di dati, utilizzare l apposito programma di creazione. Il programma di creazione del mashup di dati include una serie di operatori e funzioni che consentono di importare i dati del feed, eseguire operazioni sui dati e successivamente pubblicare il risultato come nuovo feed. Alla fine, i mashup di dati si comportano come i feed. È possibile aggiungerli al catalogo per consentire ad altri di utilizzarli, contrassegnarli, valutarli e aggiungere commenti. È inoltre possibile aggiungerli a Mashup Center in modo che visualizzino i dati del feed nei widget Lettore feed o Visualizzatore dati. programma di creazione del mashup di dati Il programma di creazione del mashup di dati è uno strumento che consente di generare mashup di dati. Con il programma di creazione del mashup di dati, è possibile importare feed XML, JSON, Atom (Atom Syndication Format) e RSS (Really Simple Syndication) provenienti da Internet, da una intranet o dal catalogo e successivamente utilizzare gli operatori integrati per aggregare, manipolare e ristrutturare i feed di dati o di contenuto. È possibile filtrare o ordinare i dati in base a valori specifici. Inoltre, è possibile combinare i dati provenienti da più feed in un unico feed e specificare una nuova struttura di output per un feed. feed Un feed è un formato di dati che consente di distribuire frequentemente il contenuto aggiornato dei siti Web agli utenti. In Mashup Center, è possibile creare dei widget che visualizzino il contenuto dai feed. I feed possono avere vari formati, inclusi RSS e Atom. Per ulteriori informazioni sui feed, consultare questo articolo di Wikipedia. programma di generazione feed Mashup Center fornisce una serie di programmi di generazione feed che consentono di creare facilmente feed di consumo da una vasta gamma di origini di informazioni all interno dell azienda, inclusi database, informazioni desktop e di reparto e origini Web interne ed esterne. Per creare questi feed, gli utenti tecnicamente preparati puntano e fanno semplicemente clic utilizzando un interfaccia basata su una procedura guidata. mashup Un mashup è un applicazione Web lightweight che riunisce (o combina) informazioni provenienti da due o più origini dati in una nuova esperienza integrata. Generalmente, i mashup combinano i dati per creare una nuova origine dati o applicazione che presenti i dati in una singola interfaccia grafica. In un ambiente aziendale, di solito un mashup combina dati aziendali e dati basati su Web provenienti da un assieme di widget in una singola applicazione dinamica per affrontare un problema o una situazione specifici. Affinché si verifichi una combinazione, non è necessario che i widget si riconoscano a vicenda. programma di creazione di mashup Il programma di creazione di mashup è un interfaccia browser basata su widget contenente tutti i componenti necessari per la creazione, 8 Introduzione alla creazione di mashup tramite IBM Mashup Center

13 l assemblaggio, la configurazione e la progettazione di widget, spazi e pagine contenuti nei mashup. È possibile eseguire numerose attività direttamente nel programma di creazione di mashup, ad esempio la condivisione di oggetti con altri utenti, la pubblicazione di oggetti nel catalogo, la ricerca di oggetti nel catalogo, la creazione di widget in base ai modelli, la gestione degli spazi, il collegamento e la configurazione dei widget ed altro ancora. pagina Una pagina è l area di disegno in cui è possibile visualizzare, creare, modificare e collegare mashup. In modalità Modifica, è possibile personalizzare i layout di pagina per ottenere un aspetto univoco per i mashup. Le pagine possono essere singole unità da condividere con altri utenti o possono far parte di uno spazio. tavolozza La tavolozza è l area in alto nel programma di creazione del mashup che classifica i widget. Quando si apre una categoria, è possibile passare con il cursore sui widget per visualizzarne una breve descrizione. Inoltre, è possibile visualizzare se il widget è stato contrassegnato come non attendibile. La tavolozza contiene le opzioni per salvare la pagina corrente, visualizzare i widget nascosti e aprire il catalogo. spazio Uno spazio è una gerarchia di pagine con una serie di membri. È possibile fornire accesso agli spazi sia a singoli utenti che a gruppi di utenti. Una volta fornito l accesso, tali utenti ereditano automaticamente le impostazioni di controllo accessi per le pagine contenute nello spazio. gestore spazi Il gestore spazi è un interfaccia integrata per la gestione degli spazi nonché delle pagine contenute all interno dei propri spazi. Nel gestore spazi, è possibile facilmente visualizzare un elenco di tutti gli spazi che si possiedono oltre a quelli per cui si ha l autorizzazione alla modifica e alla visualizzazione. È possibile filtrare l elenco degli spazi e nascondere anche gli spazi dalla vista elenco di altri utenti. widget Un widget è una piccola applicazione portatile o parte di contenuto dinamico che è possibile inserire facilmente in una pagina Web o in un browser incorporato all interno di un rich client. I widget possono essere scritti in qualsiasi lingua (Java,.NET, PHP e altro) o possono essere un semplice frammento HTML. I widget che inviano gli eventi possono essere collegati per creare dei mashup. I widget sono denominati in modo differente dai vari fornitori, ad esempio, gadget, blocchi e flake. È possibile creare i widget con numerosi strumenti, tra cui Eclipse, IBM WebSphere smash o Notepad. Per semplificare il processo di creazione e distribuzione, Mashup Center include Lotus Widget Factory, un ambiente di creazione rapida dei widget basato su Eclipse. programma di creazione widget Il programma di creazione widget è uno strumento basato sul browser di semplice utilizzo per la creazione di widget personalizzati e la loro condivisione con la comunità. Il programma di creazione widget è stato progettato sia per gli utenti aziendali sia per gli sviluppatori Web. Come utente aziendale, lo strumento guida attraverso il processo di creazione di un progetto di widget completo, senza dover utilizzare il codice. Come sviluppatore Web, è possibile utilizzare il programma di creazione widget Capitolo 3. Modulo A: Introduzione a IBM Mashup Center 9

14 per creare widget oppure è possibile continuare ad acquisire ambienti di sviluppo più solidi come Lotus Widget Factory. Checkpoint della lezione In questa lezione, sono stati appresi alcuni termini e definizioni importanti utilizzati in Mashup Center. Lezione 2: Acquisizione di informazioni sull interfaccia utente In questa lezione, verranno presentati i componenti dell interfaccia utente di IBM Mashup Center. La comprensione dell interfaccia utente semplificherà l esplorazione e l esecuzione di importanti attività quali, ad esempio, la creazione di un mashup e la relativa pubblicazione nel catalogo. Per eseguire una panoramica sull interfaccia utente, procedere nel modo seguente: 1. Iniziare aprendo il programma di creazione di mashup, lo strumento grafico basato sul browser per l assemblaggio e il collegamento dei mashup. Per aprire lo strumento, accedere a Start Programmi IBM Mashup Center v2.0 Lotus Mashups. Per impostazione predefinita, alla prima apertura del browser, la pagina di benvenuto predefinita dello strumento viene visualizzata in modalità di visualizzazione. In questa modalità, è possibile soltanto visualizzare la pagina. A questo punto, non è possibile modificare le impostazioni della pagina o aggiungere eventuali widget. 2. A questo punto, passare alla modalità modifica per visualizzare tutte le parti dell interfaccia necessarie per la creazione dei mashup. Per passare alla modalità Modifica, è sufficiente fare clic su Vai a Modifica, accanto al menu azioni principale in alto a destra della pagina. In questo modo, si apre la tavolozza e vengono visualizzati tutti gli elementi preliminari, come mostrato nella seguente immagine: selettore di spazi Wiki di Mashup Center selettore di spazi menu azioni di pagina tavolozza impostazioni account menu azioni categoria menu azioni di spazio widget nascosti salva pagina catalogo widget pagina La tavolozza viene visualizzata nella parte superiore del browser. Per impostazione predefinita, la tavolozza è dotata di una serie di categorie contenenti widget per il trascinamento sulle pagine nonché di strumenti necessari per la creazione, modifica e gestione di pagine e spazi. In una fase successiva di questa esercitazione, si utilizzeranno quattro dei widget predefiniti durante la creazione del mashup. Si scaricherà inoltre un nuovo widget, che verrà aggiunto alla tavolozza e utilizzato nel mashup. Notare inoltre i selettori di pagine e spazi sopra alla tavolozza. Il selettore di pagine è l area nel programma di creazione mashup che consente di esplorare 10 Introduzione alla creazione di mashup tramite IBM Mashup Center

15 le pagine parent e tutte le pagine secondarie collegate ad esse. È possibile creare le pagine direttamente dal selettore di pagine. Il selettore di spazi è l area che consente di esplorare, gestire e creare spazi. È possibile aprire il gestore spazi direttamente dal selettore di spazi. È inoltre possibile utilizzare il selettore di spazi per visualizzare tutte le pagine contenute all interno degli spazi e creare nuove pagine per tali spazi. In questa esercitazione non si utilizzeranno gli spazi. Se, tuttavia, si desiderano ulteriori informazioni sugli spazi, vedere Utilizzo di spazi. Nota: L interfaccia utente di Mashup Center è un esempio perfetto di un mashup. L intera interfaccia è costituita da singoli widget collegati per creare un ambiente di lavoro uniforme. 3. Successivamente, eseguire una panoramica del catalogo. Per aprire il catalogo, fare clic sul menu azioni su cui è stato fatto clic nel passo precedente e selezionare Apri catalogo come nuova pagina. Qui è presente una vista rapida del catalogo: generatori di feed catalogo pr. creazione mashup dati Tenere presente il modo in cui viene visualizzato un elenco di tutti i feed, widget e pagine disponibili. È possibile visualizzare dettagli su tali elementi e fornire i propri commenti, valutazioni e tag. Nella sezione Comunità, è possibile visualizzare gli elementi consigliati da altri componenti della comunità. Quando si individuano i widget, i feed e le pagine desiderati, è possibile aggiungerli alla tavolozza con un paio di semplici clic. 4. Infine, verrà esaminata la procedura di creazione e manipolazione dei feed e dei mashup di dati. È possibile aprire la serie di programmi di generazione feed e il programma di creazione del mashup di dati facendo clic sul pulsante Crea in alto nella pagina. È possibile creare un nuovo feed basato su un origine dati esistente oppure creare un mashup di dati composto da operatori utilizzati per importare origini feed e ristrutturare i dati. Infine, è possibile caricare pagine e widget dal programma di creazione mashup direttamente nel catalogo per consentire ad altri di utilizzarli. Checkpoint della lezione In questa lezione, si è appresa la procedura di esplorazione dell interfaccia utente di Mashup Center. Si è appresa inoltre la procedura di utilizzo di pagine e spazi nel programma di creazione mashup. Infine, si è appresa la procedura di apertura del catalogo, di creazione di feed e mashup di dati e di caricamento di widget e pagine dal programma di creazione di mashup nel catalogo. Capitolo 3. Modulo A: Introduzione a IBM Mashup Center 11

16 Modulo A: Riepilogo Nel Modulo A, si è appresa una parte della terminologia comune utilizzata da IBM Mashup Center ed è stato effettuato un breve tour dell interfaccia utente. A questo punto, è possibile passare al modulo successivo per imparare a creare la pagina e aggiungere widget al suo interno. Lezioni apprese Completando questo modulo, sono stati raggiunti i seguenti obiettivi: v Imparare la terminologia comune di Mashup Center v Effettuare una panoramica sull interfaccia utente Risorse aggiuntive Utilizzare le seguenti risorse per ulteriori informazioni su Mashup Center: v Getting starting using Mashup Center 2.0 fornisce una descrizione di tutti i componenti principali utilizzati nel prodotto e descrive le attività che è possibile svolgere con ciascun componente. Mostra inoltre immagini che richiamano i componenti per un accesso agevolato. v Documentazione del prodotto Mashup Center 2.0 fornisce collegamenti all intera documentazione dei prodotti IBM. Offre sia le edizioni IBM che le edizioni della comunità della documentazione. v Mashup Center 2.0 galleria di supporti include demo, video, esercitazioni, schede di riferimento e seminari Web per consentire agli utenti di iniziare ad utilizzare Mashup Center. v Esercitazioni di Mashup Center 2.0 include collegamenti ad esercitazioni semplici per apprendere la modalità di creazione e pubblicazione di mashup, creazione di feed e trasformazione di dati. 12 Introduzione alla creazione di mashup tramite IBM Mashup Center

17 Capitolo 4. Modulo B: creazione e preparazione della pagina In questo modulo, si preparerà il programma di creazione mashup per il progetto mashup. Si creerà una pagina, si trascineranno widget dalla tavolozza alla pagina e si scaricherà e configurerà un altro widget non incluso nella tavolozza predefinita. In caso di creazione di un mashup, la prima operazione da eseguire è la creazione della pagina e la scelta dei widget che la comporranno. Se si stanno utilizzando dei widget non inclusi nella tavolozza predefinita aggiungere tali widget alla tavolozza., è necessario pianificare di Informazioni sulle pagine Una pagina è l area di disegno in cui è possibile visualizzare, creare, modificare e collegare mashup. Le pagine contengono elementi denominati widget, che è possibile personalizzare e configurare per risolvere una specifica esigenza aziendale. In questa esercitazione l esigenza aziendale è disporre di una singola interfaccia che consenta di ottenere dati sui clienti prima di una visita al sito. Quando si lavora in modalità Modifica, è possibile regolare la larghezza della pagina. È inoltre possibile applicare differenti temi per ottenere un aspetto univoco per la pagina. I temi forniscono l esplorazione, l aspetto e il layout della pagina, inclusi colori, caratteri e immagini che circondano i widget nella pagina. Attualmente, Mashup Center offre quattro temi che è possibile scegliere durante la progettazione della pagina. Per ulteriori informazioni sui temi, vedere Utilizzo di temi e aspetti. Una volta create le pagine, è possibile condividerle con altri utenti. È possibile condividere le pagine sia con singoli utenti che con gruppi di utenti. È possibile fornire a tali utenti l accesso di visualizzazione e/o di modifica. Se tali utenti dispongono dell accesso in visualizzazione, possono soltanto visualizzare la pagina. Se tali utenti dispongono dell accesso di modifica, possono aggiungere, eliminare e configurare la pagina. Tuttavia, poiché non sono il proprietario della pagina, non possono condividere la pagina con altri. Per ulteriori informazioni sulla condivisione di pagine, vedere Condivisione di pagine con altri. In questa esercitazione si creerà una singola pagina e la si condividerà con altri utenti. Iniziando con Mashup Center 2.0, è possibile aggiungere pagine a uno spazio. Sebbene gli spazi non vengano trattati In questa esercitazione è consigliabile acquisire familiarità con tali elementi per progetti futuri. Facoltativamente, dopo aver completato questa esercitazione è possibile aggiungere la nuova pagina a uno spazio e salvarla nel catalogo come modello per consentire ad altri di utilizzarla. Per ulteriori informazioni sugli spazi, vedere Utilizzo di spazi. Informazioni sui widget Un widget è una piccola applicazione portatile o parte di contenuto dinamico che è possibile inserire facilmente in una pagina Web o in un browser incorporato all interno di un rich client. I widget possono essere scritti in qualsiasi lingua (Java,.NET, PHP e altro) o possono essere un semplice frammento HTML. I widget che 13

18 inviano gli eventi possono essere collegati per creare dei mashup. I widget sono denominati in modo differente dai vari fornitori, ad esempio, gadget, blocchi e flake. Mashup Center offre diversi widget predefiniti nella tavolozza. È possibile trascinare tali widget sulle pagine e successivamente configurare, personalizzare e collegare tali elementi per creare dei mashup. È possibile aggiungere nuovi widget alla tavolozza dal catalogo, integrarli in pagine Web, creare skin per definire l aspetto, contrassegnarli come non attendibili e altro. In questa esercitazione si creerà un mashup da cinque widget. Quattro dei widget deriveranno dalla tavolozza predefinita fornita con Mashup Center. Il quinto widget è quello che verrà scaricato come pacchetto WAR, per poi essere caricato nel catalogo e aggiunto alla tavolozza. Per ulteriori informazioni sui widget, incluse descrizioni dei widget predefiniti e informazioni sulle modalità di utilizzo dello strumento del programma di creazione widget, vedere Utilizzo di widget. In questa esercitazione si utilizzeranno cinque widget. Per una descrizione di ciascun widget, vedere la tabella seguente: Tabella 2. Informazioni sui widget utilizzati in questa esercitazione Widget Descrizione Visualizzatore dati Il widget Visualizzatore dati organizza e visualizza il contenuto in una tabella. Può visualizzare i dati da un feed formattato da array RSS, Atom o JSON dal catalogo o da internet oppure da un file contenente dati in formato CSV (comma-separated value). Il widget Visualizzatore dati verrà configurato per visualizzare il contenuto da un foglio di calcolo campione di informazioni sul cliente in una vista tabella. Nel mashup finale, quando si fa clic sui nomi cliente nella tabella, verrà inviato un evento agli altri quattro widget, che verranno aggiornati e visualizzeranno soltanto il contenuto correlato al cliente selezionato. Per ulteriori informazioni sul widget Visualizzatore dati, vedere Visualizzatore dati. 14 Introduzione alla creazione di mashup tramite IBM Mashup Center

19 Tabella 2. Informazioni sui widget utilizzati in questa esercitazione (Continua) Widget Descrizione Grafico Il widget Grafico visualizza i dati in un grafico a barre, a barre impilate, a torta o a linee. Il widget Grafico può visualizzare i dati da un feed Atom, un file XML o un file con dati in formato CSV (comma-separated value). Il widget Grafico verrà configurato per visualizzare il contenuto da un foglio di calcolo campione di dati sulle vendite pipeline in un grafico a barre. Nel mashup finale, quando si fa clic su un nome cliente nel widget Visualizzatore dati, il grafico a barre riceverà un evento, aggiornerà e visualizzerà i dati sulle vendite per il cliente selezionato. Scala del tempo Per ulteriori informazioni sul widget Grafico, vedere Grafico. Il widget Scala del tempo visualizza una serie di eventi cronologici in una scala del tempo. I dati di evento possono provenire da un altro widget nella pagina, un feed Atom o RSS oppure da un file contenente dati in formato CSV (comma-separated value). Il widget Scala del tempo verrà configurato per visualizzare il contenuto da un foglio di calcolo campione di ordini del cliente in una scala del tempo cronologica. Nel mashup finale, quando si fa clic su un nome cliente, nel widget Visualizzatore dati, la scala del tempo riceverà un evento, verrà aggiornata e visualizzerà i dati dell ordine per il cliente selezionato. Google Gadget Per ulteriori informazioni sul widget Scala del tempo, vedere Scala del tempo. Il widget Google Gadget importa i gadget dal catalogo di gadget di Google. Sarà configurato il widget Google Gadget per importare un gadget di grafico azionario. Nel mashup, quando si fa clic su un nome cliente nella tabella, il widget Google Gadget verrà aggiornato e visualizzerà informazioni sui grafici azionari per il cliente selezionato. Per ulteriori informazioni sui Google gadget, consultare il sito Web Google gadget. Capitolo 4. Modulo B: creazione e preparazione della pagina 15

20 Tabella 2. Informazioni sui widget utilizzati in questa esercitazione (Continua) Widget Descrizione Mappa Navteq Il widget Mappa Navteq visualizza informazioni su mappa e strada per una località selezionata. In genere, l origine dati per la mappa è un feed estratto da un sito Web o da un feed creato nella Mashup Center serie di programmi di generazione feed. I widget Mappa Navteq e Visualizzatore dati verranno collegati in modo che la mappa mostri informazioni sulla località per un cliente quando si seleziona il nome di tale cliente nella tabella. Per ulteriori informazioni sul widget Mappa Navteq, vedere Mappa Navteq. Obiettivi di apprendimento Completando le lezioni in questo modulo, verranno soddisfatti i seguenti obiettivi: v Apprendere la procedura di creazione di una pagina v Apprendere la procedura di trascinamento e assemblamento dei widget in una pagina v Apprendere la procedura di caricamento di un file WAR del widget nel catalogo e di successiva aggiunta del widget alla tavolozza v Apprendere la procedura di configurazione di un widget che estrae i dati dal Web Tempo richiesto Il completamento di questo modulo dovrebbe richiedere circa 20 minuti. Lezione 1: Creazione di una nuova pagina per il mashup In questa lezione, si creerà una nuova pagina. Una pagina è l area di disegno in cui è possibile assemblare, collegare, modificare e visualizzare i mashup. Prima di creare una pagina per il mashup, selezionare Start Programmi IBM Mashup Center v2.0 Lotus Mashups per aprire il programma di creazione di mashup. Prima di iniziare con le fasi richieste per completare questa lezione, si consiglia di guardare la seguente demo. La demo è stata progettata per mostrare le fasi in azione prima che l utente tenti da solo. Per ignorare la lezione demo e passare alla versione testo di questa lezione, scorrere fino alla sezione Procedura sotto la demo. Demo: creazione di una nuova pagina Quando si crea un mashup, la prima fase è la creazione di una pagina. Nel programma di creazione mashup, si creano i mashup trascinando i widget in una pagina. È possibile riorganizzarli e personalizzare il layout e il tema della pagina. 16 Introduzione alla creazione di mashup tramite IBM Mashup Center

21 Inoltre, è possibile impostare le autorizzazioni per specificare i gruppi di utenti che dispongono dell accesso in modifica dopo aver pubblicato il mashup nel catalogo. Per ulteriori informazioni sulla creazione delle pagine, l impostazione delle autorizzazioni di accesso, la personalizzazione delle pagine con temi e altro, consultare Utilizzo di pagine nel wiki di Mashup Center. Per creare una nuova pagina per il mashup, procedere con le seguenti fasi: 1. In alto nella pagina del programma di creazione di mashup, individuare il selettore di pagina e fare clic nella pagina al momento selezionata. In questo modo viene aperto un menu di pagine disponibili. 2. Nel menu, fare clic su Crea una nuova pagina. 3. Nel campo vuoto, immettere Mashup cliente e premere il tasto Invio sulla tastiera. 4. Nella tavolozza, fare clic sull icona salva per salvare la nuova pagina. Ora è stata creata una nuova pagina denominata Mashup cliente ed è al momento selezionata nel selettore di pagina. Checkpoint della lezione In questa lezione, si è appresa la procedura di utilizzo del programma di creazione mashup per creare e salvare una pagina per il mashup. Lezione 2: Aggiunta del widget Google Gadget al programma di creazione mashup In questa lezione, si scaricherà il file WAR del widget Google Gadget sulla macchina locale, lo si memorizzerà nel catalogo e lo si aggiungerà alla tavolozza di widget nel programma di creazione di mashup. Prima di iniziare con le fasi richieste per completare questa lezione, si consiglia di guardare la seguente demo. La demo è stata progettata per mostrare le fasi in azione prima che l utente tenti da solo. Per ignorare la demo e passare alla versione testo di questa lezione, scorrere fino alla sezione Procedura sotto il frame della demo. Demo: aggiunta del widget Google Gadget al programma di creazione di mashup Nota: Il widget Google Gadget si trova anche nel catalogo Lotus Greenhouse. Tale catalogo esterno è stato reso disponibile per consentire l accesso a campioni di widget, widget di terze parti e altri widget da condividere e di cui si desidera un feedback prima dell integrazione di tali widget in versioni future del prodotto. Il mashup finale conterrà widget collegati per la comunicazione. Il widget Google Gadget è l unico non disponibile nella tavolozza predefinita fornita da IBM Mashup Center. In questa lezione, il widget verrà aggiunto manualmente alla tavolozza. Per aggiungere il widget Google Gadget alla tavolozza, procedere nel modo seguente: Capitolo 4. Modulo B: creazione e preparazione della pagina 17

22 1. Scaricare il pacchetto WAR Google Gadget ibmdl/pub/software/dw/lotus/mashups/introtutorial20/ googlegadgetwidget.war sulla macchina locale. Prendere nota dell ubicazione di salvataggio. 2. Procedere con le seguenti fasi per caricare il widget Google Gadget nel catalogo : a. Per aprire il catalogo, aprire il menu azioni principale nella tavolozza e selezionare Apri catalogo in una finestra di dialogo. Se si preferisce aprire il catalogo in un browser a parte, selezionare Apri catalogo come nuova pagina oppure fare clic sull icona catalogo. b. Nel catalogo, fare clic su Carica Carica widget. c. Nella finestra Selezionare l origine del tipo di widget, selezionare Pacchetto iwidget (.war) e fare clic su Avanti. d. Nella finestra Carica un pacchetto iwidget, nel campo Percorso file pacchetto widget, accedere all ubicazione in cui è stato scaricato il file googlegadgetwidget.war e fare clic su Apri. Quindi fare clic su Avanti. e. Nella finestra Specificare le seguenti informazioni, nel campo Titolo, immettere Google Gadget. Lasciare il valore 1.0 nel campo Versione e modificare gli altri campi in base alle preferenze. f. Fare clic su Fine. A questo punto, viene visualizzato un messaggio che indica che il widget è stato salvato correttamente nel catalogo. 3. Per aggiungere il widget Google Gadget alla tavolozza di widget nel programma di creazione mashup, procedere nel modo seguente: a. Rimanendo nella finestra della fase precedente, nella sezione Novità, fare clic su Visualizza dettagli widget. A questo punto, viene visualizzata una finestra che fornisce i dettagli del widget, ad esempio, l URL di origine nel catalogo, le autorizzazioni di accesso e altro. b. Sul lato destro della finestra, fare clic su Aggiungi a programma di creazione mashup. c. Nella finestra Aggiungi a programma di creazione mashup, selezionare Preferiti come categoria di tavolozza e fare clic su Fine. Viene visualizzato un messaggio indicante che il widget è stato aggiunto correttamente al programma di creazione di mashup. 4. Per confermare l aggiunta corretta del widget al programma di creazione mashup, tornare a tale programma e aggiornare la pagina. In modalità Modifica, aprire la categoria Preferiti nella tavolozza e individuare il widget Google Gadget. Checkpoint della lezione In questa lezione, è stato scaricato il pacchetto WAR Google Gadget sulla macchina locale, tale pacchetto è stato memorizzato nel catalogo e successivamente è stato aggiunto alla tavolozza di widget nel programma di creazione mashup. A questo punto, è possibile configurarlo con un gadget di grafico azionario, in un secondo momento, in questo modulo. Lezione 3: aggiunta di widget alla pagina In questa lezione, verranno aggiunti cinque widget dalla tavolozza alla pagina. Tali widget verranno utilizzati per comporre il mashup. 18 Introduzione alla creazione di mashup tramite IBM Mashup Center

23 In questa lezione, verrà aggiunto il widget Navteq Map nella pagina. Per utilizzare questo widget, potrebbe essere necessario richiedere una licenza all amministratore. Se il widget non è configurato con una licenza, non sarà abilitato e non sarà possibile configurarlo e collegarlo. Chiedere all amministratore di consultare il seguente argomento nel wiki Mashup Center: Abilitazione del widget Navteq Map per gli utenti. 1. Aprire la categoria Preferiti nella tavolozza. 2. Utilizzare il cursore per trascinare il widget Scala del tempo nella pagina mashup. 3. Ripetere la fase precedente con i widget Google Gadget, Grafico, Visualizzatore dati e Navteq Map. Accertarsi di trascinare ciascun widget in uno spazio nella pagina mashup. In base alla dimensione dello schermo, potrebbe essere necessario utilizzare il cursore per spostare i widget nella pagina o per ridimensionarli. Potrebbe essere necessario anche regolare la larghezza della pagina. Per ulteriori informazioni, vedere Regolazione della larghezza delle pagine. 4. Fare clic sull icona di salvataggio nella tavolozza per salvare la pagina. Checkpoint della lezione In questa lezione si è appreso come aggiungere i widget dalla tavolozza alla propria pagina. Lezione 4: Configurazione del widget Google Gadget con un gadget di grafico azionario In questa lezione, si configurerà il widget Google Gadget con un gadget di grafico azionario. 1. Passare con il cursore sul widget Google Gadget e fare clic sull icona del menu di configurazione in alto nel frame. 2. Selezionare Modifica impostazioni per aprire la finestra di configurazione. 3. Nel campo di ricerca, immettere grafico azionario e fare clic su Ricerca gadget. Nei risultati della ricerca vengono visualizzati numerosi gadget. 4. Individuare il gadget Grafici azionari standard e fare clic su Seleziona, come mostrato nella seguente immagine: Capitolo 4. Modulo B: creazione e preparazione della pagina 19

24 5. Nella finestra di configurazione per il gadget, selezionare 1 anno come valore di durata e fare clic su Salva. A questo punto, il gadget di grafico azionario viene visualizzato all interno del frame Google Gadget nella pagina, come mostrato nella seguente immagine: 6. Fare clic sull icona di salvataggio nella tavolozza per salvare la pagina. 20 Introduzione alla creazione di mashup tramite IBM Mashup Center

25 Checkpoint della lezione In questa lezione, è stato configurato il widget Google Gadget per visualizzare un gadget di grafico azionario. A questo punto, è possibile passare al modulo successivo per continuare a costruire le parti del mashup. Modulo B: Riepilogo Nel Modulo B, si è appresa la procedura di preparazione del programma di creazione mashup per il progetto mashup. È stata creata una pagina, sono stati trascinati i widget dalla tavolozza alla pagina ed è stato scaricato e configurato un altro widget non incluso nella tavolozza predefinita. A questo punto, è possibile iniziare a configurare la pagina con informazioni sul cliente. Lezioni apprese Completando questo modulo, sono stati raggiunti i seguenti obiettivi: v Apprendere la procedura di creazione di una pagina v Apprendere la procedura di trascinamento e assemblamento dei widget in una pagina v Apprendere la procedura di caricamento di un file WAR del widget nel catalogo e di successiva aggiunta del widget alla tavolozza v Apprendere la procedura di configurazione di un widget che estrae i dati dal Web Risorse aggiuntive Utilizzare le seguenti risorse per ulteriori informazioni su Mashup Center: v Utilizzo di temi e skin v Condivisione di pagine con altri v Regolazione della larghezza delle pagine v Utilizzo di widget v Visualizzatore dati v Grafico v Scala del tempo v Sito Web Google gadget v Mappa Navteq Capitolo 4. Modulo B: creazione e preparazione della pagina 21

26 22 Introduzione alla creazione di mashup tramite IBM Mashup Center

27 Capitolo 5. Modulo C: aggiunta delle informazioni sul cliente alla pagina In questo modulo, verrà creato un feed da un foglio di calcolo contenente le informazioni sul cliente e poi si configurerà il widget Visualizzatore dati per visualizzare il contenuto del feed in una tabella. Verranno filtrate inoltre alcune parti di contenuto di feed dalla vista tabella e si modificherà l aspetto della tabella stessa. Nel Modulo B, è stata creata la pagina e sono stati aggiunti i cinque widget che costituiranno il mashup. Una volta configurati e collegati tutti e cinque i widget, si otterrà un mashup completamente funzionante che fornisce ad un addetto alle vendite una vista rapida di dati del cliente, ad esempio informazioni sulle azioni, una vista con scala del tempo di ordini dei clienti, una mappa che visualizza la località dell azienda e un grafico che mostra dati sulle vendite pipeline per il cliente. In questo modulo, si inizierà scaricando un foglio di calcolo campione di informazioni sul cliente. In qualità di addetto alle vendite, questo foglio di calcolo è stato creato per memorizzare tutte le informazioni importanti di contatto sui propri clienti, inclusi nome, indirizzo, codice postale e altri dati importanti. A questo punto, è necessario aggiungere questo contenuto alla propria pagina per poter selezionare il nome di un cliente e ottenere una vista rapida di informazioni su tale cliente in una singola interfaccia. Per poter visualizzare il contenuto dal foglio di calcolo, sarà necessario creare un feed dal foglio di calcolo. Successivamente, si configurerà il widget Visualizzatore dati per visualizzare il contenuto del feed in una tabella. Una volta collegati tutti i widget insieme, nel prosieguo di questa esercitazione sarà possibile fare clic sui nomi cliente nella tabella e inviare eventi agli altri widget nella pagina in modo da aggiornarli e visualizzare informazioni correlate a tale cliente. Informazioni sui feed Quando si creano i mashup per risolvere le situazioni quotidiane che sorgono nel proprio ambiente lavorativo, con molta probabilità è necessario utilizzare i dati di reparto nei fogli di calcolo e in altre origini dati. Ma come fare per ottenere i dati in un formato che sia possibile utilizzare nei mashup? In altre parole, come rendere tali dati combinabili? Fortunatamente, Mashup Center rende tale processo estremamente semplice. È sufficiente convertire i dati in un feed. Tale conversione riformatta i dati in una serie di voci basata su XML che consente ad altri widget di analizzare, formattare e visualizzare i dati. Senza tale fase, i dati nel foglio di calcolo non sono combinabili e non possono comunicare con altri widget. Per ulteriori informazioni, vedere Feed. Nota: quando si crea il proprio feed, si noterà che Mashup Center distingue tra dati aziendali e dati di reparto. I dati aziendali generalmente provengono da origini gestite dall IT, a livello aziendale, come database, server e servizi Web. I dati di reparto generalmente provengono da origini personali, più specifiche dell organizzazione, ad esempio fogli di calcolo e documenti XML. In questa esercitazione si utilizzeranno i dati di reparto. 23