Rich HTML5 Web Apps: Typesafe Edition
•0 likes•2,192 views
Report
Share
Download to read offline
In modern Web applications, the complexity of code deployed to the browser now exceeds the complexity of server-side code. Why write the simpler tier in toolable, typesafe languages but throw the constantly evolving user interface layer to the JavaScript wolves? Through compile-time source code translation, the Errai framework brings mature, proven, toolable Java enterprise programming models to the browser so your team can pole-vault over the complexity wall. In this session, members of the Errai team demonstrate how to build rich Web applications the toolable, typesafe way, without boilerplate. Errai offers a concise programming model to build next-generation Web applications by combining the best aspects of JavaScript and Java.
More Related Content
Similar to Rich HTML5 Web Apps: Typesafe Edition
Similar to Rich HTML5 Web Apps: Typesafe Edition(20)
Recently uploaded
Recently uploaded(20)
Rich HTML5 Web Apps: Typesafe Edition
- 1. Rich HTML5 Web Apps: Typesafe Edition Christian Sadilek (@csadilek) Jonathan Fuerth (@jfuerth) JBoss / Red Hat
- 2. RIP Java™ Programming Language 1995-2009 Photo by: Crismatos From: Flickr
- 3. RIP Google Web Toolkit 2006-2011 Photo by: Crismatos From: Flickr
- 4. RIP JBoss Errai Framework 2010-2013 Photo by: Crismatos From: Flickr
- 5. The rumors of my demise are greatly exaggerated!
- 6. 1. WHY YOUR JOB IS HARD
- 7. LARGE DEVELOPMENT TEAMS MAKE THINGS HARD Who is working on what? Skill-segregation causes duplicate work. Code rots over time.
- 8. LARGE OR COMPLEX CODE BASES MAKE THINGS HARD Where is code actually used? What can safely be changed? Code rots over time.
- 9. LARGE CUSTOMERS MAKE THINGS HARD Requests big changes frequently. Want mobile NOW. Want super-high performance NOW.
- 10. 2. HOW ERRAI HELPS
- 11. USE THE BEST TOOLS AND STANDARDS HTML5 and CSS for layout Java for enterprise development JavaScript for the nitty-gritty
- 12. SHARE CODE EFFECTIVELY Don’t repeat yourself Don’t clone other people’s code Share data model and validation logic
- 13. BUST THAT BOILERPLATE!!! Declarative, simple code A little goes a long way Less code == more time
- 15. #JavaStillWins Typesafe language Refactoring Code analysis Extremely testable Experienced people with the right skills
- 16. 3. ERRAI CORE CONCEPTS
- 17. HTML5 TEMPLATING Use HTML5/CSS templates directly from the designer or brand team. <!DOCTYPE html> <link href="css/bootstrap.css" rel="stylesheet"> <form id="app-template"> <input id="name" type="text" placeholder="Full Name"> <input id="email" type="text" placeholder="you@example.com"> <textarea id="text" rows="10"></textarea> <button id="submit">Submit</button> </form> ...and just attach it! @Templated public class ComplaintForm extends Composite { @Inject @DataField private TextBox name; ... }
- 18. NAVIGATION AND BOOKMARKING Declare a page: @Page @Templated public class ComplaintForm extends Composite { ... } And navigate: @Page public class WelcomePage extends Composite { @Inject private TransitionTo<ComplaintForm> complaintForm; @EventHandler private void onComplaint(ClickEvent e) { complaintForm.go(); } }
- 19. TWO-WAY DATA BINDING Remove boilerplate code and bring forms to life with a few simple annotations. @Templated public class ComplaintForm extends Composite { @Inject @Model private UserComplaint model; @Inject @Inject @Inject @Inject } @Bound @DataField private @Bound @DataField private @Bound @DataField private @DataField private Button TextBox name; TextBox email; TextArea complaint; submit;
- 20. TYPESAFE DISTRIBUTED EVENTS Injecting @Inject private Event<Document> updatedDocEvent; firing updatedDocEvent.fire(document); and observing events public void onUpdatedDocument(@Observes Document doc) { }
- 21. TYPESAFE RPC AND REST Simple and powerful to set up, leaving a foundation of confidence to refactor, test, and maintain. @Inject private Caller<UserComplaintEndpoint> endpoint; ...and with the bound model: endpoint.call().create(model);
- 22. JPA, OFFLINE MODE AND DATA SYNC Stay connected, even when you can’t. Satisfy rising demands for online collaboration. @Inject private EntityManager entityManager; @Inject private ClientSyncManager syncManager;
- 23. GO MOBILE NOW! Use native Android, iPhone, and BlackBerry features. @Inject private Camera camera; public void onBatteryLow(@Observes BatteryLowEvent e) { }
- 24. THE BIG INSPIRATIONAL DEMO!
- 25. THE END? THE BEGINNING - OF YOUR ADVENTURE WITH ERRAI!
- 26. Get in touch! Website: http://jboss.org/errai IRC: #errai on freenode Twitter: @jbosserrai We ❤ Pull Requests Photo by: CHIN.DENG From: Flickr http://github.com/errai
- 27. QUESTIONS?