Large Scale Nuxt Architecture

on YouTube ↗38m

" summary

Nuxt is presented as more than SSR: expect concrete tradeoffs — file‑based routing versus explicit route declarations, asyncData vs fetch for server vs client fetching, and middleware and serverInit patterns. State options compared are Vuex and Pinia stores. Architecture advice includes feature folders, Nuxt modules and a live micro‑frontend demo (iframes and module federation), with candid failures and testing practices (visual, mutation, contract), BFFs, a Helio design system, and web‑vitals observability guidance so viewers can judge practical applicability.

AI-written summary · about

" chapters (10)

1. 0:00Start
2. 3:37Large Scale Architecture
3. 5:07Routing
4. 8:55Legacy Fetch
5. 21:04Feature Toggles
6. 29:13A design system is a collection of
7. 30:31What to monitor?
8. 31:56Core Web Vitals
9. 33:47Resources
10. 34:06Key takeaways

" related talks

• 22mWays to architecture your vue/nuxt appGeisy Domiciano · JSDay 2019
• 44mNuxt.js - Why? How? Oh yeah!Alexander Lichter · VueDay 2019
• 22mDeep dive into Nuxt.jsPooya Parsa · Vue.js Amsterdam 2020
• 33mState of Nuxt 2026Daniel Roe · Vuejs Amsterdam 2026
• 21mHow to enable large scale collaboration between disciplines using NuxtYassine El Ouazzani · JSWorld Conference 2022
• 55mNuxt.js: isomorphic Vue.js Apps made easy, fast and funDavid Guijarro · iJS London 2019
• 16mNuxt ArchitecturePooya Parsa · Vue.js Global 2020
• 18mNuxt.js - Just Vue and a bit of magic?Alexander Lichter · CityJS Berlin 2024