Setting up GraphCMS

Learn to integrate GraphCMS, an e-commerce content management system, with a Next.js application.

GraphCMS

There are many different competitors in the e-commerce world; all of them offer a great set of functionalities for building modern and performant solutions, but there’s always a kind of trade-off when it comes to analyzing back-office features, front-end customization capabilities, APIs, integrations, and so on.

We’ll be using GraphCMS for a simple reason: it’s easy to integrate, offers a generous free plan, and requires no setup for complex release pipelines, databases, or whatever. We just need to open an account and take advantage of the massive set of free features to build a fully working e-commerce website.

It also provides an e-commerce starter template with prebuilt (yet fully customizable) contents, which translates to a prebuilt GraphQL schema ready to consume on the frontend to create product pages, catalogs, and so on.

We can start by creating a new GraphCMS account by going to the GraphCMS website. Once we log in to our dashboard, we’ll see that GraphCMS prompts us to create a new project, and we’ll choose among several premade templates. We can select the
“Commerce Shop” template, which will generate some mock content for us.

Get hands-on with 1400+ tech skills courses.