5 reasons you should give the headless CMS Sanity a try
When Netlife decided to rebrand, we didn’t only do so with a new visual identity that included our own typeface, but we also decided to explore new technologial frontiers. We’d been very happy with our previous website built on top of the versatile Craft CMS, but decided to explore if headless CMSes with a detached front-end on the web lived up to the hype (spoiler: they do).
If you’re considering going headless, here’s 5 reasons you should consider giving Sanity a spin:
1. You’ll be up and running in 2 minutes. 🏃
Launch your terminal, write
$ npm install -g @sanity/cli && sanity init
updated 1 package in 14.462s
This utility walks you through creating a Sanity installation.
Press ^C at any time to quit.
Looks like you already have a Sanity-account. Sweet!
? Select project to use Create new project
? Informal name for your project test-project
? Name of your first data set: production
? Output path: ~/Sites/SanityDemo
? Select project template Clean, minimal project
✔ Bootstrapping files from template
✔ Resolving latest module versions
✔ Creating default project files
✔ Fetching packages ▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪ 100% (0.68s)
✔ Linking dependencies ▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪▪ 100% (14.26s)
● Linking dependencies ▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫ 0% (0.00s)
● Linking dependencies ▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫▫ 0% (0.00s)
✔ Saved lockfile
Success! You can now run "sanity start"
While other headless CMSes provide a control panel for editing the content models and fields, I prefer to do it in code. That means it’s easier to reuse patterns across projects. While it’s wise to keep this code fairly verbose and simple, you can also generate fieldsets by iterating over arrays and so on. You can also modularise the usual suspects, such as a title field. It’s pretty nifty!
2. You can edit the editor 🖋🔧
What makes Sanity stand out is that its editor, i.e. Content Studio, can be tweaked, extended and tailored to whatever you need. The first step is to configure the previews of your content. This is done by attaching a
preview object to the type you want to display in the preview. You can also customize it even more by sending whatever you’ve selected through a
We have already begun to use Sanity for client work. In one our projects with the U4 Anti-Corruption Resource Center (still under development!) they wanted to integrate the rich text field with a service for text analysis to help them keep track of text quality. I’m no React expert, but I managed to extend the rich text editor to include a line with a small selection of the many data points provided by readable.io’s API. You can see the proof of concept underneath. We have also made a spreadsheet-ish input field for creating and editing tabular data, and rumour has it that there exists an input field for a live 3D rendering of protein molecules(!).
3. GROQ gives you API superpowers 🚀
The whole reason of choosing a headless CMS, is that the content can be accessed through APIs. Typically that has been RESTful APIs, which can be somewhat of a hassle to manage. Although it often make sense, building a slightly advanced website, or any application really, on such APIs can also be a hassle. Especially when you’re required to query the API many times in order to get the necessary IDs to get the data you want. This is partly why Facebook made GraphQL, which now seems to be the weapon of choice for up and coming headless CMSes and “backends as a service”.
Sanity doesn’t come with GraphQL (yet), but arguably something much better: GROQ. The first thing I thought on seeing it was that it felt like “Markdown for GraphQL”. The syntax is also something you’ll have to get a little used to, but oh man, once you are: 🚀. If you wanted to query for the articles I made in the example above, it would be as easy as typing
*[_type == 'article'], but you can also go a bit crazy with it:
4. The underlying technology is super boring 💤
Despite the fact that you configure the data schemas and the content studio locally, Sanity CMS is cloud hosted, and all the data is instantly synced, which means that the studio is also real-time. Making your Content Studio configuration available to others is a simple
At time of writing, the pricing for hosting and SLAs are not yet announced, but we’re pretty sure it will be sensible both in terms of expense and features. It will also be used in the academic sector to power a solution for online research publications.
5. It’s finally easy to work with headless content models—for everybody 🙇♀🙇
We are headless over heels in love! 💚
There’s something powerful in being able to adjust and tweak the content model, the input fields or even the preview during a meeting or workshop just to test out the suggestions. The fact that new content fields are instantly reachable through the APIs once they’re made, removes so much friction for front-enders. We have never before been able to so effortlessly build an information architecture so that both front-enders and content editors can experiment with it instantly. The devil is also in all the little details that are too many to explore in this post, but to highlight some of them: Sanity analyses the color schemes of your images (say goodbye to text-on-image contrast troubles!), handles pastes from Microsoft Word handsomely, lets multiple users edit the same documents at the same time, exports and imports the whole dataset with one terminal command, has CDNs, has plugins to preview OpenGraph-tags, lets you write your own plugins to the studio with a simple
sanity init plugin, lets you make your own marks and annotations in rich text, and lets you ask for your images in whatever size, crop or rotation you want. The list goes on and grows every week.
Neither has it ever been so easy to tailor the very editor it all happens in – it makes for new and exciting ventures!
It should be noted that we have no financial ties to Sanity, other that we use it to help our clients, whom we bill by the hour. If you’re interested in trying out Sanity you can learn more by reading through its documentation. We’re sure the folks at Sanity appreciate feedback, questions on either gitter or in the various github-repos.
If you’re interested in working with Netlife on a project with Sanity, just send us a good old fashioned email, and we’ll figure something out!