The insane quest for the perfect CMS ends in Sanity

TL;DR

1. Traditional CMSs might offer a great ecosystem (namely, WordPress) and/or awesome editing experience (Ghost, Directus), but they hinder my workflow, limit some design decisions and - for the most part - end up in not-so-performant websites;
2. Therefore, headless CMSs are the answer, but they can be costly, hard to model the data or offer a poor editing interface;
3. Sanity is the product that checks all boxes and more. From amazing front-end to incredibly easy and capable data modeling through JS objects, from their own simple and flexible query language (GROQ) to easy extensibility through React components, it's my dream CMS, and its free plan is quite generous.

In my quest to find the perfect CMS to fit my workflow with clients, I've came across a ton of different options, but they all had their flaws that either decreased my design freedom and content possibilities or made it hard - sometimes impossible - for the client to update parts of the content.

The traditional CMS's pitfall

Even though I understand the value of traditional CMSs that force you to use their coupled front-end infrastructure, such as WordPress and Drupal, I've came to a conclusion that they hinder my workflow.

Whereas using a static site generator such as Hugo or Gatsby I can bootstrap a project from a custom starter and have a complex landing page live - with styles, data fetching from a CMS and all - without worrying about servers in less than 8 hours, with WordPress (which is the one I'm most used to) I'd spend at least 1 hour just figuring out the server, installing a starter theme like Underscores and setting a .sass workflow. And that's without all the awesome hot module replacement and templating freedom that I get with static sites!

I gave up on WordPress when our agency, Kaordica, started going after bigger clients and doing more customized websites. Before, I went along fine with WP as I could find a cool theme, customize it as the client wanted and deliver it fast, but then, when our process began including building the design from scratch, themes couldn't help me anymore. I had to create my own themes, and that was painful.

I have a lot to say about this, especially because following 2 courses wasn't enough to make me proficient in creating themes, but I'll keep this to another possible post on why I dropped WordPress from my life. Point is, our business couldn't afford the shackles of traditional CMSs with such a small team.

Headless CMSs: a fresh and bloated market

Turns out I'm not the only person coming to the same conclusion (duh) and opting for decoupled CMSs (which I'm using as an interchangeable term for headless, although it appears to have some differences)... in fact, the JAMStack approach is getting a lot of traction, there's a new static site generator popping every day - with over 230 of them listed on staticgen - and several businesses are seeing the opportunity in the headless CMS field.

This is amazing, of course, as it gives us plenty of choices, from CMSs with data stored in Firebase (Flamelink, Pushtable and Canner) to git-based solutions that update markdown or JSON files, preserving version control (SiteLeaf, Prose, etc.), we've got it all... But with 50 options (and growing) in headlesscms.org, it becomes nearly impossible to: A. know which is the best for your use case; and B. rely on the companies behind some of the CMSs.

Of course this comes from the fact that this market is new and far from consolidated - I have no historical background on this, but I assure this idea is quite young - and for such we must be careful in the solutions we choose for our businesses. Choosing a hosted CMS that goes out of business a year later will get you into trouble, as well as investing heavily in processes and tooling around an open source option that will stop evolving as soon as the hype dies will possibly make you wish you stayed with good 'ol WordPress.

Before this post becomes unbearably long, I just want to say this: most CMSs I took a look at (I'd say around 10 - 15 of them) had good ideas going on, but, as a whole, were lacking in very serious aspects such as UX for content editors, flexibility for devs or pricing for businesses.

Strapi felt super buggy and incomplete (and hosting a server is always a pain), NetlifyCMS was a pain to manage media (which they seemed to have fixed) and was quite slow to do everything in it, with the developing experience being based in a (super painful) trial and error, and Contentful is clearly geared towards bigger organizations, with absurd pricing for anyone that doesn't earn in USD or another strong currency - plus, I didn't find the editing interface very friendly and extensibility didn't seem so flexible for many use cases...

The people behind NetlifyCMS are doing a great job by providing an amazing tool, but the design language of the project is far from user-friendly.

The sane answer

But then, when I was almost settling down with an unhappy choice, I found Sanity, which hopefully will get you excited with the following:

• It's cheap and reliable
  • For most build-time generated static sites, you'll never leave the free plan, with 10k documents and 5GB assets for free;
  • The CMS comes from an established and mature agency from Oslo, Norway called Bengler which was extremely capable when it came to data (or at least they did a good job at selling themselves in videos and their website haha);
  • Bengler closed its doors to focus on Sanity, with a proper infrastructure, a solid team and some seed funding behind their backs. It's probably not going anywhere.
• It's modern and flexible
  • They have their own query language - GROQ - that is both super easy to pick-up (you'll be writing queries in less then 5 minutes, guarantee) and EXTREMELY flexible. Personally, I like the syntax better than GraphQL and its philosophy fits my workflow better (yes yes, I know they're fundamentally different and bla bla bla).
  • It's built on top of React - meaning you can easily modify the studio (how they call the editor UI) and add new components for editing - and it's easily pluggable into any front-end framework. Oh, and if you want you can always create your own UI for specific use-cases, such as a landing page builder, who knows.
• It's easy for both devs and editors
  • Their studio UI is super clean, clear and tasty to use. Honestly, after buggy Strapi, bloated WP, inconsistent NetlifyCMS, i-dont-know-what-bothers-me-in-it Contentful and other traumatic experiences, Sanity's editing experience is so glorious I knew from the very moment that was the CMS for me - like love in first sight. Ok, yeah, It's not perfect, but they've just hired a designer to work on it and you can always make it your own, give it a chance, they're trying!
  • And you can easily build your schema with JS objects that you can re-utilize for other projects, how awesome is that? I'm starting to build a "CMS library" for our company and let me tell you, it's helping a ton! You could plug objects and document types to bit and publish them to npm, for example, and then use them universally throughout your projects. It's an agency's dream, guarantee.

Example of things you can do with Sanity

• Live preview changes in static site (which requires a front-end framework and wouldn't work with, say, Hugo or Jekyll) - learn how here;
• Create your own editor UI without having to worry about the infrastructure of the back-end - Sanity's documentation is quite easy to follow and personally I've found it very easy to write stuff to the database.
• Code custom components, based in React, for modeling the data as you see fit.
• Create different tools for the CMS with specific routes that could gather and manipulate data from anywhere.
• Easily customize the look of the editor to fit your clients' brands.
• Realtime collaboration on documents.
• Extend the block editor with your own components. A good example of this is a LaTeX input that automatically renders a preview in the editor.
• Do some really crazy validations with a super clear and flexible validation API.
• Have a collection of SVG icons that editors can browse and use easily (image below).
• And much more, as always, the sky is the limit!

Of course it's not all flowers, I'm not (that) idealist

I've had a couple of bugs before (one of them quite serious and infuriating), and there are several stuff I'd like to see different, but I keep my feet on the ground with my expectations: there will be no perfect CMS, but at least we can ask for a sane one!

And honestly Sanity is working hard towards the utopic perfection, their team is super friendly, helping even with free riders like me in using their solution, keeping an open mind and active ear on listening for feedbacks and exploring novel ideas that can one day drive our industry forward. I don't know about you, but I'm pretty sold on this.

NOTE: Again, this is not a sponsored post, I really just want to help you as a fellow dev to fulfill your wildest CMS dreams, which, if you have similar use cases, I believe you will by choosing Sanity ;)