Successfully reported this slideshow.

Rich HTML5 Web Apps: Typesafe Edition

0

Share

Upcoming SlideShare
Add profile to project v2
Add profile to project v2
Loading in …3
×
1 of 27
1 of 27

Rich HTML5 Web Apps: Typesafe Edition

0

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.

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

Related Books

Free with a 14 day trial from Scribd

See all

Rich HTML5 Web Apps: Typesafe Edition

  1. 1. Rich HTML5 Web Apps: Typesafe Edition Christian Sadilek (@csadilek) Jonathan Fuerth (@jfuerth) JBoss / Red Hat
  2. 2. RIP Java™ Programming Language 1995-2009 Photo by: Crismatos From: Flickr
  3. 3. RIP Google Web Toolkit 2006-2011 Photo by: Crismatos From: Flickr
  4. 4. RIP JBoss Errai Framework 2010-2013 Photo by: Crismatos From: Flickr
  5. 5. The rumors of my demise are greatly exaggerated!
  6. 6. 1. WHY YOUR JOB IS HARD
  7. 7. LARGE DEVELOPMENT TEAMS MAKE THINGS HARD Who is working on what? Skill-segregation causes duplicate work. Code rots over time.
  8. 8. LARGE OR COMPLEX CODE BASES MAKE THINGS HARD Where is code actually used? What can safely be changed? Code rots over time.
  9. 9. LARGE CUSTOMERS MAKE THINGS HARD Requests big changes frequently. Want mobile NOW. Want super-high performance NOW.
  10. 10. 2. HOW ERRAI HELPS
  11. 11. USE THE BEST TOOLS AND STANDARDS HTML5 and CSS for layout Java for enterprise development JavaScript for the nitty-gritty
  12. 12. SHARE CODE EFFECTIVELY Don’t repeat yourself Don’t clone other people’s code Share data model and validation logic
  13. 13. BUST THAT BOILERPLATE!!! Declarative, simple code A little goes a long way Less code == more time
  14. 14. #JavaStillWins Typesafe language Refactoring Code analysis Extremely testable Experienced people with the right skills
  15. 15. 3. ERRAI CORE CONCEPTS
  16. 16. 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; ... }
  17. 17. 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(); } }
  18. 18. 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;
  19. 19. TYPESAFE DISTRIBUTED EVENTS Injecting @Inject private Event<Document> updatedDocEvent; firing updatedDocEvent.fire(document); and observing events public void onUpdatedDocument(@Observes Document doc) { }
  20. 20. 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);
  21. 21. 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;
  22. 22. GO MOBILE NOW! Use native Android, iPhone, and BlackBerry features. @Inject private Camera camera; public void onBatteryLow(@Observes BatteryLowEvent e) { }
  23. 23. THE BIG INSPIRATIONAL DEMO!
  24. 24. THE END? THE BEGINNING - OF YOUR ADVENTURE WITH ERRAI!
  25. 25. 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
  26. 26. QUESTIONS?

×