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.

JavaScript - The Universal Platform?


Published on

JavaScript for web, native mobile and desktop.

Published in: Technology
  • Be the first to comment

JavaScript - The Universal Platform?

  1. 1. JavaScript: The Universal Platform? Mail: Twitter: @jbandi
  2. 2. Two Worlds?
  3. 3. How could anybody love JavaScript?
  4. 4.
  5. 5.
  6. 6. Active Ecosystem (Maven Central has 153k unique artifacts)
  7. 7. Scott Hanselman Fluent 2014 keynote "Virtual Machines, JavaScript and Assembler" HTML5:An operating system?
  8. 8. It's Spreading!
  9. 9. Beyond the Browser Nashorn Native Script React Native NW.js MacGap
  10. 10. Why should you care? • You have web developers / web skills are prevalent and available easily on the market • Some web technologies are actually very powerful • You might reuse knowhow and even concrete code
  11. 11. This is an experiment! What can we achieve just using JavaScript?
  12. 12. Context: Birdcage birdcage worker (a simple tweet scheduler)
  13. 13. Demo: Birdcage Web App Development: • Fast Cycles • Debugging • HTML/CSS • JS
  14. 14. Demo: Birdcage Rich Client Development: • HTML/CSS • JS • Fast Cycles • Debugging • Bundling for all Platforms
  15. 15. Electron Architecture Main Process Render Process Render Process App native ui OS start start IP CIP C E E E
  16. 16. Demo: BirdcageNative Mobile Client React Native Development: • HTML/CSS • JS • Fast Cycles • Debugging • Deployment as App
  17. 17. React Native ArchitectureApp React Native Components Native APIs (bridged) “Learn once, write everywhere” Native UI Components (Cocoa, Android) • React as UI Framework • CSS for Layout • JavaScript Ecosystem Different implementations for iOS & Android if needed.
  18. 18. Demo: Couch DB Persistence
  19. 19. Demo: Couch DB Persistence React Native rich client
  20. 20. Demo: Dedicated Backend
  21. 21. Demo: Dedicated Backend React Native rich client
  22. 22. Demo: Dedicated Backend React Native re-use your couchdb persistence rich client
  23. 23. Demo: Firebase Persistence React Native rich client
  24. 24. Context: Birdcage birdcage worker React Native
  25. 25. Next steps … Businesslogic andValidation: Just another Node module Native Script Angular 2
  26. 26. Angular 2 aspires to be a platform progressive web-apps for mobile
 (web workers, cache, push, offline) classic web-apps for desktops installed mobile apps (hybrid) installed mobile apps (native integrations) server side rendering installed desktop apps dev tooling
  27. 27. Reuse • Reuse of web-dev knowhow & dev infrastructure • Reuse code from your web application • Cross-platform solutions 85% Code Reuse with RN:
  28. 28. Write once, 
 run everywhere. Learn once, 
 write everywhere.
  29. 29. Apps realized with Electron: Apps realized with React Native: Facebook Facebook Ads Manger Discord SoundCloud Pulse Git Kraken Insomnia 
 Rest ClientPostman WhatsApp
  30. 30. Questions? JavaScript Schulungen & Coachings,
 Project-Setup & Proof-of-Concept: Code: