Code Examples

Features & Recipes

Examples demonstrating how to use GraphCMS features.

FeaturesDescription
Using MutationsNext.js app demonstrating how to use GraphCMS mutations with graphql-request, SWR and API routes.
Using Union TypesA basic product marketing site using union types to compose UI 'blocks' with components. Built with Next.js, graphql-request and Tailwind CSS.

Frameworks & Libraries

Examples demonstrating how to use GraphCMS with popular application frameworks.

Library / FrameworkDescription
AlgoliaSync content to Algolia via webhooks on publish using Next.js API routes.
ExpressA simple Express app using ejs templating and awesome-graphql-client.
GatsbyA basic Gatsby site that uses gatsby-source-graphcms to build product pages with data from GraphCMS.
GatsbyHow to use gatsby-image with GraphCMS assets.
GraphCMS ImageHow to use graphcms-image with Gatsby.
GridsomeA basic example using gridsome create CLI and @gridsome/source-graphql.
MDX (with Next)This example demonstrates how to use markdown fields from GraphCMS with MDX in Next.js
Next.jsA basic Next.js application, featuring getStaticProps and getStaticPaths to build static product pages.
Nuxt.jsA simple Nuxt.js starter using create-nuxt-app CLI, and a custom Nuxt plugin.
React.jscreate-react-app example that uses apollo-client to build a blog .
Vue.jsA vanilla Vue.js starter using vue create CLI with Vue Router .
SapperA Svelte example using the Sapper framework.

Did you find this page useful?

Your feedback helps us improve our docs, and product.

This site uses cookies to provide you with a better user experience. For more information, refer to our Privacy Policy