Explore static pre-rendering with Nuxt in this conference talk from Vue.js Amsterdam 2020. Discover how to leverage Nuxt's static generation capabilities beyond simple blogs, covering topics such as Headless CMS integration, Netlify CMS, dynamic routing, and GraphQL implementation. Learn to optimize your Vue.js applications by implementing Nuxt's crawler, Apollo integration, and Netlify build hooks. Gain insights into the benefits of static sites, including improved performance, reduced server costs, and enhanced security. Dive into advanced concepts like Nuxt hydration, static module usage, and creating SPAs within static sites. Perfect for Vue.js developers looking to expand their knowledge of Nuxt and static site generation techniques.
Overview
Syllabus
Intro
Nuxt Benefits
Headless CMS
Netlify CMS
Nuxt Dynamic Routes
Nuxt Crawler
Add a new table
GraphQL Endpoint
GraphQL Playground
Call the GraphQL API
Apollo
Add our Query
Network Tab - Call API
Generate on Update
Create your trigger
Netlify Build Hooks
Add the URL to Hasura
Netlify Deploys
Nuxt Hydration
Nuxt Static Module
Call the payload
Async Data
Convert to a static sit v
SPA inside a Static site
Why Static? No server: cheaper, safer
Vue School
Taught by
JSWORLD Conference
