Theo's Typesafe Cult•2y ago

Next.js & ApolloClient Best practices

Hi folks, I'm starting to learn Next with GraphQL and Apollo and I've got some questions. In the Next Github's examples I found this template https://github.com/vercel/next.js/tree/canary/examples/with-apollo with a specific configuration of Apollo Client. Should it look like this? Here's a link to my repo, where I've copied and adjusted the config: https://github.com/Lyczeq/graphql-swapi/blob/main/src/lib/graphql/apolloClient.ts The next thing is usage of getServerSideProps with ApolloClient. As I understand, Apollo caches the data from requests, so is it a good practice to do things like below?

export const getServerSideProps = async () => {
  const apolloClient = initializeApollo();

  await apolloClient.query({
    query: FilmsDocument,
  });

  await apolloClient.query({
    query: PlanetsDocument,
  });

  return addApolloState(apolloClient, {
    props: {},
  });
};

export const getServerSideProps = async () => {
  const apolloClient = initializeApollo();

  await apolloClient.query({
    query: FilmsDocument,
  });

  await apolloClient.query({
    query: PlanetsDocument,
  });

  return addApolloState(apolloClient, {
    props: {},
  });
};

I mean here is the repeated execution of await apolloClient.query. Imo the execution of this request here results in the fact that lower in the components of a given page, you can simply take this data from the cache. Thanks in advance for your answers. I would also like to ask you for suggestions and best practices using Next.js and happy

0 Replies

No replies yetBe the first to reply to this messageJoin

Gaming

Programming

Next.js & ApolloClient Best practices