Setup client to make requests to GraphQL API in Next.js SSR and SSG stages.
import { ApolloClient, InMemoryCache, gql } from '@apollo/client';
//Define a client
const client = new ApolloClient({
uri: process.env.REACT_APP_GRAPH_API,
cache: new InMemoryCache()
});
//use client to query all items' slugs (get all entitis available) to a variable
export async function getStaticPaths() {
const { data: {snippets} } = await client.query(
{query: gql`{snippets { slug } }`}
);
//use variable's slugs to create an object with "params" before passing it to a getStaticProps
const paths = snippets.map(item => ({params: {slug: item.slug}}));
return { paths, fallback: false }
}
This allows pre-render an unspecified number of pages, like blog items.