How to Win at UI Development in the World of Microservices - THAT Conference 2019

•

0 likes•260 views

You've figured out how to split up your backend services into microservices and scale your teams to the moon! But what about the front-end? Are you still building monoliths for your UI? This session will talk about the history of web frameworks, the microservices explosion, and techniques + frameworks for complementing your microservices with micro frontends. It'll include developer stories from folks implementing micro frontends and recommendations for learning more about them.

How to Win at UI Development in the World of Microservices
August 7, 2019
Matt Raible | @mraible
Photo by Matthew Sullivan flickr.com/photos/shoebappa/2186734172
#THATConference

How to Win at UI Development in the World of Microservices - THAT Conference 2019

Blogger on raibledesigns.com and

developer.okta.com/blog
Web Developer and Java Champion
Father, Husband, Skier, Mountain
Biker, Whitewater Rafter
Open Source Connoisseur
Hi, I’m Matt Raible!
Bus Lover
Okta Developer Advocate

Today’s Agenda
History of Web Frameworks
The Microservices Explosion
UI Development in a
Microservices World 🌎
Real Developer Stories
How to Win 🏆
Photo by Glyn Lowe PhotoWorks ﬂickr.com/photos/glynlowe/10039742285

The Microservices Explosion 💥
https://martinfowler.com/articles/microservices.html

The Microservices Explosion 💥
Conway's Law in action Service boundaries reinforced by team boundaries

UI Development in a Microservices World 🌎
https://micro-frontends.org

State of the Art in Java + JavaScript
https://www.jhipster.tech

JHipster 6 Microservices UI Overview
https://youtu.be/-QCuWgLQmdg

⚡Micro Frontends
https://martinfowler.com/articles/micro-frontends.html

⚡Micro Frontends
https://micro-frontends.org

Techniques
Web components as the target output
Custom elements to create web components
DOM Events to communicate between frontends
Server-side rendering and SSI (server-side includes) or ESI
(edge-side includes)
CDNs and cache-busting as a deployment mechanism

Frameworks for Micro Frontends
Project Mosaic: https://www.mosaic9.org
Single-spa: https://single-spa.js.org
Demo: https://single-spa.surge.sh

Framework Usage
https://twitter.com/mraible/status/1156263974649778176

Other Companies using Micro Frontends
https://medium.com/@tomsoderlund/micro-frontends-a-microservice-approach-to-
front-end-web-development-f325ebdadc16

How to Win at UI Dev with Microservices
Use a monolith with one
framework, components, and
lazy-loading
Use micro frontends that
allows any framework,
leveraging web components

Learn More
https://micro-frontends.org
https://martinfowler.com/articles/micro-frontends.html
CaSE Podcast - https://www.case-podcast.org
Micro Frontends with Gustaf Nilsson Kotte
Web Frontend with Lucas Dohmen
ThoughtWorks Podcast: What’s so cool about micro frontends?

Make some $$ 🤑
https://github.com/jhipster/generator-jhipster/issues/10189

Thanks!
Keep in Touch
raibledesigns.com
@mraible
Presentations
speakerdeck.com/mraible
Code
github.com/oktadeveloper
developer.okta.com

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

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

Front End Development for Backend Developers - GIDS 2019

Matt Raible

Mobile Development with Ionic, React Native, and JHipster - AllTheTalks 2020

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: Ionic 4 (with Angular), React Native, and PWAs. 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/master/demo.adoc

Mobile Development with Ionic, React Native, and JHipster - ACGNJ Java Users ...

Matt Raible

This document summarizes Matt Raible's presentation on mobile development with Ionic, React Native, and JHipster. It introduces JHipster and how it can be used to generate Spring Boot and Angular/React applications. It then discusses using JHipster to create progressive web apps and how Ignite CLI and Ionic can be used to generate mobile apps from JHipster projects. The presentation concludes by covering JHipster's roadmap and encouraging attendees to try out JHipster.

Seven Simple Reasons to Use AppFuse

Matt Raible

AppFuse is an open source project/application that uses best-of-breed Java open source tools to help you develop web applications quickly and efficiently. Not only does it provide documentation on how to develop light-weight POJO-based applications, it includes features that many applications need out-of-the-box: authentication and authorization, remember me, password hint, skinnability, file upload, Ajax libraries, signup and SSL switching. This is one of the main features in AppFuse that separates it from the other "CRUD Generation" frameworks like Ruby on Rails, Trails and Grails. AppFuse is already an application when you start using it, which means code examples are already in your project. Furthermore, because features already exist, the amount of boiler-plate code that most projects need will be eliminated. In this session, you will learn Seven Simple Reasons to Use AppFuse. If you don't use it to start your own projects, hopefully you will see that it provides much of the boiler-plate code that can be used in Java-based web applications. Since it's Apache Licensed, you're more than welcome to copy/paste any code from it into your own applications. Also see article published at: http://www.ibm.com/developerworks/java/library/j-appfuse/index.html

Front End Development for Back End Java Developers - Jfokus 2020

Matt Raible

The document is a presentation about front end development for back end Java developers. It discusses topics like JavaScript, TypeScript, build tools, CSS frameworks, front end performance, and progressive web apps. It also provides introductions and comparisons of popular JavaScript frameworks like Angular, React, and Vue. The presentation encourages attendees to learn new front end skills and try building something with a front end framework.

Comparing JVM Web Frameworks - Rich Web Experience 2010

Matt Raible

The document discusses using Angular Schematics to simplify development tasks. It covers creating a basic schematic, adding templates, testing schematics, publishing to NPM, and integrating with Angular CLI. Schematics can generate code and files and are useful for tasks like authentication, routing, and application shell generation. The document provides examples of building schematics that generate components and applications.

Bootiful Development with Spring Boot and React - UberConf 2018

Matt Raible

To simplify development and deployment, you want everything in the same artifact, so you put your React app “inside” your Spring Boot app, right? But what if you could create your React 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 session shows how to develop with Java 8, Spring Boot, React, and TypeScript. You’ll learn how to create REST endpoints with Spring MVC, configure Spring Boot to allow CORS, and create a React app to display its data. If time allows we’ll cover authentication with OpenID Connect and deployment to Cloud Foundry. Blog: https://developer.okta.com/blog/2017/12/06/bootiful-development-with-spring-boot-and-react GitHub: https://github.com/oktadeveloper/spring-boot-react-example

SF JUG - GWT Can Help You Create Amazing Apps - 2009-10-13

Fred Sauer

Front End Development for Back End Java Developers - NYJavaSIG 2019

Matt Raible

Hybrid Apps (Native + Web) via QtWebKit

Ariya Hidayat

This document discusses hybrid apps that combine native and web technologies using QtWebKit. It provides an overview of QtWebKit and how it can be used to embed web content in native apps. It describes various tools, technologies and frameworks that can be used to build hybrid apps, including JavaScript, CSS, Canvas, WebGL, and tools for debugging, testing, and designing hybrid apps. It concludes that web technologies are advancing rapidly and hybrid approaches can help migration, while tools still need to catch up to support building high quality hybrid apps.

Clojure Web Development

Hong Jiang

This document discusses Clojure web development and describes a web-based project management system called Trakr that was created using Clojure. Trakr uses a MongoDB database and has a modern friendly UI. The architecture involves a Clojure HTTP server with a Ring middleware pipeline and Compojure routing to map requests to handlers. Testing is done with clojure.test and clojure.contrib.mock. Performance is around 70ms average latency.

Spark IT 2011 - Java EE 6 Workshop

Arun Gupta

Os Johnson

oscon2007

The document discusses the capabilities of the Spring Framework component model and how it can be used to add functionality to POJO-based applications. It provides an overview of the Spring component model, services, patterns, integration capabilities, and portability. It describes how technologies like dependency injection and AOP enable simple POJO-based programming. It highlights several value adds provided out of the box by Spring, including exporting remote endpoints, JMX support, auditing with aspects, and user extension points. It also discusses XML configuration extensions introduced in Spring 2.0 for higher level abstraction and grouping related beans.

Spark IT 2011 - Developing RESTful Web services with JAX-RS

Arun Gupta

JAX-RS is a Java API for building RESTful web services. It uses annotations to simplify development of RESTful resources and defines standards for request/response formats and links between resources. JAX-RS services can be deployed to Java EE servers or standalone using implementations like Jersey. The future of JAX-RS includes enhancements to the client API, support for hypermedia formats, and tighter integration with Java EE technologies.

Java Web Application Security - UberConf 2011

Matt Raible

During this presentation, I demonstrate how to implement authentication in your Java web applications using good ol' Java EE Container Managed Authentication, Spring Security and Apache Shiro. You'll also learn how to secure your REST API with OAuth and lock it down with SSL. After learning how to develop authentication, I'll introduce you to pentest your app, as well as OWASP, the OWASP Top 10, its Testing Guide and its Code Review Guide. Much of this talk is contained in demos and tutorials, which are available on my blog at http://raibledesigns.com/rd/tags/security and http://youtube.com/mraible.

JAX-RS JavaOne Hyderabad, India 2011

Shreedhar Ganapathy

Front End Development for Back End Developers - vJUG24 2017

Matt Raible

Web App Security for Java Developers - UberConf 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 Okta.

Bootiful Development with Spring Boot and React - SpringOne 2017

Matt Raible

To simplify development and deployment, you want everything in the same artifact, so you put your React app “inside” your Spring Boot app, right? But what if you could create your React 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 session shows how to develop with Java 8, Spring Boot, React, and TypeScript. You’ll learn how to create REST endpoints with Spring MVC, configure Spring Boot to allow CORS, and create an React app to display its data. If time allows we’ll cover authentication with OpenID Connect and deployment to Cloud Foundry. Blog post: https://developer.okta.com/blog/2017/12/06/bootiful-development-with-spring-boot-and-react Demo app: https://github.com/oktadeveloper/spring-boot-react-example

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

Case Study: Migrating Hyperic from EJB to Spring from JBoss to Apache Tomcat

VMware Hyperic

Apache Roller, Acegi Security and Single Sign-on

Matt Raible

Acegi Security is quickly becoming a widely respected security framework for Java applications. Not only does this security framework solve many of the deficiencies of J2EE's security mechanisms, but it's also easy to implement and configure. This tutorial will help you learn more about Acegi Security, as well as how to integrate it into your web applications. The Roller Weblogger project (currently in Apache's incubator) uses Acegi Security for many of its features: authentication, password encryption, remember me and SSL switching. After learning about Roller and Acegi, you will see how to deploy Roller onto Tomcat and Geronimo. Following that, you will learn how to hook Roller/Acegi into Apache Directory Server for authentication. Finally, you will learn how to integrate Roller with a Single Sign-on System (Yale's Central Authentication Service).

JavaOne India 2011 - Running your Java EE 6 Apps in the Cloud

Arun Gupta

This document discusses running Java EE 6 applications in the cloud. It provides an overview of deploying Java EE 6 applications to various cloud platforms including Amazon Web Services, RightScale, Microsoft Azure, and Joyent. It also discusses the Java EE 7 specification and how it will further support cloud deployments with a focus on multi-tenancy and elasticity. Lastly, it outlines the GlassFish Server distributions for both open source and commercial use on private and public clouds.

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

Micro Frontends for Java Microservices - Cork 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

What's hot

Choosing a Java Web Framework

Will Iverson

A Gentle Introduction to Angular Schematics - Angular SF 2019

Matt Raible

A Gentle Introduction to Angular Schematics - Devoxx Belgium 2019

Matt Raible

Bootiful Development with Spring Boot and React - UberConf 2018

Matt Raible

SF JUG - GWT Can Help You Create Amazing Apps - 2009-10-13

Fred Sauer

Front End Development for Back End Java Developers - NYJavaSIG 2019

Matt Raible

Hybrid Apps (Native + Web) via QtWebKit

Ariya Hidayat

Clojure Web Development

Hong Jiang

Spark IT 2011 - Java EE 6 Workshop

Arun Gupta

Os Johnson

oscon2007

Spark IT 2011 - Developing RESTful Web services with JAX-RS

Arun Gupta

Java Web Application Security - UberConf 2011

Matt Raible

JAX-RS JavaOne Hyderabad, India 2011

Shreedhar Ganapathy

Front End Development for Back End Developers - vJUG24 2017

Matt Raible

Web App Security for Java Developers - UberConf 2021

Matt Raible

Bootiful Development with Spring Boot and React - SpringOne 2017

Matt Raible

To simplify development and deployment, you want everything in the same artifact, so you put your React app “inside” your Spring Boot app, right? But what if you could create your React 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 session shows how to develop with Java 8, Spring Boot, React, and TypeScript. You’ll learn how to create REST endpoints with Spring MVC, configure Spring Boot to allow CORS, and create an React app to display its data. If time allows we’ll cover authentication with OpenID Connect and deployment to Cloud Foundry. Blog post: https://developer.okta.com/blog/2017/12/06/bootiful-development-with-spring-boot-and-react Demo app: https://github.com/oktadeveloper/spring-boot-react-example

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

Matt Raible

Case Study: Migrating Hyperic from EJB to Spring from JBoss to Apache Tomcat

VMware Hyperic

Apache Roller, Acegi Security and Single Sign-on

Matt Raible

JavaOne India 2011 - Running your Java EE 6 Apps in the Cloud

Arun Gupta

What's hot (20)

Choosing a Java Web Framework

A Gentle Introduction to Angular Schematics - Angular SF 2019

A Gentle Introduction to Angular Schematics - Devoxx Belgium 2019

Bootiful Development with Spring Boot and React - UberConf 2018

SF JUG - GWT Can Help You Create Amazing Apps - 2009-10-13

Front End Development for Back End Java Developers - NYJavaSIG 2019

Hybrid Apps (Native + Web) via QtWebKit

Clojure Web Development

Spark IT 2011 - Java EE 6 Workshop

Os Johnson

Spark IT 2011 - Developing RESTful Web services with JAX-RS

Java Web Application Security - UberConf 2011

JAX-RS JavaOne Hyderabad, India 2011

Front End Development for Back End Developers - vJUG24 2017

Web App Security for Java Developers - UberConf 2021

Bootiful Development with Spring Boot and React - SpringOne 2017

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

Case Study: Migrating Hyperic from EJB to Spring from JBoss to Apache Tomcat

Apache Roller, Acegi Security and Single Sign-on

JavaOne India 2011 - Running your Java EE 6 Apps in the Cloud

Similar to How to Win at UI Development in the World of Microservices - THAT Conference 2019

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

Matt Raible

Micro Frontends for Java Microservices - Cork JUG 2022

Matt Raible

Parisjs fastvideoandimages

Doug Sillars

Doug Sillars discusses optimizing images and video delivery for fast loading on mobile. He provides 4 simple optimizations for images: adjusting quality, format, sizing through responsive images, and lazy loading. For video, he examines startup delays and how to balance network load through adaptive bitrate streaming. Proper preloading and avoiding 3rd party interference can improve video start. Tools like WebPageTest and ImageMagick help optimize and measure performance.

Waterford fast images

Doug Sillars

The document discusses optimizing images and video for fast delivery on websites. It provides tips for improving image quality, format, sizing and lazy loading. For video, it discusses optimizing startup time by preloading strategically and balancing network usage. Testing tools mentioned include WebPageTest, HttpArchive, ImageMagick and SSIM. The goal is to make images and video both beautiful and fast loading.

Beautiful and Fast Images

Doug Sillars

This document discusses optimizing images and video for fast delivery on mobile devices. It begins by outlining how delays in loading content can negatively impact users and business metrics. It then provides recommendations for optimizing four aspects of images: quality, format, sizing, and lazy loading. Specific techniques are presented for each along with data showing their real-world impact. Video delivery optimization is also covered, including strategies to improve startup times. The document concludes by stating that images and video can be both beautiful and fast with the right optimizations.

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 - Belfast JUG 2022

Matt Raible

Beautifully accessible

LeviMcGranahan

Keynote I

goodfriday

Bootiful Development with Spring Boot and Vue - Devnexus 2019

Matt Raible

You’re in love with Spring Boot, but you miss your old pal AngularJS? Don’t fear, Vue.js is here! Vue is very similar to AngularJS, but much more powerful, yet slim and light for PWAs. In this session, you’ll see how to build a Spring Boot API and secure it with Spring Security. You’ll also learn how to build a Vue.js PWA, all the while enjoying a bootiful hot-code-reload experience. Lots of live coding in this one! Additional information: * Blog post: http://bit.ly/boot-and-vue * GitHub repo: https://github.com/oktadeveloper/spring-boot-vue-example * YouTube demo: https://youtu.be/aBXmi-J4LQs

Predictability for the Web

Robert Nyman

This document discusses improving predictability for web developers. It describes challenges like cross-browser inconsistencies that make development difficult. The authors outline efforts by Chrome to address these issues, such as collaborating with other browsers, listening to developers, and minimizing breaking changes. Developers are encouraged to test new browser features, file bugs, and provide feedback to help continue enhancing predictability.

Welcome to IWMW 2010

lisbk

- The document is a slide presentation from the Institutional Web Management Workshop 2010 that provides an overview and history of the event as well as discussion of current challenges and the future. - It discusses how the IWMW event has been held annually since 1997 to provide a forum for UK higher education institutions to discuss web management best practices and innovations. - Recent budget cuts and changing priorities threaten the sustainability of the event, raising questions around reducing its length, making it virtual, or allowing commercial alternatives. The role of professional networks and adapting to change are emphasized.

Performance and User Experience for the Web of Tomorrow

WP Engine

JavaCro'14 - Going Digital with Java EE - Peter Pilgrim

HUJAK - Hrvatska udruga Java korisnika / Croatian Java User Association

It feels like we have building web sites and applications for centuries, doesn’t it? However, we know that this is so untrue, because the web is only 25 years old since Sir Tim Berner’s Lee great proposal at CERN. The impetus of online design and development has changed, we now talk about the Digital Worker, the Digital environment and we about building web applications and ecommerce applications that are user friendly and customer centric. So what has this all to with the humble Java application developer? The answer is everything. We must be explicit in the software that we write, lean and agile in the way we write, and whilst making sure the take full advantage of the underlying Java platform. In fact, because we have this magnificent Java Virtual Machine and open standards like Java EE, we can continue build quality, robust and sustainable software for all our stakeholders and business users. Introduction to Java EE 7 (brief) Personality requirements for the digital worker The absolute minimum toolchains for Java based digital worker Introducing Arquillian framework Overview of some essential features of Java EE 7

Understanding Microservices

vguhesan

The document provides an overview of microservices and their evolution from monolithic applications. It discusses how early applications were monolithic but difficult to scale. This led to enterprise Java applications with EJBs that improved scaling but introduced new issues. Later, containers and cloud computing allowed for easier deployment of loosely coupled components as microservices. The document outlines some common microservices patterns and tools used today, including service discovery, API gateways, and distributed tracing. It also discusses how languages like Java are addressing microservices with projects like Spring Boot, Micronaut, and GraalVM.

JavaCro 2014 Digital Development with Java EE and Java Platform

Peter Pilgrim

It feels like we have building web sites and applications for centuries, doesn't it? However, we know that this is so untrue, because the web is only 25 years old since Sir Tim Berner's Lee great proposal at CERN. The impetus of online design and development has changed, we now talk about the Digital Worker, the Digital environment and we about building web applications and ecommerce applications that are user friendly and customer centric. So what has this all to with the humble Java application developer? The answer is everything. We must be explicit in the software that we write, lean and agile in the way we write, and whilst making sure the take full advantage of the underlying Java platform. In fact, because we have this magnificent Java Virtual Machine and open standards like Java EE, we can continue build quality, robust and sustainable software for all our stakeholders and business users.

Responsive Images and Video

Jason Grigsby

Responsive Web Design & the state of the Web

Yiannis Konstantakopoulos

The document discusses responsive web design, which is an approach where design and development respond to the user's behavior and environment based on screen size, platform, and orientation. It involves flexible grids and layouts, images, and media queries to automatically adjust the website for different devices like laptops and iPads. The goal is for the website to have technology that automatically responds to the user's preferences as they switch devices.

Build (Web)VR with A-Frame (COSCUP 2019 Taipei)

Robert 'Bob' Reyes

This document provides an overview and introduction to building virtual reality (VR) experiences using WebVR and the A-Frame framework. It discusses: - What WebVR is and how it allows creating VR tools, standards, and experiences for the open web. - What A-Frame is and its features for building VR scenes in HTML such as being easy to learn, cross-platform support, performance optimizations, and a visual inspector. - Examples of VR experiences that have been built with A-Frame, Mozilla's work in mixed reality and VR including Firefox Reality, Spoke for creating 3D environments, and Unity WebVR assets.

Going Fast on the Mobile Web

Jason Grigsby

The document discusses how the mobile web is growing rapidly but many web developers are not optimizing their sites for mobile. It provides statistics on the growth of mobile phones and their usage. It then details tests the author conducted on various mobile browsers to analyze support for technologies like gzip compression and parallel HTTP requests. The author provides recommendations for optimizing sites for mobile like using gzip, minimizing files, caching aggressively, and limiting cookies. The document advocates for testing sites across mobile browsers due to variations in support.

Similar to How to Win at UI Development in the World of Microservices - THAT Conference 2019 (20)

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

Micro Frontends for Java Microservices - Cork JUG 2022

Parisjs fastvideoandimages

Waterford fast images

Beautiful and Fast Images

Micro Frontends for Java Microservices - Dublin JUG 2022

Micro Frontends for Java Microservices - Belfast JUG 2022

Beautifully accessible

Keynote I

Bootiful Development with Spring Boot and Vue - Devnexus 2019

Predictability for the Web

Welcome to IWMW 2010

Performance and User Experience for the Web of Tomorrow

JavaCro'14 - Going Digital with Java EE - Peter Pilgrim

Understanding Microservices

JavaCro 2014 Digital Development with Java EE and Java Platform

Responsive Images and Video

Responsive Web Design & the state of the Web

Build (Web)VR with A-Frame (COSCUP 2019 Taipei)

Going Fast on the Mobile Web

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

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/

Web App Security for Java Developers - PWX 2021

Matt Raible

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

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

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.

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

Security Patterns for Microservice Architectures - ADTMag Microservices & API...

Matt Raible

Microservices for the Masses with Spring Boot, JHipster, and OAuth - South We...

Matt Raible

The document summarizes a presentation about microservices using Spring Boot, JHipster, and OAuth. It includes an agenda that covers an introduction to microservices, developing microservices with JHipster, and deploying microservices to the cloud. It then describes demos of creating microservices using Spring Boot and Spring Cloud and consuming APIs using Feign clients in a gateway. Finally, it discusses JHipster's features for microservices and progressive web applications, as well as the JHipster roadmap.

Security Patterns for Microservice Architectures - London Java Community 2020

Matt Raible

Security Patterns for Microservice Architectures - Oktane20

Matt Raible

Matt Raible presented 11 security patterns for 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 configurations for vulnerabilities, and 11) know your cloud and cluster security. He discussed each pattern in detail and provided examples and recommendations for implementation.

More from Matt Raible (20)

Keep Identities in Sync the SCIMple Way - ApacheCon NA 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

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

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

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

Security Patterns for Microservice Architectures - SpringOne 2020

Security Patterns for Microservice Architectures - ADTMag Microservices & API...

Microservices for the Masses with Spring Boot, JHipster, and OAuth - South We...

Security Patterns for Microservice Architectures - London Java Community 2020

Security Patterns for Microservice Architectures - Oktane20

Recently uploaded

European Standard S1000D, an Unnecessary Expense to OEM.pptx

Digital Teacher

Artificial Intelligence (Complete Notes).pdf

Sarthak Sobti

How to Make a Living as a (ColdFusion) Freelancer?

Ortus Solutions, Corp

High-Class Call Girls In Chennai 📞7014168258 Available With Direct Cash Payme...

shoeb2926

Vip Call Girls Pune 😘 7023059433 😘 Escorts Service Available Pune

pooja sharman06

OpenChain Webinar - Open Source Due Diligence for M&A - 2024-06-17

Shane Coughlan

Manikonda Escorts ☎️ 8826483818 😊 24/7 Escort Service in Manikonda cash Pay@

nr802185

AllProjectsS24 of software engineering.pdf

Shahid464656

Premium Call Girls In Ahmedabad 💯Call Us 🔝 7426014248 🔝Independent Ahmedabad ...

Anita pandey

Extreme DDD Modelling Patterns - 2024 Devoxx Poland

Alberto Brandolini

Introductory Things Related to ERP Systems.pptx

Kanhasoft

Low Rate Call Girls Chennai ✔ 9079923931 ✔ Hi I Am Divya Vip Call Girl Servic...

finni singh$A17

❤️❤️Call Girls Greater Kailash 📞 9711199012 ❤️Vip Independent ❤️Delhi Escorts...

Komal rawat $V15

LIVE DEMO: CCX for CSPs, a drop-in DBaaS solution

Severalnines

🔥 Chennai Call Girls 👉 6350257716 👫 High Profile Call Girls Whatsapp Number ...

tinakumariji156

Call Girls in Varanasi || 7426014248 || Quick Booking at Affordable Price

vickythakur209464

Call Girls in Rajkot (7426014248) call me [🔝Rajkot🔝] Escort In Rajkot service...

vickythakur209464

Call Girls Goa 💯Call Us 🔝 7426014248 🔝 Independent Goa Escorts Service Available

sapnaanpad7

Independent Call Girls In Pune 💯Call Us 🔝 7426014248 🔝Independent Pune Escort...

jiyav969

Hot Call Girls In Ahmedabad ✔ 7737669865 ✔ Hi I Am Divya Vip Call Girl Servic...

anamika jain$A17

Recently uploaded (20)

European Standard S1000D, an Unnecessary Expense to OEM.pptx

Artificial Intelligence (Complete Notes).pdf

How to Make a Living as a (ColdFusion) Freelancer?

High-Class Call Girls In Chennai 📞7014168258 Available With Direct Cash Payme...

Vip Call Girls Pune 😘 7023059433 😘 Escorts Service Available Pune

OpenChain Webinar - Open Source Due Diligence for M&A - 2024-06-17

Manikonda Escorts ☎️ 8826483818 😊 24/7 Escort Service in Manikonda cash Pay@

AllProjectsS24 of software engineering.pdf

Premium Call Girls In Ahmedabad 💯Call Us 🔝 7426014248 🔝Independent Ahmedabad ...

Extreme DDD Modelling Patterns - 2024 Devoxx Poland

Introductory Things Related to ERP Systems.pptx

Low Rate Call Girls Chennai ✔ 9079923931 ✔ Hi I Am Divya Vip Call Girl Servic...

❤️❤️Call Girls Greater Kailash 📞 9711199012 ❤️Vip Independent ❤️Delhi Escorts...

LIVE DEMO: CCX for CSPs, a drop-in DBaaS solution

🔥 Chennai Call Girls 👉 6350257716 👫 High Profile Call Girls Whatsapp Number ...

Call Girls in Varanasi || 7426014248 || Quick Booking at Affordable Price

Call Girls in Rajkot (7426014248) call me [🔝Rajkot🔝] Escort In Rajkot service...

Call Girls Goa 💯Call Us 🔝 7426014248 🔝 Independent Goa Escorts Service Available

Independent Call Girls In Pune 💯Call Us 🔝 7426014248 🔝Independent Pune Escort...

Hot Call Girls In Ahmedabad ✔ 7737669865 ✔ Hi I Am Divya Vip Call Girl Servic...

How to Win at UI Development in the World of Microservices - THAT Conference 2019

1. How to Win at UI Development in the World of Microservices August 7, 2019 Matt Raible | @mraible Photo by Matthew Sullivan flickr.com/photos/shoebappa/2186734172 #THATConference

4. Blogger on raibledesigns.com and developer.okta.com/blog Web Developer and Java Champion Father, Husband, Skier, Mountain Biker, Whitewater Rafter Open Source Connoisseur Hi, I’m Matt Raible! Bus Lover Okta Developer Advocate

6. developer.okta.com

7. What About You?

8. Today’s Agenda History of Web Frameworks The Microservices Explosion UI Development in a Microservices World 🌎 Real Developer Stories How to Win 🏆 Photo by Glyn Lowe PhotoWorks ﬂickr.com/photos/glynlowe/10039742285

9. A Brief History of Web Frameworks

10. The Microservices Explosion 💥 https://martinfowler.com/articles/microservices.html

11. The Microservices Explosion 💥 Conway's Law in action Service boundaries reinforced by team boundaries

12. UI Development in a Microservices World 🌎 https://micro-frontends.org

13. State of the Art in Java + JavaScript https://www.jhipster.tech

14. JHipster 6 Microservices UI Overview https://youtu.be/-QCuWgLQmdg

15. ⚡Micro Frontends https://martinfowler.com/articles/micro-frontends.html

16. ⚡Micro Frontends https://micro-frontends.org

17. ⚡Micro Frontends https://micro-frontends.org

18. Techniques Web components as the target output Custom elements to create web components DOM Events to communicate between frontends Server-side rendering and SSI (server-side includes) or ESI (edge-side includes) CDNs and cache-busting as a deployment mechanism

19. Frameworks for Micro Frontends Project Mosaic: https://www.mosaic9.org Single-spa: https://single-spa.js.org Demo: https://single-spa.surge.sh

20. Framework Usage https://twitter.com/mraible/status/1156263974649778176

21. Real Developer Stories

22. Other Companies using Micro Frontends https://medium.com/@tomsoderlund/micro-frontends-a-microservice-approach-to- front-end-web-development-f325ebdadc16

23. How to Win at UI Dev with Microservices Use a monolith with one framework, components, and lazy-loading Use micro frontends that allows any framework, leveraging web components

24. Learn More https://micro-frontends.org https://martinfowler.com/articles/micro-frontends.html CaSE Podcast - https://www.case-podcast.org Micro Frontends with Gustaf Nilsson Kotte Web Frontend with Lucas Dohmen ThoughtWorks Podcast: What’s so cool about micro frontends?

25. Make some $$ 🤑 https://github.com/jhipster/generator-jhipster/issues/10189

26. developer.okta.com/blog @oktadev

27. Thanks! Keep in Touch raibledesigns.com @mraible Presentations speakerdeck.com/mraible Code github.com/oktadeveloper developer.okta.com

How to Win at UI Development in the World of Microservices - THAT Conference 2019

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to How to Win at UI Development in the World of Microservices - THAT Conference 2019

Similar to How to Win at UI Development in the World of Microservices - THAT Conference 2019 (20)

More from Matt Raible

More from Matt Raible (20)

Recently uploaded

Recently uploaded (20)

How to Win at UI Development in the World of Microservices - THAT Conference 2019