Esposizione RIA
19
SVILUPPO DI UNA APPLICAZIONE WEB CON TECNOLOGIE RIA UNIVERSITA DEGLI STUDI DI PAVIA - sede di Mantova FACOLTA DI INGEGNERIA MAZZANTI LUCA
Transcript of Esposizione RIA
SVILUPPO DI UNA APPLICAZIONE WEB
CON TECNOLOGIE RIA
UNIVERSITA DEGLI STUDI DI PAVIA - sede di Mantova
FACOLTA DI INGEGNERIA
MAZZANTI LUCA
Web 2.0 il Progetto
Cos’è il Web 2.0Le RIATecnologie di
sviluppo Ajax Wicket
Il ProdottoAnalisi Sviluppo
Road Map
Web 2.0
Un insieme di principi e di procedure attorno alle quali gravitano alcuni siti che dimostrano questa novità.
Rich Internet Applications Social Network
Vuole informare che il Web è maturato, e dispone di tecnologie che permettono un nuovo approccio, un interazione bidirezionale tra utente ed il servizio offerto.Tra le varie sfaccettature di questo fenomeno abbiamo:
Rich Internet Applications
Le Rich Internet Applications sono applicazioni web che possiedono le caratteristiche e le funzionalità delle tradizionali applicazioni per computer, senza però necessitare dell'installazione sul disco fisso.
Il Web come piattaforma significa poter utilizzare Internet e il Web stesso per realizzare vere e proprie applicazioni software.
Sfruttare i processi e le infrastrutture esistenti.
Distribuzione e ubiquità di lavoroComponenti e piattaforma
AJAX: Asynchronous JavaScript and XML
La tecnica Ajax utilizza una combinazione di:
HTML e CSS per il markup e lo stile. DOM manipolato attraverso JavaScript per l’interazione. XML come formato di scambio dei dati. l'oggetto XMLHttpRequest per l'interscambio asincrono
dei dati tra il browser dell'utente e il web server.
AJAX è asincrono nel senso che i dati extra sono richiesti al server e caricati in background senza interferire con il comportamento della pagina esistente.
Si basa su uno scambio di dati in background fra web browser e server, che consente l'aggiornamento dinamico di una pagina web
Wicket
Wicket è un component-based web application framework scritto in Java.
Le funzionalità di punta di questo framework sono elencate di seguito:
Separazione dei contenutiNon viene mescolato codice HTML e codice Java, e non viene aggiunta sintassi speciale ai file HTML.
ComponentiOgni componente è rappresentato da una classe Java, molto simile a framework di costruzione delle GUI lato desktop come Swing o SWT.
Gestione della SessioneWicket invece gestisce automaticamente lo stato delle pagine, in maniera trasparente .
Toolkit AJAXContiene un Ajax Engine proprietario e i componenti si interfacciano ad esso.
Wicket cerca di semplificare il difficoltoso incontro tra il protocollo HTTP stateless ed il lato server side di programmazione Java.
Sviluppare in Wicket
E’ possibile progettare componenti secondo i costrutti Java.
La parte di vista è affidata a dei templates HTML.
<html><head/><body>
<a wicket:id=“link”/>
<span wicket:id=“label”>Ho cliccato x volte</span>
</body></html>
public class LinkCounter extends WebPage {
public LinkCounter() { add(new AjaxFallbackLink("link") {@Overridepublic void onClick(AjaxRequestTarget
target) {counter++;
target.addComponent(label);}
}); add(new Label("label", new
PropertyModel(this, "counter")));
CODE VIEW
1
4
3
2
6
5
Suite Easy
SpareCat
Permette di creare, pubblicare e mantenere aggiornati in maniera semplice ed efficace cataloghi illustrati di parti di ricambio di prodotti.
Associare:
oi dati economici e tecnici provenienti da sistemi ERP
ole tavole da un sistema CAD per creare delle referenze alle righe delle tabelle della distinta base di prodotto
GESTIONALE AZIENDALEGESTIONALE AZIENDALE
RIGHE RIGHE ORDINE / PREVENTIVAZIONEORDINE / PREVENTIVAZIONE
GESTIONALE AZIENDALEGESTIONALE AZIENDALEEXCEL, ASCII ….EXCEL, ASCII ….
DISEGNI DISEGNI ESPLOSIESPLOSI
GESTIONE DISTINTEGESTIONE DISTINTE
AUTHORING AUTHORING CATALOGOCATALOGO
PUBBLICAZIONEPUBBLICAZIONE
DISTINTA RICAMBI
DISTINTA RICAMBIDISTINTA PRODOTTI
DISTINTA FORNITORI
INTERNETINTERNET
EASY SPARECATEASY SPARECAT
Il Progetto: Easy Sparecat Web Viewer
Navigazione dei cataloghi
Ricerca delle spare partsAcquisto degli articoli
Visualizzazione degli esplosi
Distinta associata
Analisi
Dei requisitiDelle tecnologie
Prototipo
Dei rischi
L’applicazione richiedeva particolari funzionalità e fasi, suddivise all’incirca in queste:
Visualizzare un immagine vettoriale e renderne sensibili i callout ad eventi interni/esterni.
Creare un interfaccia il più vicino possibile alle RIA per accrescere l’esperienza dell’utente.
Avere particolari personalizzazioni
Riscrivere le vecchie funzionalità dell’applicativo precedente sulla chiave delle nuove librerie.
Sicurezza. Localizzazione,…
AnalisiDei requisiti
Delle tecnologiePrototipo
Dei rischi
FLEX AJAX JSFPesantezza d’esecuzione
Tool di sviluppo
Rich Experience
Facilità costruzione Interfacce Utente Dipende dal
toolkit
Comunicazione con middle tier REST da
implementare
Possibilità integrazione Tavola Svg
Analisi
Dei requisiti
Delle tecnologie
PrototipoDei rischi
Viene effettuata la stesura di un prototipo, contenente alcune delle principali funzioni che dovrà avere il prodotto finale:
la visualizzazione della tavola con sensibilizzazione degli hotspot
la comunicazione tra componente rappresentante la tavola e la pagina contenente i dati
recupero dei dati dal business tier e rappresentazione di essi in un albero
gestione degli oggetti in sessione
Analisi
Dei requisiti
Delle tecnologie
Prototipo
Dei rischi
Sviluppare in Flex comporterebbe l’introduzione di una parte critica al progetto, non controllabile né prevedibile in tempo e in riuscita.
La decisione quindi è quella di attuare la visualizzazione dell’immagine vettoriale tramite un Applet java scritta utilizzando delle librerie già conosciute, e sviluppare l’interfaccia visuale in AJAX. Sono a disposizione dei programmatori vari Toolkits di sviluppo Ajax: alcuni offrono librerie Javascript, altri aggiungono a queste la possibilità di utilizzarle tramite un linguaggio secondario, tra quelli lato server.
Navigazione
Per ogni elemento vi è un pannello di
info.
TavolaPa
nnel
lo d
ella
tavo
la
Pann
ello
del
le
part
i di r
icam
bio
Sensibilizzazione Pallinatura
Carrello
Personalizzazioni
Personalizzazione user-friendly dell’aspetto grafico
Personalizzazioni
Interfacciamento al portale ed al gestionale aziendale
Personalizzazioni
Gestione delle utenze e di cosa possono vedere Filtro di visualizzazione dei Cataloghi Filtro di visualizzazione degli attributi degli
elementi
Conclusioni
Utilizzare sapientemente uno strumento adeguato può comportare delle migliorie non indifferenti sia nel prodotto che nella gestione del progetto nel tempo.
Essere “early mover” nell’approccio alle tecnologie Spostare lo sviluppo verso il Web (maggiore
distribuzione)
Ringrazio Prosolvia-tech per aver dato spazio all’analisi, ad una scelta ed alla concretizzazione del progetto.
