Single Page Apps in a Microservice Architecture
summary
Demonstrates concrete patterns: uses Micronaut for an API gateway with compile‑time generated HTTP clients, JWT token propagation for multi‑tenancy, and OpenAPI OpenAPI swagger generation; front end is a Vue.js SPA calling a gateway that proxies four services (gateway, inventory, auth, front end) in two live demos. Shows webpack Module Federation composing multiple SPAs into one page, the demos mostly work (some projector/port hiccups), and the repo + runnable demo is linked via QR code.
AI-written summary · about
chapters (21)
- 0:00Introduction and setup
- 1:05Defining single page apps
- 2:52What are microservices
- 4:17Introducing Micronaut
- 9:14Why combine SPAs and microservices
- 13:32Two approaches to integration
- 15:13API Gateway overview
- 17:41Building a gateway service
- 20:30Micronaut compilation benefits
- 23:17CORS and API documentation
- 24:43API versioning and security
- 27:54JWT and token propagation
- 30:00Demo setup and overview
- 31:03Live SPA demo walkthrough
- 37:30Authentication in the frontend
- 41:49Gateway documentation demo
- 43:58Introduction to microfrontends
- 46:07Microfrontends architecture
- 48:57Webpack module federation
- 50:41Microfrontends live demo
- 52:29Conclusion and resources
related talks
45mA Software Architect's Approach towards SPA Based Micro Apps
55mTechnology agnostic microservices at SPA frontend
47mCamel and Eye of a Needle: Integration Approaches for SPA-based Micro Frontends
36mMicro Frontends in Action!
37mIntroduction to Micro Frontends
29mSPAs are dead. Long live Microfrontends.
32mFrom Monolith to Micro Frontend
51mMicro Frontend: the microservice puzzle extended to frontend