Elements web component library <ul><li>[email_address] </li></ul><ul><li>[email_address] </li></ul><ul><ul><li>www.manydes...
ManyDesigns Elements <ul><li>Cos'è e dove utilizzare Elements </li></ul><ul><li>Impostazione di un progetto. </li></ul><ul...
ManyDesigns Elements <ul><li>Elements è una libreria open source di componenti web integrabile in altri  Java web framewor...
Elements Elements Componente Componente Componente Java Beans DB Objects (Hibernate, iBatis) Portofino Altro (EJB, WS) Htt...
Esempio: componente per Google Maps
Esempio: questionario interattivo multipagina
Esempio ...Elements in Portofino 3.0
Demo <ul><li>Creiamo una semplice applicazione che porti sul web un modulo cartaceo di richiesta abbonamento. </li></ul><u...
Passi illustrati nella Demo <ul><li>STEP 1. Base: 1 Classe di Modello, 1 Componente, 1 pagine JSP per la view </li></ul><u...
Dipendenze nel pom.xml <ul><li>Elements, componenti core di Elements (123 k) </li></ul><ul><li>Elements-extras, componenti...
web.xml <ul><li><?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> </li></ul><ul><li><web-app xmlns=&quot;http://j...
Iniziare un progetto con Elements <ul><li>Realizzare il modello </li></ul><ul><li>Creare i componenti atomici di Elements ...
Annotation sul Modello <ul><li>Le annotation sono utilizzate per apporre metadati significativi per Elements alle proprie ...
Un componente Element <ul><li>Sa dare una propria rappresentazione in xhtml </li></ul><ul><li>Ha un “mode” associato </li>...
Interfaccia Element <ul><li>public interface Element extends XhtmlFragment { </li></ul><ul><li>public void  readFromReques...
I Builder <ul><li>In generale i builder permettono di creare componenti (Elements) a partire da configurazioni e parametri...
Gli elementi composti <ul><li>Viene utilizzato il design pattern ”Composite”: il componente estende un ArrayList di Elemen...
Classificazione dei field‏
Feature di elements <ul><li>Mappatura di tutti i componenti xhtml </li></ul><ul><li>Validazione dei campi </li></ul><ul><l...
Sviluppi <ul><li>Integrazione </li></ul><ul><ul><li>Utilizzarlo in altri web framework </li></ul></ul><ul><ul><li>Integrar...
Upcoming SlideShare
Loading in …5
×

Many Designs Elements

1,166 views
1,067 views

Published on

Genova JUG Meeting, 02/02/2010.
Elements is an open source library of web UI components for high productivity in small to large projects.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,166
On SlideShare
0
From Embeds
0
Number of Embeds
559
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Many Designs Elements

  1. 1. Elements web component library <ul><li>[email_address] </li></ul><ul><li>[email_address] </li></ul><ul><ul><li>www.manydesigns.com </li></ul></ul>ManyDesigns
  2. 2. ManyDesigns Elements <ul><li>Cos'è e dove utilizzare Elements </li></ul><ul><li>Impostazione di un progetto. </li></ul><ul><li>Demo: Dal modulo cartaceo al web in 15 min. </li></ul><ul><li>I principali componenti in elements </li></ul><ul><li>Sviluppi </li></ul>
  3. 3. ManyDesigns Elements <ul><li>Elements è una libreria open source di componenti web integrabile in altri Java web framework. </li></ul><ul><li>Elements astrae il layer di presentazione e si occupa di interagire con le richieste HTTP e gli oggetti della Business Logic indipendentemente dalle tecnologie utilizzate. </li></ul><ul><li>Facilita il riuso e lo sviluppo di propri componenti (atomici o composti) </li></ul>
  4. 4. Elements Elements Componente Componente Componente Java Beans DB Objects (Hibernate, iBatis) Portofino Altro (EJB, WS) Http Request Http Response Model Controller View DB ...
  5. 5. Esempio: componente per Google Maps
  6. 6. Esempio: questionario interattivo multipagina
  7. 7. Esempio ...Elements in Portofino 3.0
  8. 8. Demo <ul><li>Creiamo una semplice applicazione che porti sul web un modulo cartaceo di richiesta abbonamento. </li></ul><ul><li>Per fare questo realizzeremo una semplice applicazione Java con servlet e jsp (ma alternativamente avremmo potuto usare un web framework quale Struts) </li></ul>
  9. 9. Passi illustrati nella Demo <ul><li>STEP 1. Base: 1 Classe di Modello, 1 Componente, 1 pagine JSP per la view </li></ul><ul><li>STEP 2. Sottoinsieme field di una class per componenti e prefix: 3 Classi di Modello, 4 Componenti, 1 pagine JSP </li></ul><ul><li>STEP 3. Introduzione annotazioni: 3 Classi di Modello, 4 Componenti, 2 pagine JSP (invio e validate) </li></ul><ul><li>STEP 4. Elementi Composti “Sequence”: 3 Classi di Modello, 1+4 Componenti, 2 pagine JSP </li></ul><ul><li>STEP 5. Elementi Composti “Wizard”: 3 Classi di Modello, 1+4 Componenti, 2 pagine JSP </li></ul>
  10. 10. Dipendenze nel pom.xml <ul><li>Elements, componenti core di Elements (123 k) </li></ul><ul><li>Elements-extras, componenti aggiuntivi (65 k) </li></ul><ul><li>Apache commons lang (261 k) </li></ul>
  11. 11. web.xml <ul><li><?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> </li></ul><ul><li><web-app xmlns=&quot;http://java.sun.com/xml/ns/j2ee&quot; </li></ul><ul><li>xmlns:xsi=&quot;http://www.w3.org/2001/XMLSchema-instance&quot; </li></ul><ul><li>xsi:schemaLocation=&quot;http://java.sun.com/xml/ns/j2ee </li></ul><ul><li>http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd&quot; </li></ul><ul><li>version=&quot;2.4&quot;> </li></ul><ul><li><display-name>My Web App</display-name> </li></ul><ul><li><filter> </li></ul><ul><li><filter-name> elementsFilter </filter-name> </li></ul><ul><li><filter-class> </li></ul><ul><li>com.manydesigns.elements.servlet.ElementsFilter </li></ul><ul><li></filter-class> </li></ul><ul><li></filter> </li></ul><ul><li><filter-mapping> </li></ul><ul><li><filter-name> elementsFilter </filter-name> </li></ul><ul><li><url-pattern> /* </url-pattern> </li></ul><ul><li></filter-mapping> </li></ul><ul><li>... </li></ul><ul><li></web-app> </li></ul>
  12. 12. Iniziare un progetto con Elements <ul><li>Realizzare il modello </li></ul><ul><li>Creare i componenti atomici di Elements interrogando la struttura del modello </li></ul><ul><li>Comporre i componenti atomici in componenti composti </li></ul><ul><li>Visualizzare I componenti </li></ul>
  13. 13. Annotation sul Modello <ul><li>Le annotation sono utilizzate per apporre metadati significativi per Elements alle proprie classi Java. </li></ul><ul><li>Molte informazioni sono dedotte dalla reflection della classe ma ulteriori possono essere aggiunte per personalizzare il comportamento di un componente (come la label, l'help, ecc...). </li></ul>
  14. 14. Un componente Element <ul><li>Sa dare una propria rappresentazione in xhtml </li></ul><ul><li>Ha un “mode” associato </li></ul><ul><li>Sa aggiornare I suoi dati leggendoli da una richiesta Http o da un Java “Object” </li></ul><ul><li>Sa validare i suoi dati </li></ul><ul><li>Sa scrivere rendere persistenti I suoi dati su un Object </li></ul>
  15. 15. Interfaccia Element <ul><li>public interface Element extends XhtmlFragment { </li></ul><ul><li>public void readFromRequest </li></ul><ul><li>(HttpServletRequest req); </li></ul><ul><li>public boolean validate(); </li></ul><ul><li>public void readFromObject(Object obj); </li></ul><ul><li>public void writeToObject(Object obj); </li></ul><ul><li>public Mode getMode(); </li></ul><ul><li>public void setMode(Mode mode); </li></ul><ul><li>} </li></ul>
  16. 16. I Builder <ul><li>In generale i builder permettono di creare componenti (Elements) a partire da configurazioni e parametri forniti. Sono dei “costruttori” più flessibili. </li></ul><ul><li>E’ presente la classe ClassFormBuilder, che costruisce un form html a partire da una classe Java tramite reflection e lettura delle annotations. </li></ul>
  17. 17. Gli elementi composti <ul><li>Viene utilizzato il design pattern ”Composite”: il componente estende un ArrayList di Element e, al contempo, implementa Element. </li></ul><ul><li>La renderizzazione in xhtml e la lettura/scrittura sul proprio oggetto viene delegata ai figli (elementi atomici). </li></ul><ul><li>Tramite gli elementi composti sono create Sequenze di componenti, Selection o Wizard multipagina </li></ul>
  18. 18. Classificazione dei field‏
  19. 19. Feature di elements <ul><li>Mappatura di tutti i componenti xhtml </li></ul><ul><li>Validazione dei campi </li></ul><ul><li>TagLibrary per Struts </li></ul><ul><li>Generazione di xhtml well formed </li></ul><ul><li>Modalità per la visione del componente (edit, view, preview, hidden) </li></ul><ul><li>Internazionalizzazione </li></ul>
  20. 20. Sviluppi <ul><li>Integrazione </li></ul><ul><ul><li>Utilizzarlo in altri web framework </li></ul></ul><ul><ul><li>Integrarlo con framework di persistenza, web services, altri sistemi “esterni” </li></ul></ul><ul><li>Personalizzazioni </li></ul><ul><ul><li>Creazione di nuovi componenti atomici o composti di uso generale </li></ul></ul><ul><ul><li>Creazione di librerie di componenti di uso comune </li></ul></ul><ul><li>Altro??? </li></ul>

×