$30 off During Our Annual Pro Sale. View Details »

Cloud Native PWAs (progressive web apps with Spring Boot and Angular) - DevNexus 2017

Cloud Native PWAs (progressive web apps with Spring Boot and Angular) - DevNexus 2017

In this session, we show how to build microservices with Spring, deploy them to the cloud and expose their functionality with an progressive web application that can run offline. You’ll learn how to “build to fail” and create a quality, resilient application. Live coding will show how to use: Spring Boot, Spring Cloud, Spring Security, Cloud Foundry, IntelliJ IDEA, Angular 2, JWT, Stormpath, and Progressive Web Apps.

Demo code: https://github.com/mraible/cloud-native-pwas

Matt Raible

February 23, 2017

More Decks by Matt Raible

Other Decks in Technology


  1. Cloud Native PWAs

    Matt Raible & Mark Heckler

    @mraible @mkheck
    photo by: https://www.flickr.com/photos/theaucitron/5810163712

    View Slide

  2. About You
    Do you like Java? What about Spring?

    Do you like JavaScript? TypeScript?

    Anyone using Angular? PWAs?

    Why are you here?

    View Slide

  3. Blogger on raibledesigns.com
    UI Architect and Java Champion
    Father, Skier, Mountain
    Biker, Whitewater Rafter
    Web Framework Connoisseur
    Who is Matt Raible?
    Bus Lover
    Stormpath Developer Evangelist

    View Slide

  4. View Slide

  5. View Slide

  6. Thinker of thoughts at thehecklers.org, @MkHeck
    Who is Mark Heckler?
    Java Champion
    Spring Developer Evangelist

    View Slide

  7. View Slide

  8. View Slide

  9. View Slide

  10. View Slide

  11. View Slide

  12. View Slide

  13. View Slide

  14. View Slide

  15. The Future of Java in the Enterprise

    View Slide

  16. start.spring.io

    View Slide

  17. Live Coding with Mark

    View Slide

  18. Fin

    View Slide

  19. What about the client?

    View Slide

  20. View Slide

  21. View Slide

  22. View Slide

  23. 2007

    View Slide

  24. View Slide

  25. View Slide

  26. “We’ve failed on mobile”

    — Alex Russell


    View Slide

  27. Mobile Hates You!
    How to fight back:

    Implement PRPL

    Get a ~$150-200 unlocked Android (e.g. Moto G4)

    Use chrome://inspect && chrome://inspect?tracing


    DevTools Network & CPU Throttling

    View Slide

  28. The PRPL Pattern




    View Slide

  29. The PRPL Pattern
    Push critical resources for the initial URL route

    Render initial route

    Pre-cache remaining routes

    Lazy-load and create remaining routes on demand

    View Slide

  30. Progressive Web Apps

    View Slide

  31. Live Coding with Matt

    View Slide

  32. B U I L D I N G
    P R O G R E S S I V E W E B A P P S
    I S H A R D

    View Slide

  33. https://flic.kr/p/cAvyTd
    Learned from PWA Giants
    Josh Crowther - @jshcrowthe

    PWAs: The Future of the Web

    Maxim Salnikov - @webmaxru

    PWAs using the Angular
    Mobile Toolkit

    Angular 2 PWA Workshop

    View Slide

  34. Thanks!
    Matt Raible & Mark Heckler

    @mraible @mkheck

    View Slide