GraphCMS Examples

Example projects to help you get started with GraphCMS on OneGraph.

Join the OneGraph Spectrum · Read the OneGraph Docs · Learn more about OneGraph

Join the GraphCMS Slack · Read the GraphCMS Docs · Learn more about GraphCMS

To use GraphCMS from OneGraph, add your GraphCMS schema from the Architect tab on the OneGraph Dashboard.

Examples

GraphCMS Features & Recipes

Examples demonstrating how to use GraphCMS features.

Features	Description	Demo
Using Mutations	Next.js app demonstrating how to use GraphCMS mutations with graphql-request, SWR and API routes	https://graphcms-using-mutations.now.sh
Using Union Types	A basic product marketing site using union types to compose UI 'blocks' with components. Built with Next.js, graphql-request and Tailwind CSS	https://graphcms-using-union-types.now.sh

Frameworks & Libraries

Examples demonstrating how to use GraphCMS with popular application frameworks.

Frameworks & Libraries	Description	Demo
Apollo Server	Using apollo-datasource-graphql to pull a GraphCMS schema into an existing Apollo Server	https://graphcms-with-apollo-server.herokuapp.com
Express	A simple Express app using ejs templating and awesome-graphql-client	https://graphcms-with-express.herokuapp.com
Gatsby	A basic Gatsby site that uses gatsby-source-graphql to build product pages with data from GraphCMS	https://graphcms-with-gatsby.now.sh
Gatsby Image	How to use gatsby-image with GraphCMS assets	https://graphcms-with-gatsby-image.now.sh
GraphCMS Image	How to use graphcms-image with Gatsby	https://graphcms-with-graphcms-image.now.sh
Gridsome	A basic example using gridsome create CLI and @gridsome/source-graphql	https://graphcms-with-gridsome.now.sh
MDX (with Next.js)	This example demonstrates how to use markdown fields from GraphCMS with MDX in Next.js	https://graphcms-with-nextjs-mdx-remote-ynnoj.graphcms.vercel.app
Next.js	A basic Next.js application, featuring getStaticProps and getStaticPaths to build static product pages	https://graphcms-with-nextjs.now.sh
Nuxt.js	A simple Nuxt.js starter using create-nuxt-app CLI with Tailwind and Axios added	https://graphcms-with-nuxtjs.now.sh
React.js	create-react-app example that uses apollo-client to build a blog	https://graphcms-with-reactjs.now.sh
Vue.js	A vanilla Vue.js starter using vue create CLI with Vue Router	https://graphcms-with-vuejs.now.sh
Sapper	A SeveltJs example using Sapper	https://graphcms-with-sapper.now.sh