Be Lazy, Be Smart, Be Nuxt.
summary
Demo shows Nuxt as a Vue-based framework that builds Universal, SPA and statically generated sites with commands like nuxt dev / nuxt build / nuxt generate, automatic code-splitting, link prefetching and a modern+legacy build. Live app uses Vuex for auth, a middleware redirect, the asyncData hook to server-render API data, and the PWA module; production bundle tools shrink from ~68 MB dev to ~8 MB prod. The generated site deploys to static hosting and scores ~96 in performance, and the demo app runs as expected.
AI-written summary · about
chapters (28)
- 0:00Intro
- 0:36JavaScript Framework
- 0:46Webpack
- 1:04Directory
- 2:04Developer Experience
- 2:57ServerSide Rendering
- 3:12Universal Rendering
- 3:32Universal Server
- 3:47View App
- 4:12View Page
- 5:17Static Generate
- 6:00JavaScript
- 7:14Single Page App
- 7:33Disable ServerSide Rendering
- 7:59ClientSide Navigation
- 8:32Packages
- 9:17Live Coding
- 12:44View API
- 13:12Sync Data
- 13:42Navigation
- 14:51Page
- 15:49Refresh
- 17:49ViewDevTools
- 19:12Middleware
- 19:32Context
- 21:03Add PW module
- 21:18Add PW icon
- 24:25Outro
related talks
55mNuxt.js: isomorphic Vue.js Apps made easy, fast and fun
37mIntroduction to Nuxt js
44mNuxt.js - Why? How? Oh yeah!
27mUniversal Vue applications with Nuxt.js
04mNuxt.js: Universal Vue.js Applications
29mNuxt.js 2.0
25mHow we are optimizing Nuxt without removing features in VueStorefront
29mSpeed up your Vue js development time with Nuxt.js