Skip to main content

Navigation

  • Client impact
  • Writing

AI Solutions

  • AI Systems
  • AI Development

Software teams

  • Design Systems
  • Product Design & Engineering
  • API Platforms
  • View all services for software teams
Get in touch
  • AI Systems

    Model-agnostic AI systems and agents that do real work

    AI Development

    Custom apps and tools built with AI-enabled engineering

  • Design Systems

    Depth of experience that few can match

    Product Design & Engineering

    Experts in cross-functional collaboration

    API Platforms

    Node.js, React, & GraphQL at scale


    View all services for software teams
  • Client impact
  • Writing
  • Contact

Writing · Aug 15th, 2019 · 5 min read

Mike Riethmuller avatarMike Riethmuller avatar
Mike Riethmuller

Introducing Keystone 5

Keystone 5 is a scalable platform that allows you to create a highly customised CMS and API in minutes.

Services discussed

  • Content Management Systems

Technology discussed

  • Keystone,
  • GraphQL,
  • Next.js

Tagged in

  • Labs

On this page

  • Open source
  • Zero assumptions
  • Fully featured
  • GraphQL App
  • Getting Started
  • 🙏 Thank you

It’s not just a new version of Keystone, but a complete re-imagining of KeystoneJS for the future.

Keystone 5 builds on the lessons learned over the last 5 years of the Keystone’s history and focuses on what we believe are the most powerful features for modern web and mobile applications.

This means less focus on template-driven websites and more focus on a flexible architecture, a powerful GraphQL API with deep access control features, an extensible Admin UI and plugins for rich field types, file and database adapters, and session management.

We believe it’s the ideal back-end for React, Vue or Angular applications, Gatsby and Next.js websites, Static sites, Mobile applications and more.

Open source

Keystone is proudly open-source and allows individual and commercial reuse and modification. The code is freely available on GitHub.

Zero assumptions

Keystone is not opinionated about your front-end architecture. It works great with React, Vue, Angular, or anything else you like to use.

Keystone also tries to make zero assumptions about your data structure allowing you to build any type of application. It achieves flexibility through small, highly composable parts that allow you to build a foundation for any application.

Don’t need ‘Users’ or ‘Posts’? Not a problem! Keystone’s extensible architecture means you choose the features you need. Pick an ideal starting point, rather than working hard to adapt an opinionated framework.

Fully featured

Zero assumptions doesn’t mean zero features. Keystone comes with dozens of features out of the box including Lists, Fields, Access Control, Authentication, and Apps. You can add and configure each these, as well as extend, modify or build your own.

Lists

Lists define a set of Fields that make up a collection in Keystone. A List might represent a content type, such as a “Page” or “Post”, but they can be any collection of data. Creating a List is how you define the data structure of your application.

Fields

Fields represent a data type. They are used in Keystone for everything from rendering components in the Admin UI, to configuring Access Controls, to generating a GraphQL API. Keystone has dozens of built-in Field types and as always, you can create your own.

Access Control

Keystone has powerful Access controls that can be configured on Lists and Fields to define the specific actions authenticated and anonymous users can take within the Admin UI or GraphQL Apps.

Authentication

Authentication refers to a user identifying themselves and “logging in” to an application. Keystone provides multiple authentication strategies including a basic password or third-party authentication services, such as Twitter and Google.

Once again, authentication strategies are configurable and extensible allowing you to create your own login methods.

Apps

Keystone uses Apps to compose high-level features into a larger application.

A Keystone index.js file exports two things, a Keystone instance, and Apps:

module.exports = {
  keystone,
  apps: [
    new GraphQLApp(),
    new StaticApp({ path: '/', src: 'public' }),
    new AdminUIApp({ enableDefaultRoute: true }),
  ],
}

From a technical perspective Apps are simply bundled express middleware that accept configuration options. Essential Keystone Apps include the GraphQL App, Admin UI App, and Static App.

GraphQL App

The GraphQL App is the keystone App of KeystoneJS. It provides a powerful GraphQL API with CRUD operations and powerful filtering options for all your lists.

Admin UI App

The Admin App is a fully functional administration UI to help you manage your data.

Static App

The Static App allows you to serve content from a folder using an express static server. This can be quick and easy way to deploy a simple front-end with a Keystone application.

The Static App, along with other Keystone Apps, can decoupled from the main application and deployed separately if required.

Note: Apps like the Static App provides an alternative to Keystone 4’s views and templates engine.

Headless

Keystone is headless, meaning it requires no front-end application. Keystone 5’s primary focus is on the API and Admin UI. It is non-prescriptive about your front-end application. Because of this Keystone 5 works with all major front-end frameworks.

Self host

Own your own data and host Keystone anywhere. Have complete freedom of choice when hosting your data, admin application, API and front-end applications.

BYO Database

Keystone allows you to choose different storage methods. Adapters for MongoDB and Postgres are available now, with additional adapters in development.

Because of its extensible architecture, Keystone is not even explicitly tied to a database. You could create adapters for file-system storage such as SQLite or even JSON and cloud storage options. We hope to see many more adapter options in the future.

Field level adapters allow you to fetch or store data for specific fields separately from your main storage location. Examples include uploading images to Cloudinary or fetching information via o-embed links.

Getting Started

Keystone has a high level of configurability when you need it, but most customisations are opt-in and Keystone provides sensible defaults to help you get started quickly.

Create your first Keystone 5 project in seconds:

npm init keystone-app my-app
cd my-app
npm run dev

This will configure a simple Todo application. Then visit http://localhost:3000 to see it in action. 🎉

See the complete Getting Started Guide for more details.

🙏 Thank you

A huge thanks to our Core Contributors, who have been working hard on tackling all the challenges that come with building such a powerful CMS like Keystone 5:

  • Tim Leslie (@timl)
  • Jess Telford (@jesstelford)
  • Emma Hamilton (@emmahamiltown)
  • Joss Mackison (@jossmackison)
  • Jed Watson (@jedwatson)

And all those who have supported the development; Nathan Simpson, Mike Hazell, John Molomby, Dominik Wilkowski, Ben Connolly, Jared Crowe, Luke Batchelor, Ticiana de Andrade, Gautam Singh, and Ajay Narain Mathur.

And of course, a massive thank you to the Keystone Community; without you, none of this would be possible ❤️

What about Keystone 4?

Keystone 4 is alive and well! Going forward, we will hand the npm packages over to our community leaders who can continue to help it grow, merge bug fixes, and add new features. As the Keystone 5 alpha nears stable release, we will communicate more details.

Thanks to Emma Hamilton, Jess Telford, and Joss Mackison

Services discussed

  • Content Management Systems

Technology discussed

  • Keystone,
  • GraphQL,
  • Next.js

Tagged in

  • Labs
Mike Riethmuller avatarMike Riethmuller avatar
Mike Riethmuller

Software developer who loves to bridge the gap between performance, scalability, and user experience.

Related content

  • Keystone 6 – v8.0.0

    article

    July 2026·
    (opens in new tab)
  • A year of Keystone releases in review

    article

    August 2024·
    (opens in new tab)
  • Storybook and Mock APIs: A Powerful Prototyping Combo

    article

    May 2024·12 min read
  • Keystatic now featured in Astro docs

    article

    August 2023·
    (opens in new tab)
  • 7 Things I Love About Keystatic — A Thread...

    article

    June 2023·17 min read
  • Using Keystatic as a CMS

    article

    June 2023·
    (opens in new tab)

Have an idea to explore?

Get in touch

Footer

Thinkmill is a member of the Tech Council of Australia(opens in new tab).

AI Solutions

  • AI Systems
  • AI Development

Software teams

  • Design Systems
  • Product Design & Engineering
  • API Platforms
  • View all software teams

Client impact

  • ELMO
  • Tiimely
  • Atlassian
  • Reckon
  • AnywhereWorks
  • View all client impact

Open Source

  • Keystone (opens in new tab)
  • Keystatic (opens in new tab)
  • React Select (opens in new tab)
  • Classnames (opens in new tab)
  • Manypkg (opens in new tab)
  • Changesets (opens in new tab)