Static site generation with Nuxt in Vue - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is Static Site Generation (SSG) in Nuxt?

Static Site Generation means Nuxt pre-builds all pages as static HTML files during build time. This makes the site fast and easy to host.

beginner

How do you enable Static Site Generation in a Nuxt project?

Set target: 'static' in nuxt.config.js. Then run npm run generate or yarn generate to build static files.

beginner

What command do you run to generate a static site in Nuxt?

Run npm run generate or yarn generate. This creates static HTML files in the dist/ folder.

intermediate

How does Nuxt handle dynamic routes during static generation?

You use the generate.routes property in nuxt.config.js to specify dynamic paths so Nuxt can pre-render them.

beginner

Why is Static Site Generation good for performance and SEO?

Because pages are pre-built as static HTML, they load very fast and search engines can easily read the content without running JavaScript.

Which Nuxt config option sets the project to generate a static site?

A mode: 'universal'

B ssr: true

C target: 'static'

D build: 'static'

Setting target: 'static' tells Nuxt to generate a static site.

What command builds the static files in Nuxt?

A nuxt generate

B nuxt build

C nuxt start

D nuxt serve

nuxt generate creates the static HTML files for deployment.

How do you tell Nuxt which dynamic routes to pre-render?

A Use <code>asyncData</code> only

B Add routes in <code>generate.routes</code> in <code>nuxt.config.js</code>

C Set <code>ssr: false</code>

D Use <code>router.push()</code> in components

You specify dynamic routes in generate.routes so Nuxt knows which pages to build.

What is a benefit of static sites generated by Nuxt?

A Pages cannot be cached

B Pages require a Node.js server to run

C Pages are generated on every user request

D Pages load instantly without server delays

Static pages load fast because they are pre-built and served as simple files.

Which of these is NOT true about Nuxt static generation?

A It requires a backend server to render pages on demand

B It improves SEO by serving pre-rendered HTML

C It creates files you can host on any static server

D It can pre-render dynamic routes if configured

Static generation does NOT require a backend server to render pages on demand.

Explain how to set up and generate a static site using Nuxt.

Think about config options and the build command.

Describe why static site generation improves website performance and SEO.

Consider how static files differ from server-rendered pages.