Skip to content

Latest commit

 

History

History
25 lines (17 loc) · 1.2 KB

File metadata and controls

25 lines (17 loc) · 1.2 KB

How to Setup and Use Apollo Client in Next.js 13 App Directory

In this article, you'll discover how to set up and use Apollo Client in the new Next.js 13 app directory. Specifically, you'll learn how to use Apollo Client in both React Server and Client Components.

How to Setup and Use Apollo Client in Next.js 13 App Directory

Topics Covered

  • Bootstrap the Next.js 13 Project
  • Use Apollo Client in a React Server Component (RSC)
    • Create a Scoped Apollo Client Instance
    • Use the Apollo Client Instance in an RSC
  • Use Apollo Client in a Client-Side Component (SSR)
    • Create the Apollo Client Wrapper
    • Add the Apollo Client Wrapper in the Root Layout Component
    • Use the Apollo Client in a Client-Side Component
    • Render the Client-Side Component in a Server Component
    • Create a Loading Component
  • Should you use Apollo Client in a Client or Server Component?
  • Conclusion

Read the entire article here: https://codevoweb.com/setup-and-use-apollo-client-in-nextjs-13-app-directory/