SG at CTU
3
3sg.czacm.org
Cerny T., Chalupa V., Rychtecky L., Linhart T.
[email protected] www.jformbuilder.org
Vývoj enterprise aplikací Struktura aplikace Problémy s údržbou i tvořením GUI Závislosti 3 vrstev (coupling) Opakování informace a replikace rozhodnutí
Generátory UI Automatizace skrze inspekci JFormBuilder (JFB) Co, kde, kdy, jak a proč Online tutoriál JFB
Za hranice Javy MDD, XLS, XML, Aneb přátelství analytika a vývojáře
Budoucí vize
Běžná aplikace je rozdělena na vrstvy To umožní oddělení zájmů ▪ Prezentace - JSF, Facelets, RichFaces.. ▪ EJB, (Spring) ▪ JPA - entity
Entita určuje persistentní data ▪ Ale také určuje co se bude sbírat od uživatele ▪ Jak budou data vypadat, či jaká mají omezení
Služby pracují s entitami ▪ Pokud se změní název entity musí se to promítnout i zde
Prezentace dat (entit) v uživatelském rozhraní ▪ Formuláře a Tabulky ▪ Provázání asosiací ▪ Tabulka – formulář
▪ Navigace a menu ▪ Layout ▪ Akce
Vrstva prezentace defnuje zobrazení dat uživateli ▪ Vizualizace dat ▪ Motivace ▪ Údržba Software ≈ 65-75% životního cyklu aplikace ▪ Porozumění SW ≈ 40-60% z údržby SW ▪ Vývoj uživatelského rozhraní ≈ 50% celkového vývoje
▪ Formuláře a Tabulky ▪ Jsou nejvíce svázány s persistentní vrstvou ▪ Jsou koncepčně nejsložitější části UI (omezení a validace) ▪ Jak budou tyto vypadat je určeno Entitou Layoutem Rozhodnutím jaké pole tam má být a jaké ne Uživatelskými právy Volbou widgetu Kontextem (editace, čtení, hledání)
[IEEE-CSAE, Cerny et al., 2011], [ACM-RACS, Cerny et al., 2011]
Entity Class
View Table
View Form
Entity Class
View Table
View Form
Perzistentní vrstva JPA Entita ▪ Zachycuje omezení každého atributu ▪ Povolený typ ▪ Informace o očekávaných datech
Hibernate Validation ▪ Detailní informace o validních datech pro každý atribut
Byznys vrstva Prezentace Form ▪ Dekoruje entitu a její atributy ▪ Přídává omezení pro validní data
Tabulka ▪ Dekoruje entitu a její atributy
class Osoba { String jmeno; String prijmeni; String email; String pass; Pohlavy pohlavy; String narozen; }
class Firma { Katg kategorie; String misto; String ulice; String mesto; String psc; String tel; Boolean souhlas; }
Facebook UiWidgety InputText InputDoubleText InputSecret InputSelect InputCheckBox InputDate
class Osoba { String jmeno; String prijmeni; String email; String pass; Pohlavy pohlavy; Date narozen; }
class Firma { Katg kategorie; String misto; String ulice; String mesto; String psc; String tel; Boolean souhlas; }
UiWidgety InputText InputDoubleText InputSecret InputSelect InputCheckBox InputDate
class Osoba { String jmeno; String prijmeni; String email; String pass; Pohlavy pohlavy; Date narozen; }
class Firma { Katg kategorie; String misto; String ulice; String mesto; String psc; String tel; Boolean souhlas; }
UiWidgety InputText InputDoubleText InputSecret InputSelect InputCheckBox InputDate
class Osoba { String jmeno; String prijmeni; String email; String pass; Pohlavy pohlavy; Date narozen; }
class Firma { Katg kategorie; String misto; String ulice; String mesto; String psc; String tel; Boolean souhlas; }
UiWidgety InputText InputDoubleText InputSecret InputSelect InputCheckBox InputDate
GMail
InputText InputDoubleText InputSecret InputSelect InputCheckBox InputDate
ACM-ICPC
This form is made by JFB
Vývojář opakuje svá rozhodnutí, pro použití UI Widgetů. Používá totožné komponenty, jen je jinak dekoruje. Musí replikovat nastavení již zachycené v entitě. Náchylnost k chybám Snadno přehlédnutá inkonzistence Nudná práce pro „opice“
Otázka Jak jinak lze vytvořit UI něž manuálně?
Grafcké drag & drop formy
@Column(nullable=false) String getName() { ..
Složité přizpůsobení Stále replikace informací na dvou místech, neřeší údržbu Neřeší nekonzistenci informací mezi dat. vrstvou a prezentací
XML Model formy Stále replikace informací na dvou místech (XML a Class), neřeší údržbu Neřeší nekonzistenci informací mezi dat. vrstvou a prezentací
Inspekce zdrojového kódu a následná transformace Machine learning Vizualization
Speciální značky
2. Meta Model Konfgurace
Šablony UI Widgetů Mapování
3. Visualizér
1. Inspektor
▪
Inspekce entity a následné získání MetaModelu ▪ Enitita má speciální značky ▪ JPA, Hibernate Validator, JFormBuilder nebo cokoliv, co si nastavíme v konfguraci ▪ Značky lze vytvořit dle požadavků klienta v JFB frameworku ▪ Zjištěný MetaModel nezavisí na výstupu
▪ Inspektor sestaví meta model a identifkuje vlastnosti atributů
Speciální značky Meta Model
Inspektor
▪
Konfgurace
Kompatibilita s GUI widgety
Šablony UI Widgetů
▪ Konfgurace umožní provázání UI Widgetů se skupinou atributů tříd ▪ String and length > 255 inputTextArea ▪ String and email inputEmail
Mapování
▪ Není nutné mít specifckou skupinu widgetů, ale lze adaptovat cokoliv ▪ HTML, RichFaces, JSF, ICEFaces, PrimeFaces, Tomahawk, Trinidad, ADF, XML.. :)
▪ Šablona UI Widgetu odkazuje na konkrétní použití widgetu bez identifkace specifcký hodnot
Input Text Widget
▪
Vizualizér
Visualizér
▪ Dle konfgurace spojí inspektovaný atribut třídy a UIWidget ▪ Bere v potaz ▪ Vybraný profl ▪ Search, Edit, Read ▪ Vybraná práva uživatele ▪ Layout
Profl Editace
Role s nižším právy
▪
Snadné propagování validace do UI ▪ Snazší vyplnění formulářů ▪ User friendly – usability ▪ Lze integrovat kontextovou nápovědu ▪ Není třeba AJAX - snadná integrace s JS
▪
Layout ▪ Jak vysázet vstupní pole do výsledného výstupu (formuláře) ▪ One column, two column, custom ▪ Šablona
▪
Profl
▪ Generujeme fragment zaměřený na hledání, čtení, zápis, nebo něco jiného.
▪
Bezpečnost
▪ Statická a nebo lze i Third party / Role based access control (PicketLink, Spring)
Uplný form
Zamezení přístupu
Jiny profl a jiný layout
▪
Snadná změna poskytovatele UI Widgetů i cílové platformy
▪
Centralizace použití widgetu ▪ Vše je defnováno jednou a na jednom místě ▪ Možná Vám to připomíná Aspektové orientované programování ▪ Podpora údržby
▪
=> Přenostitelnost ▪ Snadná migrace do jiného UI ▪ Téměř okamžitý přechod z RichFaces do ICEFaces ▪ Jen změna šablon pro UI Widgety
▪
On-demand (run-time) generování ▪ Generování UI fragmentů na dotaz v produkci ▪ Možný contextový security framework jenž aplikuje run-time informace ▪ Zamezení běžně používaným kondicionálům v UI fragmentech ▪ Možné zlepšení výkonu načítání fragmentů (měřeno!)
▪ Možné další rozšíření ▪ Specifcké UI pro vybraného uživatele [2011 - IEEE cultural UI] ▪ Uživatel má možnost nastavení svého UI ▪ Možné rozlišovat mobilní zařízení a desktopy a ovlivnit výstup
? ?
▪
Údržba UI fragmentů ▪ Značná redukce ▪ Na místo psaní formů a tabulek jen defnice UI Widgetů a mapování mezi skupinou atributů ▪ String and length > 255 inputTextArea ▪ String and email inputEmail
▪ Studie údržby Změna
Změněných souborů
Změna řádků
JFormBuilder/Manuální vývoj Nový atribut
3 / 12
Nová třída
9 /
Změna pořadí prvků
1 /
Globální změna - internacionalizace
6
/ 126
7
41
/ 121
2
2
25 / 29
32
/
54
/ 213
▪
Quick Tour ▪ Václav Chalupa ▪ JFormBuilder.org/video
▪
Inspektor nemusí jen inspektovat Javu ▪ Lze i XML, UML, XLS nebo cokoliv jiného ▪ Analytik si snadno napíše v Excelu spcifkaci UI a nechá si přes JFB vygenerovat HTML ▪ Ihned vidí co vytvořil a to prodiskutuje se zákazníkem
▪ Pošle vývojáři Excel XSL, ten použije jiné šablony a nechá přes JFB vygenerovat
RichFaces UI nebo dokonce celý datový model v Javě a klidně i SQL databázi ▪ JFB dokáže daný meta model přeložit do jakékoliv textové podoby
▪ Android
Speciální značky
▪ Další Frameworky a jazyky Meta Model
Inspektor
Java XLS XML
▪
Tlustý datový model lze zachytit již na úrovni modelu ▪ Model-driven development ▪ UML Class model + UML Profly ▪ Z modelu lze generovat aplikaci obsahující vazbu na JFB
▪
Java
XML
View
Vývoj enterprise aplikací
Struktura aplikace ▪
(JPA, EJB, JSF, Facelets, RichFaces, ICEFaces, ADT, apod.)
Problémy s údržbou i tvořením GUI Závislosti 3 vrstev (coupling) Opakování informace a replikace rozhodnutí
JFormBuilder (JFB)
Generátory UI Automatizace skrze inspekci ▪ ▪ ▪ ▪ ▪ ▪ ▪ ▪
Kompatibilita s GUI widgety On-demand generation Third party / Role based access control Profly Layouty Možné zrychlení načítání stranek Udržba = nulová investice Přenositelnost
Online tutoriál JFB Za hranice Javy
MDD, XLS, XML, Aneb přátelství analytika a vývojáře
Prototypování aplikací
Android
.NET a další platformy
Reverse engineering
vysosej metaModel převeď jinam
FormBuilder: A Novel Approach to Deal with View Development and Maintenance 2011, ČERNÝ T., DONAHOO M. J. In SofSem 2011 Proceedings of Student Research Forum. Bratislava: OKAT, 2011, p. 16-34. ISBN 978-80-88720-17-1.
A Profle Approach to Using UML Models for Rich Form Generation 2010, ČERNÝ T., SONG E. In ICISA 2010 International Conference on Information Science and Applications (ICISA), 2010. New York: IEEE Computer Society Press, 2010, p. 635-342. ISBN 978-1-4244-5941-4.
UML-Based Enhanced Rich Form Generation, 2011, Tomas Cerny and Eunjee Song ACM RACS 2011 – recently published at http://oslab.ssu.ac.kr/CFP/RACS2011/
Aspektově orientované programování [Kiczales 1997] Model Driven Architecture – OMG.org
Naked Objects MetaWidget
?
?
?