Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Write Powerful Javascript Modules To Make Your Apps DRY (Brian Leathem)

839 views

Published on

Large-scale Javascript applications benefit from a modular approach that let code be reused both within the application and across repeated implementations. In this session, we'll look at the modular approach used to build reusable Javascript modules in the Red Hat mobile field workforce management application (WFM) showcased in this year's Summit middleware keynote demo. Reusable modules for WFM are packaged as node package manager (npm) modules, providing a consistent format for both server and client sides using Node.js and Browserify. Modules are loosely coupled using the Mediator pattern and they broadcast user actions and state changes giving the application and other modules the opportunity to hook into those events. Additionally, visual components are packaged in a framework-agnostic manner, providing reusable UI components. You'll leave this session understanding the challenges faced when building reusable modules for large-scale applications, and the solutions employed in building out the reusable WFM modules.

Published in: Software
  • Be the first to comment

  • Be the first to like this

Write Powerful Javascript Modules To Make Your Apps DRY (Brian Leathem)

  1. 1. Write powerful Javascript modules to make your apps DRY DevNation 2016
  2. 2. Brian Leathem @bleathem
  3. 3. Field Workforce Management
  4. 4. Modularity
  5. 5. Nuts and bolts
  6. 6. Modularity in Software Engineering
  7. 7. At large scale
  8. 8. Keynote Microservices
  9. 9. At small scales: Keeping your code DRY
  10. 10. Don't Repeat Yourself
  11. 11. Why DRY?
  12. 12. Bring it back to javascript
  13. 13. Front-end and back-end
  14. 14. Javascript Libraries
  15. 15. Javascript Build Tools
  16. 16. Testing
  17. 17. Frontend / UI
  18. 18. Javascript Libraries
  19. 19. Other libraries
  20. 20. More prescriptive frameworks
  21. 21. Cordova plugins
  22. 22. CSS libraries
  23. 23. Block Element Modifier
  24. 24. Backend
  25. 25. Module Packaging & Delivery
  26. 26. Module Repository Bower is dead. Npm is king. Jspm is looking good.
  27. 27. WFM Modularity
  28. 28. Considerations for a module system
  29. 29. WFM Design Goals
  30. 30. WFM Design Constraints
  31. 31. In the module: module.exports = 'wfm.camera'; In the application: require('fh-wfm-camera')
  32. 32. Mediator Pattern https://addyosmani.com/largescalejavascript/
  33. 33. mediator.subscribe('wfm:workorder:create:', function(object, ts) { self.create(object, ts) .then(function(object) { Mediator .publish('done:wfm:workorder:create:'+ ts, object); }); Mediator Pattern in a cloud app
  34. 34. WFM Architecture
  35. 35. RainCatcher Modules https://github.com/feedhenry-raincatcher
  36. 36. Demo

×