javascript / intermediate
Snippet
SSG with generateStaticParams
The generateStaticParams function is used in combination with dynamic route segments to statically generate routes at build time instead of on-demand. This significantly improves performance and SEO.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
export async function generateStaticParams() {const posts = await fetch('https://api.example.com/posts').then((res) => res.json());return posts.map((post) => ({slug: post.slug,}));}export default function Page({ params }) {const { slug } = params;return <article>Post: {slug}</article>;}
nextjs
Breakdown
1
return posts.map((post) => ({ slug: post.slug }));
Returns an array of objects where each object represents the populated dynamic segments.