Code Examples

Features & Recipes

Examples demonstrating how to use GraphCMS features.

API FeaturesDescription
Using Asset UploadThis example demonstrates how to programmatically import assets from a URL using the Asset Upload endpoint
Using MutationsNext.js app demonstrating how to use GraphCMS mutations with graphql-request, SWR and API routes.
Using PaginationThis example demonstrates ways you can paginate GraphCMS queries.
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.
Using Management SDKBasic Management SDK script to create a schema with Remote Fields to query data directly from the Stripe API.

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.
Apollo Client 3Using Apollo Client 3 to query data from GraphCMS.
Apollo ServerUsing apollo-datasource-graphql to pull a GraphCMS schema into an existing Apollo Server.
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.
Gatsby ImageHow 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.
Next.js i18n RoutingThis example demonstrates how to use Next.js Internationalized Routing with localized GraphCMS content.
Next.js Image ComponentThis example demonstrates how to use the Next.js Image Component with your GraphCMS assets.
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.