Da un po’ di tempo si parla di framework che permettono di creare interfacce grafiche partendo dal proprio modello dei dati o da una sua rappresentazione. Il termine scaffolding indica proprio questo: generare codice (che di solito permette di eseguire operazioni CRUD su entità) con un tool automatico invece di scriverlo a mano. Lo scaffolding è stato reso popolare da Ruby On Rails ed è attualmente presente in molti framework in diversi linguaggi di programmazione, per esempio è supportato da Django in Python, CakePhp e Symfony in php e Grails in Groovy. Ovviamente esiste qualcosa anche in Java: un esempio è Spring Roo e un altro che vedremo in dettaglio in questo articolo è OpenXava.

Il sito ufficiale di OpenXava definisce questo progetto un AJAX Java Framework for Rapid Development of Enterprise Applications. L’enfasi è soprattutto su due parole: AJAX e Rapid. Infatti le interfacce web create con OpenXava sfruttano tecnologie AJAX dietro le quinte per avere una interfaccia veloce da utilizzare. Il perché venga usato anche il termine Rapid lo vedremo nel corso di questo post, buona lettura!

View generate runtime Vs code generation

L’idea dietro OpenXava non è quella della creazione di codice ma bensì quella di generare runtime delle interfacce web partendo dal modello dei dati. Ovviamente ci sono sia dei pro che dei contro nei due approcci, sicuramente uno dei vantaggi dell’utilizzo di OpenXava è quello che il codice da manutenere è veramente poco. Inoltre è un approccio molto pulito e non ci sono i classici problemi del codice generato: la domanda se modifico il codice generato e poi lo rigenero perdo le mie modifiche? con OpenXava non la sentirete mai.

Fino ad adesso abbiamo parlato di modello dei dati, ma da cosa parte OpenXava per creare le pagine web? La risposta a questa domanda è secondo me uno dei punti di forza di OpenXava: tutto parte dalle entità JPA annotate. Questo approccio permette di ridurre lo sviluppo di una web app (o almeno delle più semplici) nella progettazione delle entity JPA. Partendo da questo è possibile generare il database (anche OpenXava mette a disposizione un build di ant per fare questo) e autogenerare le pagine web. Semplice, no?

OpenXava in azione

Ma che interfacce web crea OpenXava? Un esempio vale più di mille parole, vediamolo all’opera con una anagrafica dei comuni italiani.

Se osservate per bene l’immagine potete riconoscere le innumerevoli feature presenti in questa lista:

• paginazione dei dati
• combo per numero di righe per pagina
• numero totale di righe
• ordinamento dei dati cliccando sull’header di una colonna
• filtro dei dati con scelta dell’operatore di filtro
• resize delle colonne
• ordinamento e scelta delle colonne
• selezione multipla per applicazione azioni (per esempio la cancellazione) su più righe
• esportazione dei dati in excel e pdf

Non sono feature innovative ma personalmente per averle in una pagina ho sempre dovuto sudare parecchio!

Cliccando su una riga si passa al dettaglio corrispondente, nel caso di una città per esempio abbiamo questa pagina web:

Anche in questo caso le feature sono quelle che un utente si aspetta: i dati sono raggruppati (anche usando tab), c’è la validazione e la possibilità di scegliere le entità collegate usando una ricerca (per esempio in questo caso la provincia di un comune). Potete vedere altri esempi di utilizzo nella pagina delle demo del sito ufficiale. Ma basta chiacchiere, è arrivato il momento di vedere un po’ di codice nei dettagli!

Creazione di un progetto in Eclipse con OpenXava

La prima cosa da fare per iniziare a usare OpenXava è scaricare lo zip contenente tutto il necessario per utilizzare questo framework, basta andare sul sito ufficiale openxava.org e cliccare sul pulsante per effettuare il download. Una volta scompattato lo zip vediamo che contiene anche uno workspace di Eclipse con i sorgenti del framework e un tomcat già configurato. Apriamo quindi Eclipse scegliendo la directory del workspace appena scaricato. Occhio alle impostazioni del workspace, in particolare il build automatico è disabilitato, riabilitatelo subito e non fate come qualcuno che se n’è accorto dopo un’ora di comportamenti inspiegabili! 🙂

Il workspace contiene i sorgenti di tutto il framework e alcuni esempi. Per creare un nuovo progetto basta creare un progetto Java standard dentro Eclipse, non è necessario creare niente di particolare. Una volta creato il progetto può essere trasformato in un progetto OpenXava grazie a un build di ant, contenuto in un file chiamato CreateNewProject.xml dentro il progetto OpenXavaTemplate. Per sicurezza facciamo un refresh del progetto dentro Eclipse e siamo pronti per partire!

Il punto di partenza: tre entity JPA

Come già detto tutto inizia da alcune entity JPA, creiamo quelle del nostro esempio. Con molta fantasia creiamo tre entity che sono presenti in molte web app italiane: Region, District e City. La prima e più semplice da creare è Region:

@Entity
@Table(name = "regions")
public class Region implements Serializable {

        @Id
        @GeneratedValue(strategy = GenerationType.IDENTITY)
        private int id;

        @Column(nullable = false)
        @Required
        private String name;

        //getter e setter...
}

Possiamo notare che abbiamo usato solo annotation JPA standard, le classiche Entity, Table e Column e un altro paio di annotation per creare una primary key autoincrementante e rendere alcuni campi obbligatori. La seconda entità che vediamo è quella che modella le province:

@Entity
@Table(name = "districts")
public class District implements Serializable {

        @Id
        @GeneratedValue(strategy = GenerationType.IDENTITY)
        private int id;

        @Column(nullable = false)
        @Required
        private String name;

        @ManyToOne(fetch = FetchType.LAZY)
        @JoinColumn(name = "region_id")
        @Required
        private Region region;

        @Column(length = 2, nullable = false)
        @Required
        private String code;

        private Integer lat;

        private Integer lon;

        //getter e setter...
}

Anche qui niente di particolare, da notare la relazione ManyToOne verso le regioni. L’ultima entità da vedere è quella delle città:

@Entity
@Table(name = "cities")
public class City implements Serializable {

        @Id
        @GeneratedValue(strategy = GenerationType.IDENTITY)
        private int id;

        @Column(length = 5, nullable = false)
        @Required
        private String cap;

        @Column(nullable = false)
        @Required
        private String name;

        @ManyToOne(fetch = FetchType.LAZY, optional = false)
        @JoinColumn(name = "district_id")
        @Required
        private District district;

        private Integer lat;

        private Integer lon;

        private boolean capital;

        //getter e setter...
}

Vi risparmio le discussioni sul fatto che il cap sia una stringa e non un intero, lo so che da buoni informatici almeno una volta avete avuto questo dubbio! 🙂

Abbiamo tutte le entità, dobbiamo censirle nel file persistence.xml del nostro progetto. Creiamo due persistence unit, una da usare nel Tomcat che punta a un datasource e l’altra nei test e nella generazione delle tabelle con la configurazione per accedere al db. In questo esempio ho usato un db MySql ma ovviamente potete usare un qualunque db supportato da JPA (quindi praticamente tutti i db relazionali):

        org.hibernate.ejb.HibernatePersistence
        java:comp/env/jdbc/cnjDS
        it.cosenonjaviste.openxava.City
        it.cosenonjaviste.openxava.District
        it.cosenonjaviste.openxava.Region
        
                
                
        



        org.hibernate.ejb.HibernatePersistence
        it.cosenonjaviste.openxava.City
        it.cosenonjaviste.openxava.District
        it.cosenonjaviste.openxava.Region
        
                
                
                
                
                
                
        

Nella view Servers di Eclipse aggiungiamo un server Tomcat, possiamo usare quello presente nello zip che abbiamo scaricato dal sito di OpenXava. A questo punto possiamo creare il datasource: basta modificare il file context.xml, lo trovate nel progetto Servers creato in automatico da Eclipse quando si aggiunge un server Tomcat. Ecco il frammento di xml da aggiungere:

Per far funzionare il tutto abbiamo bisogno del driver del nostro db, aggiungiamolo nella cartella lib del Tomcat.

Generazione delle tabelle su database

Una delle feature più affascinanti di JPA è la generazione delle tabelle su database partendo dalle entity (non fate questo discorso al vostro dba, potrebbe non essere molto d’accordo! 🙂 ). Per generare le tabelle possiamo usare il target updateSchema, lo possiamo trovare nel build di ant all’interno del nostro progetto (per la precisione è un build di ant generato da un build di ant!). Su MySql è necessario creare a mano lo schema in quanto lo schema è presente nell’url della connessione al db e deve quindi esistere già prima di iniziare. Anche in questo caso il driver per accedere al db deve essere presente nel classpath, va aggiungo a mano nelle preferenze di Eclipse relative al classpath di ant.

Ed eccoci al risultato finale…

Fino ad adesso abbiamo creato tre entity JPA standard e abbiamo configurato tutto a dovere. In pratica abbiamo creato la parte di model in un framework MVC, sviluppando una web app Java adesso sarebbe il momento di creare tutta la parte di view. Ma invece di scrivere altro codice facciamo partire il Tomcat e apriamo un browser all’url dove CoseNonJaviste è il nome del progetto che abbiamo creato e City è il nome dell’entità che vogliamo editare. Quello che possiamo vedere nel browser è questo:

Cliccando su una riga della tabella possiamo editare il dettaglio:

OpenXava ha generato queste pagine web interamente runtime leggendo le annotation standard JPA. Ovviamente non può leggere nel pensiero dello sviluppatore e quindi la grafica è standard e sono mostrati tutti i campi dell’entità. Nel dettaglio (e non nella lista) sono mostrati anche i campi delle entità collegate lette usando sempre le relazioni JPA. E’ presente anche un minimo di validazione sui campi obbligatori e sulla lunghezza dei campi.

Conclusioni

Per adesso non abbiamo scritto una singola riga di codice legata ad OpenXava, tutto il codice scritto può essere tranquillamente usato anche in web app create con altri framework. Per arrivare all’esempio visto all’inizio di questo post c’è ancora un po’ (in realtà poco) da lavorare, ma questo sarà l’argomento del prossimo post.

OpenXava contiene molte feature che ancora non abbiamo visto (per esempio editor e validazione può essere customizzata ed è possibile inserire azioni aggiuntive). Se Volete approfondire l’argomento potete dare un’occhiata alla documentazione ufficiale o al libro scritto direttamente da Javier Paniza, il project leader di OpenXava.