Building Cloud Native Progressive Web Apps with Angular and Spring Boot - Devoxx France 2017

•

1 like•442 views

In this session, we show how to build microservices with Spring Boot/Spring Cloud, 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, Cloud Foundry, IntelliJ IDEA, Angular, and Progressive Web Apps. Source code: https://github.com/mraible/cloud-native-pwas

#D
Cloud Native PWAs 
Matt Raible & Josh Long 
@mraible @starbuxman
photo by: https://www.ﬂickr.com/photos/theaucitron/5810163712#DevoxxFR

About You
Do you like Spring?

Do you like JavaScript? TypeScript?

Anyone using Angular? P.W.A.?

Why are you here?
#DevoxxFR

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

Building Cloud Native Progressive Web Apps with Angular and Spring Boot - Devoxx France 2017

• http://cloudnativejava.io
• @starbuxman
• josh@joshlong.com
• Java Champion
• open-source contributor  
(Spring Boot, Spring Cloud, Spring
Integration, Vaadin, Activiti, etc etc)
the Spring Developer Advocate
Josh Long (⿓龍之春, ⻰龙之春, जोश)

https://xkcd.com/323/
“Ballmer Peak”
#DevoxxFR

“In heaven there is no beer.
That's why we drink it here
and when we're gone from here,
our friends will be drinking all our beer!”
— Art Walunas

Merci !
https://github.com/joshlong/cloud-native-pwas
Josh Long & Matt Raible 
@starbuxman @mraible

#D
Cloud Native PWAs - Part Deux 
Matt Raible & Josh Long 
@mraible @starbuxman
photo by: https://www.ﬂickr.com/photos/theaucitron/5810163712#DevoxxFR

“We’ve failed on mobile”

— Alex Russell

https://youtu.be/K1SFnrf4jZo

Mobile Hates You!
How to ﬁght back:

Implement PRPL

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

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

Lighthouse

DevTools Network & CPU Throttling

The PRPL Pattern
Push

Render

Pre-cache

Lazy-load

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

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

https://ﬂic.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 Mobile Toolkit  
Workshop

Thanks!
https://github.com/mraible/cloud-native-pwas
Matt Raible & Josh Long 
@mraible @starbuxman
http://bit.ly/sp-boot-pwas

What's hot

Developing PWAs and Mobile Apps with Ionic, Angular, and JHipster - Devoxx Mo...

Matt Raible

In this session, I show how to build a Progressive Web App (PWA) AND a mobile app using Ionic, Angular and JHipster. PWAs are being hyped as the next big thing in mobile development. This talk describes the trials and tribulations of developing the Ionic Module for JHipster. It will show how you can easily generate Ionic UIs and describe the pain points of working with Node and Yeoman to develop this module. My Dev Story about Ionic for JHipster on YouTube: https://www.youtube.com/watch?v=B7TjR_rJVeU

Testing Angular 2 Applications - Rich Web 2016

Matt Raible

The best reason for writing tests is to automate your testing. Without tests, you'll likely be testing manually. This manual testing will take longer and longer as your codebase grows. In this session, you’ll learn how to test an Angular 2 application. You'll learn how to use Jasmine to unit test components and Protractor for integration testing. We’ll also take a look at code coverage options and explore continuous integration tools.

What's New in JHipsterLand - Devoxx Poland 2017

Matt Raible

JHipster is an application generator that allows you to create monoliths or microservices, based on Spring Boot and Angular. It leverages Spring Cloud for microservices and contains best-of-breed JavaScript and CSS libraries for creating your UI. In this session, you’ll learn about what’s new in JHipster. Topics include Angular 4, Progressive Web Apps, HTTP/2, JUnit 5 and Spring 5. Monolith Demo: https://github.com/mraible/jhipster4-demo/blob/master/README.adoc Microservices Demo: https://developer.okta.com/blog/2017/06/20/develop-microservices-with-jhipster

Front End Development for Back End Developers - UberConf 2017

Matt Raible

Are you a backend developer that’s being pushed into front end development? Are you frustrated with all JavaScript frameworks and build tools you have to learn to be a good UI developer? If so, this session is for you! We’ll explore the tools of the trade for frontend development (npm, yarn, Gulp, Webpack, Yeoman) and learn the basics of HTML, CSS, and JavaScript. This presentation dives into the intricacies of Bootstrap, Material Design, ES6, and TypeScript. Finally, after getting you up to speed with all this new tech, I'll show how it can all be found and integrated through the fine and dandy JHipster project.

The Ultimate Getting Started with Angular Workshop - Devoxx UK 2017

Matt Raible

This document contains a presentation on Angular by Matt Raible. It begins with an introduction of Matt Raible and his background. It then covers various topics related to Angular including getting started, authentication standards, jobs data, Google Trends data, building Hello World apps in AngularJS and Angular, choices in Angular 2+, ES6/TypeScript, components, forms, data architectures, style guides, projects, testing, and authentication. It includes code samples and encourages learning by doing labs and projects.

Front End Development for Back End Developers - Devoxx UK 2017

Matt Raible

Are you a backend developer that’s being pushed into front end development? Are you frustrated with all JavaScript frameworks and build tools you have to learn to be a good UI developer? If so, this session is for you! We’ll explore the tools of the trade for fronted development (npm, yarn, Gulp, Webpack, Yeoman) and learn the basics of HTML, CSS, and JavaScript. We’ll dive into the intricacies of Bootstrap, Material Design, ES6, and TypeScript. Finally, after getting you up to speed with all this new tech, we’ll show how it can all be found and integrated through the fine and dandy JHipster project.

Bootiful Development with Spring Boot and Angular - Spring I/O 2017

Matt Raible

To simplify development and deployment, you want everything in the same artifact, so you put your Angular app “inside” your Spring Boot app, right? But what if you could create your Angular app as a standalone app and make cross-origin requests to your API? A client app that can point to any server makes it easy to test your current client code against other servers (e.g. test, staging, production). This workshop shows how to develop with Java 8, Spring Boot, Angular 4, and TypeScript. You’ll learn how to create REST endpoints with Spring MVC, Spring Data REST, configure Spring Boot to allow CORS, and create an Angular app to display its data. If time allows we’ll cover microservices, security/authentication, continuous integration, and deployment to Cloud Foundry. Prerequisites: Java 8, Maven 3.5.0, Node.js 6.9.5, Chrome (higher versions ok) Install Angular CLI: npm install -g @angular/cli Optional: Yarn instead of npm Tutorial used for workshop: http://developer.okta.com/blog/2017/04/26/bootiful-development-with-spring-boot-and-angular

Get Hip with Java Hipster - JavaOne 2017

Matt Raible

Building a modern web application requires a lot of tools, frameworks, and techniques. This session shows how JHipster unites popular frameworks such as Angular, Spring Boot, and Bootstrap. Learn how Yeoman, a scaffolding tool for modern web apps, works with JHipster to generate a project that uses Java 8, SQL or NoSQL databases, Spring profiles, Maven or Gradle, Webpack, WebSockets, and BrowserSync. It also supports a number of different authentication mechanisms, including classic session-based auth, OAuth 2.0, and JWT-based authentication. For production deployments, JHipster includes out-of-the-box support for AWS, Cloud Foundry, Heroku, Docker, and Kubernetes.

Develop Hip APIs and Apps with Spring Boot and Angular - Connect.Tech 2017

Matt Raible

The Tale of 2 CLIs - Ember-cli and Angular-cli

Tracy Lee

Front Ends for Back End Developers - Spring I/O 2017

Matt Raible

YouTube: https://www.youtube.com/watch?v=HnX09pdxEQI Are you a backend developer that’s being pushed into front end development? Are you frustrated with all JavaScript frameworks and build tools you have to learn to be a good UI developer? If so, this session is for you! We’ll explore the tools of the trade for fronted development (npm, yarn, Gulp, Webpack, Yeoman) and learn the basics of HTML, CSS, and JavaScript. We’ll dive into the intricacies of Bootstrap, Material Design, ES6, and TypeScript. Finally, after getting you up to speed with all this new tech, we’ll show how it can all be found and integrated through the fine and dandy JHipster project.

What's This React Native Thing I Keep Hearing About?

Evan Stone

In our daily lives as iOS developers, we can usually happily keep coding away in Swift and ignore what’s going on in other software development communities, like that of JavaScript. However, there may be some advantages to at least becoming familiar with what’s going on in the world of React Native, and in this session you will get an overview of what React Native is, and why it could be a useful addition to your toolbox an iOS developer. These slides are based on a talk given by Evan K. Stone at the Forward Swift conference in San Francisco on March 2, 2017.

Interoperability of components built with different frameworks

Souvik Basu

As React, Vue, Angular and other Frontend frameworks mature, more and more projects embrace them in production. It has reached a point where a project written in React wants to use Angular or Vue components (and vice versa). We will explore pragmatic ways to use components created using different frameworks in the same app. I am working on an Angular project for one of our clients. It recently acquired a company which is invested into React for few years. There is a plan to merge our products which has a lot of feature overlap. To use capabilities of existing teams, it was decided to use React components within Angular app. This is when we explored all possibilities of inter operations between frameworks. This talk will be case study of our work and what you can take away from it

Angular vs React Smackdown - Devoxx BE 2017

Matt Raible

This talk discusses the pros and cons of Angular and React and shows how they're similar, as well as how they're different. Deepu defends React, Matt defends Angular. We'll even show you the same app created with React and Angular via JHipster. YouTube: https://youtu.be/qYEEuiI4l10 Example projects are on GitHub: Angular: https://github.com/hipster-labs/devoxx17-jh-angular React: https://github.com/hipster-labs/devoxx17-jh-react And they're deployed to Heroku: Angular: https://devoxx-17-angular.herokuapp.com/ React: https://devoxx-17-react.herokuapp.com/

Run Fast, Try Not to Break S**t

Michael Schmidt

From its humble beginning as a place where people would pay $5 to get a funny video, Fiverr has grown into the world’s largest marketplace for digital services. Along the way, our frontend architecture has had to evolve as well - with technologies changing at a rapid pace and frontend developers in general always wanting to work with the latest, shiniest thing, not being adaptable to the environment around you can easily lead you down a road where your stack can’t support your needs & where you’re constantly playing catch-up to whatever it is everyone else is doing. In this talk, I’ll give an overview of the FE path that Fiverr took — where we started, what we’re currently doing and where we’re (hopefully) going.

Angular js - 10 reasons to choose angularjs

Nir Kaufman

Creating BananaJS with Angular 2, Angular CLI, and Material Design

Tracy Lee

The document is a presentation slide deck about building applications with Angular 2 and Angular CLI. It discusses configuring Materialize CSS, generating components, deploying to Firebase, using template-driven forms, and the new Angular router. The presentation provides steps to create an Angular CLI project, add Materialize CSS, generate components, and deploy the application to Firebase. It also lists additional learning resources and community members that can provide help.

Getting started with Angular CLI

Sasha Vinčić

This document provides an overview of the Angular CLI (command line interface), which is a tool that helps generate and maintain Angular applications. It discusses how to create a new project, run it locally, run tests, and generate components, services, and other code artifacts using the CLI commands like ng new, ng serve, ng test, and ng generate. It also covers installing third party libraries, building the app for production, and some other advanced features of the CLI.

Instant app Intro

Jintin Lin

Instant App allows users to try out app features without installing the full app. It works by splitting an app into modules and only downloading code needed for specific features via URLs. Developers can create multiple feature modules that link to a shared base module. The base module contains common code and resources, while features contain specific screens and logic. Android Studio 3.0+ and the Instant Apps plugin help set this up. Features are limited to 4MB each and require HTTPS, app links, and code signing v2. This allows users to instantly experience an app before committing to a full download.

Creating an Angular 2 Angular CLI app in 15 Minutes Using MaterializeCSS & Fi...

Tracy Lee

Slides from my AngularJS Berlin talk. Creating an Angular 2 Angular CLI app in 15 Minutes Using MaterializeCSS & Firebase. Link to articles and starter repo on github listed. Github starter repo: https://github.com/ladyleet/ngtattoo-ngexample App on Firebase: https://ngtattooexample.firebaseapp.com/ Post: How to use materialize-css with Angular 2 https://medium.com/@ladyleet/using-materializecss-with-your-angular-2-angular-cli-app-2eb64b05a1d2#.28mbpguuv Post: Using Angular 2’s new router https://medium.com/@ladyleet/using-angular-2s-brand-new-router-a868fdc23503#.ubyiddj7n Post: Displaying data using ngFor https://medium.com/@ladyleet/displaying-data-with-the-ngfor-directive-in-your-angular-2-app-1b72cab1121e#.vpiznb2bi

What's hot (20)

Developing PWAs and Mobile Apps with Ionic, Angular, and JHipster - Devoxx Mo...

Testing Angular 2 Applications - Rich Web 2016

What's New in JHipsterLand - Devoxx Poland 2017

Front End Development for Back End Developers - UberConf 2017

The Ultimate Getting Started with Angular Workshop - Devoxx UK 2017

Front End Development for Back End Developers - Devoxx UK 2017

Bootiful Development with Spring Boot and Angular - Spring I/O 2017

Get Hip with Java Hipster - JavaOne 2017

Develop Hip APIs and Apps with Spring Boot and Angular - Connect.Tech 2017

The Tale of 2 CLIs - Ember-cli and Angular-cli

Front Ends for Back End Developers - Spring I/O 2017

What's This React Native Thing I Keep Hearing About?

Interoperability of components built with different frameworks

Angular vs React Smackdown - Devoxx BE 2017

Run Fast, Try Not to Break S**t

Angular js - 10 reasons to choose angularjs

Creating BananaJS with Angular 2, Angular CLI, and Material Design

Getting started with Angular CLI

Instant app Intro

Creating an Angular 2 Angular CLI app in 15 Minutes Using MaterializeCSS & Fi...

Similar to Building Cloud Native Progressive Web Apps with Angular and Spring Boot - Devoxx France 2017

Get Hip with JHipster - Colorado Springs Open Source User Group 2021

Matt Raible

JHipster is bad-ass. It's an Apache-licensed open source project that allows you to generate Spring Boot APIs and Angular (or React/Vue) apps. It has a vibrant community and ecosystem with support for deploying to many cloud providers and using the latest DevOps buzzwords, like Docker and K8s. This session will show you JHipster, why it's cool, and show you how to create an app with it. JHipster 7 Demo: https://www.youtube.com/watch?v=6lf64CctDAQ JHipster 7 Tutorial: https://github.com/mraible/jhipster7-demo#readme

JavaEE Microservices -the Payara Way

Payara

Front-end for Java developers Devoxx France 2018

Deepu K Sasidharan

This document summarizes a presentation given by Deepu K Sasidharan of XebiaLabs at DevoxxFR 2018 about frontend options for Java developers. It discusses why many Java developers dislike frontend work, myths about the frontend landscape, and how to make Java developers enjoy JavaScript. It also provides a brief history of Angular, React, and Vue.js, highlights of the speaker's favorite and least favorite features of each, and recommendations for choosing a framework. The document concludes by discussing options for starting new projects with Angular and React using tools like the Angular CLI and Create React App, and introduces JHipster for generating full stack applications.

SQL Server 2016 JSON

Davide Mauri

You want JSON? You finally have JSON support within SQL Server! The much-asked-for, long-awaited feature is finally here! In this session, Davide will show how the JSON support works within SQL Server, what are the pros and cons, the capabilities and the limitations, and will also take a look at performance of JSON vs. an equivalent relational(ish) solution to solve the common “unknown-schema-upfront” and “I-wanna-be-flexible” problems.

Data Driven DevOps

Leon Stigter

DevОps is usually viewed from a traditional perspective of a collaboration of Dev, Ops, and QA, driven by the change in Culture, People, and Process. But how do you know where you stand and where to move? As in almost any field, data and metrics give you the gauges and instruments. In this talk, we’ll talk about the key measurements for the DevOps transformation process and provide you with 3 metrics you can start measuring tomorrow.

Spring Boot APIs and Angular Apps: Get Hip with JHipster! KCDC 2019

Matt Raible

JHipster is bad-ass. It's an Apache-licensed open source project that allows you to generate Spring Boot APIs and Angular (or React!) apps. It has a vibrant community and ecosystem with support for deploying to many cloud providers and using the latest DevOps buzzwords, like Docker and K8s. This session will show you JHipster, why it's cool, and show you how to create an app with it. * Demo Code: https://github.com/mraible/jhipster6-demo * JHipster + OIDC: https://developer.okta.com/blog/2019/04/04/java-11-java-12-jhipster-oidc * JHipster + Microservices: https://developer.okta.com/blog/2019/05/23/java-microservices-spring-cloud-config * JHipster + Ionic: https://developer.okta.com/blog/2019/06/24/ionic-4-angular-spring-boot-jhipster * JHipster + React Native: https://developer.okta.com/blog/2018/10/10/react-native-spring-boot-mobile-app

Rich text editing with Draft.js

Nikolaus Graf

CSS3: Are you experienced?

Denise Jacobs

The Modern Java Web Developer Bootcamp - Devoxx 2013

Matt Raible

HTML5, CSS3, JavaScript, jQuery, Angular JS, Bootstrap, Mobile, CoffeeScript, GitHub, functional programming, Page Speed, Apache, JSON with Jackson, caching, REST, Security, load testing, profiling, Wro4j, Heroku, Cloudbees, AWS. These are just some of the buzzwords that a Java web developer hears on a daily basis. This talk is designed to expose you to a plethora of technologies that you might've heard about, but haven't learned yet. We'll concentrate on the most important web developer skills, as well as UI tips and tricks to make you a better front-end engineer. Some of the most valuable engineers these days have front-end JS/CSS skills, as well as backend Java skills. This presentation is from the University session I delivered at Devoxx 2013, in Antwerp. http://devoxx.be/dv13-matt-raible.html?presId=3648

Going AOT: Everything you need to know about GraalVM for Java applications

Alina Yurenko

Web development - Developing Web as A Team

Muhammad Akbar Yasin

This document discusses developing a web application as a team. It outlines key roles like the system engineer, web programmer, and web designer. It also covers important aspects of web development like using frameworks, separating front-end and back-end development, and utilizing version control tools when collaborating as a team. The document emphasizes that while one can develop a website alone, teamwork is better, and web designers now need coding skills to build responsive designs for different devices.

Intro to Graph Databases

Lauren Hayward Schaefer

This document contains the slides from a presentation on graph databases given by Lauren Schaefer at Devoxx France. The presentation introduces graph databases and demonstrates how to model data as nodes and edges to create a graph, as well as how to perform common graph operations like traversing, creating, reading, updating and deleting nodes and edges using Gremlin queries. It also provides examples of using a graph database to build a recommendation engine. The slides include diagrams, code samples, and instructions for hands-on exercises.

Java REST API Comparison: Micronaut, Quarkus, and Spring Boot - jconf.dev 2020

Matt Raible

Matt Raible compares the Java web frameworks Micronaut, Quarkus, and Spring Boot for building REST APIs. He demonstrates how to quickly get started with each framework, secure APIs with OAuth 2.1 and JWTs, build Docker images, and go native with GraalVM. Performance tests show Quarkus has the fastest startup time while Spring Boot has the largest community support in areas like Stack Overflow questions, GitHub stars, and jobs on Indeed.

Get Hip with JHipster: Spring Boot + AngularJS + Bootstrap - Rich Web Experie...

Matt Raible

Building a modern web (or mobile) application requires a lot of tools, frameworks and techniques. This session shows how JHipster unites popular frameworks like AngularJS, Spring Boot and Bootstrap. Using Yeoman, a scaffolding tool for modern webapps, JHipster will generate a project for you and allow you to use Java 7 or 8, SQL or NoSQL databases, Spring profiles, Maven or Gradle, Grunt or Gulp.js, WebSockets and BrowserSync. It also supports a number of different authentication mechanisms: classic session-based auth, OAuth 2.0, or token-based authentication. For cloud deployments, JHipster includes out-of-the-box support for Cloud Foundry, Heroku and Openshift.

The New York Times: Moving to GraphQL

Scott Taylor

Scott Taylor gave a talk about the New York Times' experience moving to GraphQL. Some key points: 1. The NYT previously took a long time to replatform and vowed to never take as long again, but their current project is also taking a long time. 2. They are moving their datacenter apps to Google Cloud Platform and migrating their data pipeline. 3. Their GraphQL server is written in Scala and maintained by a team called Samizdat, while their frontend uses Relay Classic with React and is maintained by the Web Frameworks team. 4. They have experienced challenges with schema evolution, versioning, and pivots with their GraphQL implementation.

Spring Boot APIs and Angular PWAs: Get Hip with JHipster - PWX 2019

Matt Raible

Single Page Application Development with backbone.js and Simple.Web

Chris Canal

This document summarizes a presentation about developing single page applications using Backbone.js and Simple.Web. It discusses Backbone.js and its core components like models, views and routers. It also covers libraries that are commonly used with Backbone like Underscore, Handlebars and RequireJS. Finally, it provides an overview of Simple.Web, a SOLID-based REST framework that can be used with Backbone.js applications.

MongoDB World 2019: Look, Ma, No Servers! Serverless Application Development ...

MongoDB

This document summarizes a talk about serverless application development using MongoDB Stitch. The talk discusses what serverless and Stitch are, how to use Stitch's QueryAnywhere, Functions, and Triggers features, and how to deploy serverless code. Serverless applications can reduce infrastructure management, allow independent deployments, and only charge for resources used. MongoDB Stitch is a platform that allows building serverless applications using MongoDB as the database with features like serverless functions and mobile sync capabilities.

Look, Ma! No servers! Serverless application development with MongoDB Stitch

Lauren Hayward Schaefer

Serverless architectures are hot right now--and for a good reason. Managing servers can be time consuming and painful. We'll begin this talk by explaining what serverless really is. Then we'll dive into how you can use Stitch Functions and Stitch Triggers to rapidly build your next app. We'll wrap up with a discussion of the software development lifecycle (think DevOps!) for serverless apps. You'll leave feeling confident that you can leverage MongoDB's serverless capabilities to rapidly build your next app.

Using Javascript in today's world

Sudar Muthu

Similar to Building Cloud Native Progressive Web Apps with Angular and Spring Boot - Devoxx France 2017 (20)

Get Hip with JHipster - Colorado Springs Open Source User Group 2021

JavaEE Microservices -the Payara Way

Front-end for Java developers Devoxx France 2018

SQL Server 2016 JSON

Data Driven DevOps

Spring Boot APIs and Angular Apps: Get Hip with JHipster! KCDC 2019

Rich text editing with Draft.js

CSS3: Are you experienced?

The Modern Java Web Developer Bootcamp - Devoxx 2013

Going AOT: Everything you need to know about GraalVM for Java applications

Web development - Developing Web as A Team

Intro to Graph Databases

Java REST API Comparison: Micronaut, Quarkus, and Spring Boot - jconf.dev 2020

Get Hip with JHipster: Spring Boot + AngularJS + Bootstrap - Rich Web Experie...

The New York Times: Moving to GraphQL

Spring Boot APIs and Angular PWAs: Get Hip with JHipster - PWX 2019

Single Page Application Development with backbone.js and Simple.Web

MongoDB World 2019: Look, Ma, No Servers! Serverless Application Development ...

Look, Ma! No servers! Serverless application development with MongoDB Stitch

Using Javascript in today's world

More from Matt Raible

Keep Identities in Sync the SCIMple Way - ApacheCon NA 2022

Matt Raible

What if keeping your user stores in sync across domains was as simple as running "java -jar"? With Apache SCIMPle, it is! Apache SCIMple is a SCIM 2.0-compliant server powered by Spring Boot 3. You can run it standalone or embedded in your existing app. It exposes user management REST endpoints and handles the hassle of user synchronization for you. If your identity provider supports SCIM, use the simple way! GitHub example: https://github.com/mraible/okta-scim-spring-boot-example Demo script: https://github.com/mraible/okta-scim-spring-boot-example/blob/main/demo.adoc

Micro Frontends for Java Microservices - Belfast JUG 2022

Matt Raible

You've figured out how to split up your backend services into microservices and scale your teams to the moon, right? But what about the frontend? Are you still building monoliths for your UI? If so, you might want to check out micro frontends—basically extensions to the microservices pattern, where the concept is extended to the frontend. Find out how to package and deploy your microservices and their UIs in the same artifact, as well as make it possible to test and develop them independently. In this live session, Matt will show you how to build a microservices and micro frontends architecture using Angular, Spring Boot, and Spring Cloud. Related blog post: https://auth0.com/blog/micro-frontends-for-java-microservices GitHub repo: https://github.com/oktadev/auth0-micro-frontends-jhipster-example

Micro Frontends for Java Microservices - Dublin JUG 2022

Matt Raible

The document discusses micro frontends for Java microservices. It provides an overview of microservices and frameworks like Spring and JHipster that can be used to develop microservices in Java. It then introduces the concept of micro frontends as an architecture for microservice applications and demonstrates how to build a sample application with micro frontends using JHipster. It also covers securing microservices with OAuth 2.1 and shows a live demo of creating and running microservice applications with JHipster.

Micro Frontends for Java Microservices - Cork JUG 2022

Matt Raible

Comparing Native Java REST API Frameworks - Seattle JUG 2022

Matt Raible

Use Spring Boot! No, use Micronaut!! Nooooo, Quarkus is the best!!! What about Helidon? There are a lot of developers praising the hottest, and fastest, Java REST frameworks: Micronaut, Quarkus, Spring Boot, and Helidon. In this session, you'll learn how to do the following with each framework: ✅ Build a REST API ✅ Secure your API with OAuth 2.0 ✅ Optimize for production with Docker and GraalVM I'll also share some performance numbers and pretty graphs to compare community metrics. Related blog post: https://developer.okta.com/blog/2021/06/18/native-java-framework-comparison Helidon companion post: https://developer.okta.com/blog/2022/01/06/native-java-helidon GitHub repo: https://github.com/oktadev/native-java-examples

Reactive Java Microservices with Spring Boot and JHipster - Spring I/O 2022

Matt Raible

Microservice architectures are all the rage in JavaLand. They allow teams to develop services independently and deploy autonomously. Why microservices? IF you are developing a large/complex application AND you need to deliver it rapidly, frequently, and reliably over a long period of time THEN the Microservice Architecture is often a good choice. Reactive architectures are becoming increasingly popular for organizations that need to do more, with less hardware. Reactive programming allows you to build systems that are resilient to high load. In this session, I'll show you how to use JHipster to create a reactive microservices architecture with Spring Boot, Spring Cloud, Keycloak, and run it all in Docker. You will leave with the know-how to create your own resilient apps! Related blog post: https://developer.okta.com/blog/2021/01/20/reactive-java-microservices YouTube demo: https://youtu.be/clkEUHWT9-M GitHub repo: https://github.com/oktadev/java-microservices-examples/tree/main/reactive-jhipster

Comparing Native Java REST API Frameworks - Devoxx France 2022

Matt Raible

Lock That Sh*t Down! Auth Security Patterns for Apps, APIs, and Infra - Devne...

Matt Raible

In this session, you'll learn about recommended patterns for securing your backend APIs, the infrastructure they run on, and your SPAs and mobile apps. The world is no longer a place where you just need to secure your apps’ UI. You need to pay attention to your dependency pipeline and open-source frameworks, too. Once you have the app built, with secure-by-design code, what about the cloud it runs on? Are the servers secure? What about the accounts you use to access them? If you lock all that sh*t down, how do you codify your solution so you can transport it cloud-to-cloud, or back to on-premises? This session will explore these concepts and many more!

Native Java with Spring Boot and JHipster - Garden State JUG 2021

Matt Raible

Do you want to deploy your Spring Boot apps in a serverless environment and have them start up in milliseconds? Of course, you do! In this talk, Josh Long and Matt Raible will introduce you to Spring Native. They'll teach you all about how it can compile Spring Boot apps into native binaries that start faster than a speeding bullet! You'll learn about native testing support with JUnit 5 and the pros and cons of native vs JVM deployments. This talk will also highlight a customer, the JHipster project. JHipster generates Spring Boot-based monoliths and microservices. You'll learn about the project's experience with Spring Boot, Spring Cloud, Spring WebFlux, and Spring Native. It ain't easy being a Java Hipster, but the Spring ecosystem does simplify the process quite a bit. Recording on YouTube: https://youtu.be/k6nBB8FOmQ8 Examples on GitHub: https://github.com/mraible/spring-native-examples Writeup on LinkedIn: https://www.linkedin.com/pulse/jhipster-works-spring-native-part-2-matt-raible/

Java REST API Framework Comparison - PWX 2021

Matt Raible

Use Spring Boot! No, use Micronaut!! Nooooo, Quarkus is the best!!! There's a lot of developers praising the hottest, and fastest, Java REST frameworks: Micronaut, Quarkus, and Spring Boot. In this session, you'll learn how to do the following with each framework: ✅ Build a REST API ✅ Secure your API with OAuth 2.0 ✅ Optimize for production with Docker and GraalVM I'll also share some performance numbers and pretty graphs to compare community metrics. Related blog post: https://developer.okta.com/blog/2021/06/18/native-java-framework-comparison

Web App Security for Java Developers - PWX 2021

Matt Raible

Web app security is not just authentication and authorization. It's also the things you do to protect your web app from attackers with their XSS (cross-site scripting), SQL injection, DoS/DDoS attacks, and CSRF (cross-site request forgery), to name a few. Web app security is a central component of any web-based business. The internet exposes web apps to attacks from different locations and various levels of scale and complexity. Web application security deals specifically with the security surrounding websites, web applications, and web services such as APIs. In this presentation, you'll learn seven ways to better web app security, using Spring Security for code samples. You'll also see some quick demos of Spring Boot, Angular, and JHipster with Keycloak, Auth0, and Okta.

Mobile App Development with Ionic, React Native, and JHipster - Connect.Tech ...

Matt Raible

Mobile development offers a lot of options. To develop native apps, you can use Java or Kotlin on Android. On iOS, you can use Objective C or Swift. There are other options, too. You can build hybrid mobile apps and Progressive Web Apps (PWAs). Hybrid mobile apps are those created with web technologies (HTML, JavaScript, and CSS) that look like native apps. PWAs have the ability to work offline and act like mobile apps. In this talk, we'll explore a few different mobile technologies: PWAs, React Native, and Ionic (with Angular). You'll walk away with knowledge of how to build mobile + Spring Boot apps in minutes with JHipster. * GitHub repo: https://github.com/mraible/mobile-jhipster * Demo script: https://github.com/mraible/mobile-jhipster/blob/main/demo.adoc

Lock That Shit Down! Auth Security Patterns for Apps, APIs, and Infra - Joker...

Matt Raible

Web App Security for Java Developers - UberConf 2021

Matt Raible

Java REST API Framework Comparison - UberConf 2021

Matt Raible

Native Java with Spring Boot and JHipster - SF JUG 2021

Matt Raible

Do you want to deploy your Spring Boot apps in a serverless environment and have them start up in milliseconds? Of course, you do! In this talk, Josh Long and Matt Raible will introduce you to Spring Native. They'll teach you all about how it can compile Spring Boot apps into native binaries that start faster than a speeding bullet! You'll learn about native testing support with JUnit 5 and the pros and cons of native vs JVM deployments. This talk will also highlight a customer, the JHipster project. JHipster generates Spring Boot-based monoliths and microservices. You'll learn about the project's experience with Spring Boot, Spring Cloud, Spring WebFlux, and Spring Native. It ain't easy being a Java Hipster, but the Spring ecosystem does simplify the process quite a bit. Recording on YouTube: https://youtu.be/F9oydL_MndA Examples on GitHub: https://github.com/mraible/spring-native-examples Writeup on LinkedIn: https://www.linkedin.com/pulse/jhipster-works-spring-native-matt-raible/

Lock That Shit Down! Auth Security Patterns for Apps, APIs, and Infra - Sprin...

Matt Raible

In this session, you'll learn about recommended patterns for securing your backend APIs, the infrastructure they run on, and your SPAs and mobile apps. The world is no longer a place where you just need to secure your apps’ UI. You need to pay attention to your dependency pipeline and open source frameworks, too. Once you have the app built, with secure-by-design code, what about the cloud it runs on? Are the servers secure? What about the accounts you use to access them? If you lock all that sh*t down, how do you codify your solution so you can transport it cloud-to-cloud, or back to on-premises? This session will explore these concepts and many more!

Reactive Java Microservices with Spring Boot and JHipster - Denver JUG 2021

Matt Raible

Microservice architectures are all the rage in JavaLand. They allow teams to develop services independently and deploy autonomously. Why microservices? IF you are developing a large/complex application AND you need to deliver it rapidly, frequently, and reliably over a long period of time THEN the Microservice Architecture is often a good choice Reactive architectures are becoming increasingly popular for organizations that need to do more, with less hardware. Reactive programming allows you to build systems that are resilient to high loads. In this session, I'll show you how to use JHipster to create a reactive microservices architecture with Spring Boot, Spring Cloud, Keycloak, and run it all in Docker. You will leave with the know-how to create your own resilient apps! Related blog post: https://developer.okta.com/blog/2021/01/20/reactive-java-microservices YouTube demo: https://youtu.be/clkEUHWT9-M YouTube recording: https://youtu.be/8OuZMFyh0xE GitHub repo: https://github.com/oktadev/java-microservices-examples/tree/main/reactive-jhipster

JHipster and Okta - JHipster Virtual Meetup December 2020

Matt Raible

YouTube video: https://www.youtube.com/watch?v=ym-OPn4e_nQ When I first started working at Okta, I refactored JHipster's OAuth support to move from authentication on the client to the server, leveraging Spring Security. This allowed for easier client integration since we didn't need to worry about finding an OIDC client for each frontend framework. Fast forward four years and JHipster's OAuth 2.0 and OIDC support is first-class! It uses Keycloak in a Docker container by default, but it's easy to switch to another identity provider (IdP) thanks to Spring Boot. Other blueprints like Micronaut, Quarkus, Node.js, and .NET support OAuth and OIDC too! This presentation explains what OAuth 2.0 and OIDC is, gives an overview of JHipster’s OAuth implementation, and provides three quick demos with Keycloak, the Okta CLI, and Heroku. See https://developer.okta.com/blog/tags/jhipster for Okta + JHipster tutorials and screencasts! 邏 You also might enjoy my What the Heck is OAuth? blog post: https://developer.okta.com/blog/2017/06/21/what-the-heck-is-oauth

Security Patterns for Microservice Architectures - SpringOne 2020

Matt Raible

Are you securing your microservice architectures by hiding them behind a firewall? That works, but there are better ways to do it. This presentation recommends 11 patterns to secure microservice architectures. 1. Be Secure by Design 2. Scan Dependencies 3. Use HTTPS Everywhere 4. Use Access and Identity Tokens 5. Encrypt and Protect Secrets 6. Verify Security with Delivery Pipelines 7. Slow Down Attackers 8. Use Docker Rootless Mode 9. Use Time-Based Security 10. Scan Docker and Kubernetes Configuration for Vulnerabilities 11. Know Your Cloud and Cluster Security Blog post: https://developer.okta.com/blog/2020/03/23/microservice-security-patterns

More from Matt Raible (20)

Keep Identities in Sync the SCIMple Way - ApacheCon NA 2022

Micro Frontends for Java Microservices - Belfast JUG 2022

Micro Frontends for Java Microservices - Dublin JUG 2022

Micro Frontends for Java Microservices - Cork JUG 2022

Comparing Native Java REST API Frameworks - Seattle JUG 2022

Reactive Java Microservices with Spring Boot and JHipster - Spring I/O 2022

Comparing Native Java REST API Frameworks - Devoxx France 2022

Lock That Sh*t Down! Auth Security Patterns for Apps, APIs, and Infra - Devne...

Native Java with Spring Boot and JHipster - Garden State JUG 2021

Java REST API Framework Comparison - PWX 2021

Web App Security for Java Developers - PWX 2021

Mobile App Development with Ionic, React Native, and JHipster - Connect.Tech ...

Lock That Shit Down! Auth Security Patterns for Apps, APIs, and Infra - Joker...

Web App Security for Java Developers - UberConf 2021

Java REST API Framework Comparison - UberConf 2021

Native Java with Spring Boot and JHipster - SF JUG 2021

Lock That Shit Down! Auth Security Patterns for Apps, APIs, and Infra - Sprin...

Reactive Java Microservices with Spring Boot and JHipster - Denver JUG 2021

JHipster and Okta - JHipster Virtual Meetup December 2020

Security Patterns for Microservice Architectures - SpringOne 2020

Recently uploaded

Comparison Table of DiskWarrior Alternatives.pdf

Andrey Yasko

Best Programming Language for Civil Engineers

Awais Yaseen

The integration of programming into civil engineering is transforming the industry. We can design complex infrastructure projects and analyse large datasets. Imagine revolutionizing the way we build our cities and infrastructure, all by the power of coding. Programming skills are no longer just a bonus—they’re a game changer in this era. Technology is revolutionizing civil engineering by integrating advanced tools and techniques. Programming allows for the automation of repetitive tasks, enhancing the accuracy of designs, simulations, and analyses. With the advent of artificial intelligence and machine learning, engineers can now predict structural behaviors under various conditions, optimize material usage, and improve project planning.

How RPA Help in the Transportation and Logistics Industry.pptx

SynapseIndia

Calgary MuleSoft Meetup APM and IDP .pptx

ishalveerrandhawa1

UiPath Community Day Kraków: Devs4Devs Conference

UiPathCommunity

We are honored to launch and host this event for our UiPath Polish Community, with the help of our partners - Proservartner! We certainly hope we have managed to spike your interest in the subjects to be presented and the incredible networking opportunities at hand, too! Check out our proposed agenda below 👇👇 08:30 ☕ Welcome coffee (30') 09:00 Opening note/ Intro to UiPath Community (10') Cristina Vidu, Global Manager, Marketing Community @UiPath Dawid Kot, Digital Transformation Lead @Proservartner 09:10 Cloud migration - Proservartner & DOVISTA case study (30') Marcin Drozdowski, Automation CoE Manager @DOVISTA Pawel Kamiński, RPA developer @DOVISTA Mikolaj Zielinski, UiPath MVP, Senior Solutions Engineer @Proservartner 09:40 From bottlenecks to breakthroughs: Citizen Development in action (25') Pawel Poplawski, Director, Improvement and Automation @McCormick & Company Michał Cieślak, Senior Manager, Automation Programs @McCormick & Company 10:05 Next-level bots: API integration in UiPath Studio (30') Mikolaj Zielinski, UiPath MVP, Senior Solutions Engineer @Proservartner 10:35 ☕ Coffee Break (15') 10:50 Document Understanding with my RPA Companion (45') Ewa Gruszka, Enterprise Sales Specialist, AI & ML @UiPath 11:35 Power up your Robots: GenAI and GPT in REFramework (45') Krzysztof Karaszewski, Global RPA Product Manager 12:20 🍕 Lunch Break (1hr) 13:20 From Concept to Quality: UiPath Test Suite for AI-powered Knowledge Bots (30') Kamil Miśko, UiPath MVP, Senior RPA Developer @Zurich Insurance 13:50 Communications Mining - focus on AI capabilities (30') Thomasz Wierzbicki, Business Analyst @Office Samurai 14:20 Polish MVP panel: Insights on MVP award achievements and career profiling

20240702 QFM021 Machine Intelligence Reading List June 2024

Matthew Sinclair

The Rise of Supernetwork Data Intensive Computing

Larry Smarr

Details of description part II: Describing images in practice - Tech Forum 2024

BookNet Canada

This presentation explores the practical application of image description techniques. Familiar guidelines will be demonstrated in practice, and descriptions will be developed “live”! If you have learned a lot about the theory of image description techniques but want to feel more confident putting them into practice, this is the presentation for you. There will be useful, actionable information for everyone, whether you are working with authors, colleagues, alone, or leveraging AI as a collaborator. Link to presentation recording and transcript: https://bnctechforum.ca/sessions/details-of-description-part-ii-describing-images-in-practice/ Presented by BookNet Canada on June 25, 2024, with support from the Department of Canadian Heritage.

Choose our Linux Web Hosting for a seamless and successful online presence

rajancomputerfbd

Advanced Techniques for Cyber Security Analysis and Anomaly Detection

Bert Blevins

Cybersecurity is a major concern in today's connected digital world. Threats to organizations are constantly evolving and have the potential to compromise sensitive information, disrupt operations, and lead to significant financial losses. Traditional cybersecurity techniques often fall short against modern attackers. Therefore, advanced techniques for cyber security analysis and anomaly detection are essential for protecting digital assets. This blog explores these cutting-edge methods, providing a comprehensive overview of their application and importance.

How Social Media Hackers Help You to See Your Wife's Message.pdf

HackersList

Cookies program to display the information though cookie creation

shanthidl1

INDIAN AIR FORCE FIGHTER PLANES LIST.pdf

jackson110191

Coordinate Systems in FME 101 - Webinar Slides

Safe Software

If you’ve ever had to analyze a map or GPS data, chances are you’ve encountered and even worked with coordinate systems. As historical data continually updates through GPS, understanding coordinate systems is increasingly crucial. However, not everyone knows why they exist or how to effectively use them for data-driven insights. During this webinar, you’ll learn exactly what coordinate systems are and how you can use FME to maintain and transform your data’s coordinate systems in an easy-to-digest way, accurately representing the geographical space that it exists within. During this webinar, you will have the chance to: - Enhance Your Understanding: Gain a clear overview of what coordinate systems are and their value - Learn Practical Applications: Why we need datams and projections, plus units between coordinate systems - Maximize with FME: Understand how FME handles coordinate systems, including a brief summary of the 3 main reprojectors - Custom Coordinate Systems: Learn how to work with FME and coordinate systems beyond what is natively supported - Look Ahead: Gain insights into where FME is headed with coordinate systems in the future Don’t miss the opportunity to improve the value you receive from your coordinate system data, ultimately allowing you to streamline your data analysis and maximize your time. See you there!

Recent Advancements in the NIST-JARVIS Infrastructure

KAMAL CHOUDHARY

BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf

Neo4j

Presented at Gartner Data & Analytics, London Maty 2024. BT Group has used the Neo4j Graph Database to enable impressive digital transformation programs over the last 6 years. By re-imagining their operational support systems to adopt self-serve and data lead principles they have substantially reduced the number of applications and complexity of their operations. The result has been a substantial reduction in risk and costs while improving time to value, innovation, and process automation. Join this session to hear their story, the lessons they learned along the way and how their future innovation plans include the exploration of uses of EKG + Generative AI.

The Increasing Use of the National Research Platform by the CSU Campuses

Larry Smarr

論文紹介：A Systematic Survey of Prompt Engineering on Vision-Language Foundation ...

Toru Tamaki

[Talk] Moving Beyond Spaghetti Infrastructure [AOTB] 2024-07-04.pdf

Kief Morris

20240704 QFM023 Engineering Leadership Reading List June 2024

Matthew Sinclair

Recently uploaded (20)

Comparison Table of DiskWarrior Alternatives.pdf

Best Programming Language for Civil Engineers

How RPA Help in the Transportation and Logistics Industry.pptx

Calgary MuleSoft Meetup APM and IDP .pptx

UiPath Community Day Kraków: Devs4Devs Conference

20240702 QFM021 Machine Intelligence Reading List June 2024

The Rise of Supernetwork Data Intensive Computing

Details of description part II: Describing images in practice - Tech Forum 2024

Choose our Linux Web Hosting for a seamless and successful online presence

Advanced Techniques for Cyber Security Analysis and Anomaly Detection

How Social Media Hackers Help You to See Your Wife's Message.pdf

Cookies program to display the information though cookie creation

INDIAN AIR FORCE FIGHTER PLANES LIST.pdf

Coordinate Systems in FME 101 - Webinar Slides

Recent Advancements in the NIST-JARVIS Infrastructure

BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf

The Increasing Use of the National Research Platform by the CSU Campuses

論文紹介：A Systematic Survey of Prompt Engineering on Vision-Language Foundation ...

[Talk] Moving Beyond Spaghetti Infrastructure [AOTB] 2024-07-04.pdf

20240704 QFM023 Engineering Leadership Reading List June 2024

Building Cloud Native Progressive Web Apps with Angular and Spring Boot - Devoxx France 2017

1. #D Cloud Native PWAs  Matt Raible & Josh Long  @mraible @starbuxman photo by: https://www.ﬂickr.com/photos/theaucitron/5810163712#DevoxxFR

2. About You Do you like Spring? Do you like JavaScript? TypeScript? Anyone using Angular? P.W.A.? Why are you here? #DevoxxFR

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

7. Authentication Standards #DevoxxFR

8. • http://cloudnativejava.io • @starbuxman • josh@joshlong.com • Java Champion • open-source contributor   (Spring Boot, Spring Cloud, Spring Integration, Vaadin, Activiti, etc etc) the Spring Developer Advocate Josh Long (⿓龍之春, ⻰龙之春, जोश)

9. #DevoxxFR

10. #DevoxxFR

11. Live Coding with Josh #DevoxxFR

12. start.spring.io

14. #DevoxxFR

16. https://xkcd.com/323/ “Ballmer Peak” #DevoxxFR

17. Live Coding with Josh #DevoxxFR

18. “Beer Client”

19. Live Coding with Josh #DevoxxFR

24. “In heaven there is no beer. That's why we drink it here and when we're gone from here, our friends will be drinking all our beer!” — Art Walunas

25. Fin #DevoxxFR

26. What about the client?

27. Merci ! https://github.com/joshlong/cloud-native-pwas Josh Long & Matt Raible  @starbuxman @mraible

28. #D Cloud Native PWAs - Part Deux  Matt Raible & Josh Long  @mraible @starbuxman photo by: https://www.ﬂickr.com/photos/theaucitron/5810163712#DevoxxFR

29. #DevoxxFR

32. 2007

34. #DevoxxFR

35. “We’ve failed on mobile” — Alex Russell https://youtu.be/K1SFnrf4jZo

36. Mobile Hates You! How to ﬁght back: Implement PRPL Get a ~$150-200 unlocked Android (e.g. Moto G4) Use chrome://inspect && chrome://inspect?tracing Lighthouse DevTools Network & CPU Throttling

37. The PRPL Pattern Push Render Pre-cache Lazy-load

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

39. Progressive Web Apps

40. Live Coding with Matt #DevoxxFR

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

44. #DevoxxFR

46. https://ﬂic.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 Mobile Toolkit   Workshop

47. JHipster jhipster.github.io #DevoxxFR

48. Thanks! https://github.com/mraible/cloud-native-pwas Matt Raible & Josh Long  @mraible @starbuxman http://bit.ly/sp-boot-pwas

Building Cloud Native Progressive Web Apps with Angular and Spring Boot - Devoxx France 2017

More Related Content

What's hot

What's hot (20)

Similar to Building Cloud Native Progressive Web Apps with Angular and Spring Boot - Devoxx France 2017

Similar to Building Cloud Native Progressive Web Apps with Angular and Spring Boot - Devoxx France 2017 (20)

More from Matt Raible

More from Matt Raible (20)

Recently uploaded

Recently uploaded (20)

Building Cloud Native Progressive Web Apps with Angular and Spring Boot - Devoxx France 2017