/graphcms-examples

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

Primary LanguageJavaScriptMIT LicenseMIT

GraphCMS Logo

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