Announcing the Official GraphCMS Todo App Starter

Introducing the Todo App starter built using GraphCMS, Next.js, NextAuth.js, SWR, and Tailwind. Quickly get started with user generated content.

Jamie Barton
Jamie Barton

We're excited to share that we have a new official GraphCMS Starter. A Todo App!

Todos preview

This reference application is an example of how you can build a fully functional todo app using a popular React data fetching library, and use GraphCMS to store user profiles, and their own todos.

FeaturesAnchor

  • Authenticate users with NextAuth.js
  • Protected user todos with email/password login
  • Styled with Tailwind CSS
  • Works with Next.js API routes + SWR

This application demonstrates how you can leverage your existing Next.js applications to include GraphCMS, even if you are still using API routes instead of a GraphQL endpoint.

We understand not everyone can start using GraphQL on the frontend right away, but with this example, we'll be using the powerful React hooks library SWR for fetching (and mutating) data to show how you can begin to use GraphQL behind your frontend API routes.

If you've been looking for an excuse to start using GraphQL and GraphCMS, this example is perfect for you.

QuickstartAnchor

  1. Create a new project using the Todo App starter
  2. Create a Permanent Auth Token with permissions to Create, Read, Update, Delete, Publish, and Unpublish on the DRAFT stage
  3. Deploy to Vercel and provide your API endpoint and token

Get started with your own Todo App →


  • Jamie Barton
  • Developer Relations

    Jamie is a software engineer turned developer advocate. Born and bred in North East England, he loves learning and teaching others through video and written tutorials. Jamie maintains Build your DXP, Headless Commerce Resources, and GraphQL WTF.

Related articles

It's Easy To Get Started

GraphCMS plans are flexibly suited to accommodate your growth. Get started for free, or request a demo to discuss larger projects with more complex needs