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

Building Cloud Native Progressive Web Apps - Devoxx Morocco 2017

Building Cloud Native Progressive Web Apps - Devoxx Morocco 2017

In this session, you’ll learn how to build microservices with Spring, deploy them to the cloud and expose their functionality with a 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 Kotlin, Spring Boot, Spring Cloud, Cloud Foundry, IntelliJ IDEA, Angular, and Progressive Web Apps.

YouTube: https://www.youtube.com/watch?v=5386kXFvreM
Source code: https://github.com/mraible/cloud-native-pwas
PR showing how to integrate Okta: https://github.com/mraible/cloud-native-pwas/pull/10

Matt Raible

November 14, 2017

More Decks by Matt Raible

Other Decks in Programming


  1. Building Cloud Native
    Progressive Web Apps
    Josh Long
    Matt Raible

    View Slide

  2. About You
    Are you using Spring? Spring Boot?

    Do you like JavaScript? TypeScript?

    Anyone using Angular? React? PWAs?

    Why are you here?

    View Slide

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

    View Slide

  4. View Slide

  5. developer.okta.com

    View Slide

  6. Authentication Standards

    View Slide

  7. • http://cloudnativejava.io
    • @starbuxman
    [email protected]
    • Java Champion
    • open-source contributor 

    (Spring Boot, Spring Cloud, Spring
    Integration, Vaadin, Activiti, etc etc)
    the Spring Developer Advocate
    Josh Long (⿓龍之春, ⻰龙之春, जोश)

    View Slide

  8. View Slide

  9. View Slide

  10. View Slide

  11. Did you know?
    “In the early years of the 20th century,
    horses were causing so much pollution with
    their poop that cars were seen as the
    "green" alternative.”

    View Slide

  12. https://xkcd.com/1559/

    View Slide

  13. https://xkcd.com/864/
    Flying Cars

    View Slide

  14. Live Coding with Josh

    View Slide

  15. Fin

    View Slide

  16. What about the client?

    View Slide

  17. View Slide

  18. View Slide

  19. View Slide

  20. 2007

    View Slide

  21. View Slide

  22. “We’ve failed on mobile”

    — Alex Russell


    View Slide

  23. 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

  24. The PRPL Pattern




    View Slide

  25. 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

  26. Progressive Web Apps

    View Slide

  27. Live Coding with Matt

    View Slide

  28. 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

  29. Check out JHipster! jhipster.tech

    View Slide

  30. The JHipster Mini-Book
    Written with Asciidoctor

    Quick and to the point, 130 pages

    Developed a real world app:


    Free Download from


    View Slide

  31. Learn More
    Build Your First Progressive Web Application with
    Angular and Spring Boot

    Build a Microservices Architecture for Microbrews with
    Spring Boot

    The Ultimate Guide to Progressive Web Applications 

    Secure a Spring Microservices Architecture with Spring
    Security, JWTs, Juiser, and Okta

    View Slide

  32. Thanks!
    Matt Raible & Josh Long

    @mraible @starbuxman

    View Slide