Universal Vue applications with Nuxt.js
summary
Nuxt.js claims make Vue apps server-rendered or statically generated so pages load fast and search engines crawl them; the demo uses the pages directory convention to auto-create routes, dynamic params via _id and slug with validation, and lifecycle hooks like the asyncData hook and fetch to synchronously load data. The workflow includes create-nuxt-app or manual setup, HMR, Sass loaders, and running nuxt generate to produce a dist folder and router files—static output that actually serves and improves SEO.
AI-written summary · about
chapters (14)
- 0:00Intro
- 3:25Nuxt lifecycle
- 6:20Static Site generation (improve SEO)
- 7:35Create App (2 ways)
- 9:14Create app - create-nuxt-app
- 10:39Hello Nuxt app (manual)
- 12:05Demonstrating SSR
- 13:49Working with image assets
- 14:49Working with style assets
- 18:22Routing slug
- 20:37Default layout
- 21:33Error page
- 22:15Custom layout
- 23:09Life cycle methods
related talks
37mIntroduction to Nuxt js
55mNuxt.js: isomorphic Vue.js Apps made easy, fast and fun
26mBe Lazy, Be Smart, Be Nuxt.
04mNuxt.js: Universal Vue.js Applications
44mNuxt.js - Why? How? Oh yeah!
29mSpeed up your Vue js development time with Nuxt.js
25mBrief introduction to Nuxt
27mNuxt 3 – More Than Vue 3 on Steroids