readme.md

awesome-sanity

A curated list of awesome resources related to Sanity.io, the Platform for Structured Content.

Contents

• Official Resources
• Plugins
• Integrations
• Sample Projects
  • Sanity.io/create templates
  • Other examples
  • How to's
  • Studio inspiration
• Related Projects
• Media
  • Articles and blogs
  • Podcasts
  • Videos

Official Resources

Official resources posted by the Sanity.io team.

• Sanity.io - Project website
• Docs - Official documentation
• Sanity.io/create - Have a Sanity powered site up and running in minutes
• Roadmap - The project roadmap.
• Sanity.io Blog - Great articles written by the Sanity.io team
• Status page - Check if all systems are operational
• sanity-recipes - Collection of recipies / snippets / frequently asked questions about Sanity.
• Slack community - Essential Slack community with more than a thousand Sanity.io users. The core team hangs out there too!

Plugins

Sanity is built in React.js and plugins allow you to create and include components that compose or override existing functionality.
Use sanity install {plugin-name} to install a plugin.

• @sanity/code-input - Adds a new type: 'code' field type.
• @sanity/color-input - Adds a new type: 'color' field type.
• @sanity/dashboard - Add the dashboard tool to your studio.
• @sanity/google-maps-input - Provides a more visual way to input the coordinates of a geopoint field.
• @sanity/production-preview - Add a link from the content studio to a preview path on your site. (Read more)
• @sanity/rich-date-input - A richer date/time type and input component for Sanity form builder
• @sanity/vision - A tool that allows you to quickly query data from your studio. (Read more)
• dark-theme - Dark theme for the sanity studio
• sanity-plugin-datatable - Adds a new type: 'table' field type.
• sanity-plugin-highcharts-editor - This plugin let's you embed the Highcharts Editor within Sanity.
• sanity-plugin-inline-svg-upload-preview - Adds a new type: 'svgUploadPreview' field type. Inline SVG Upload and Preview.
• sanity-plugin-intercom - This plugin adds a new tool in your Sanity Content Studio with the Intercom-widget.
• sanity-plugin-json-input - Adds a new type: 'json' field.
• sanity-plugin-latex-input - Enables LaTeX math forumla input with preview capabilities
• sanity-plugin-markdown - Adds a new type: 'markdown' field type.
• sanity-plugin-mapbox-input - Sanity plugin providing input handlers for geo-related input types using Mapbox.
• sanity-plugin-mux-input - Adds a new type: 'mux.video' field type.
• sanity-plugin-nyancat-spinner - Replace default spinners with NYANCAT SPINNERS OMG
• sanity-plugin-podcast - Podcast plugin for Sanity that creates schemas for podcasts and episodes with necessary iTunes data.
• sanity-plugin-sanity-datatable - Adds a new type: 'table' field type.
• sanity-plugin-table - Adds a new type: 'table' field type.
• sanity-plugin-timelinejs - This plugin installs schemas for hosting content for Timeline.js. (Example)
• sanity-plugin-url-metadata-input - URL input for Sanity that retrieves metadata (title, description) along with OpenGraph information
• sanity-plugin-webamp - This plugin adds Webamp as a tool in your Sanity Studio.
• unicorn-slider - Sample input plugin implemented in the Custom input widget guide

The following plugins are not yet production ready, use at your own risk:

• sanity-plugin-draft-review - Sanity draft review plugin
• sanity-plugin-search-groq-filter - Adds support for GROQ filters in search queries in Sanity

Plugins as source code

These plugins are not directly installable using sanity install but you can check the source code and include them as local plugins

• barcode-input - Originally part of the ecommerce-studio this input field allows you to enter a barcode you can scan

Plugin templates

• plugin-template-chess-input - Plugin template for input component modelling a chess board, including preview
• plugin-template-logo - Plugin template for a studio logo
• plugin-template-tool-with-routing - Plugin template for a tool that includes basic routing.

Dashboard plugins

These plugins add widgets or functionality to your dashboard tool.

• minesweeper - Dashboard widget for the Sanity Content Studio which gives you a minesweeper game.
• sanity-plugin-dashboard-widget-document-chart - Sanity dashboard widget which graphs out count of doctypes
• sanity-plugin-dashboard-widget-gatsby - A dashboard widget plugin for Gatsby Preview and Sanity
• sanity-plugin-dashboard-widget-notes - Dashboard widget for the Sanity Content Studio which lets you write simple "post-it" notes
• sanity-plugin-dashboard-widget-netlify - Sanity Studio Dashboard Widget for triggering Netlify builds
• sanity-plugin-dashboard-widget-feed - A dashboard widget plugin for outputting a feed of links and videos from your own or a configured project.

Integrations

• gatsby-source-sanity - Easy way to pull data from Sanity into Gatsby websites.
• Sane Shopify - Integration between Sanity and the Shopify Storefront API.
• MDX-deck with Sanity - Generate an mdx-deck from Sanity.io
• contentful-to-sanity - This package liberates Contentful spaces, creating Sanity projects and schemas as it goes.

Sample projects

Sanity.io/create templates

• Gatsby blog powered by Sanity
• Gatsby portfolio site powered by Sanity
• Landing page builder in Next.js
• Conference site in Vue / Nuxt
• Blog template with a Svelte front-end

Other examples

• The Transglobal Candy Store - Sample front-end for the Sanity.io e-commerce schema with vue.js, nuxt.js, and snipcart
• Microservice for transcribing audio files - Microservice for transcribing audio files uploaded to sanity.io
• Cats dashboard widget - A dashboard widget for Sanity Content Studio

How-to's

• Netlify from Sanity - How to use Netlify Forms and Functions to submit data to Sanity.io
• Auth0 authentication and Sanity - Authenticate with Auth0 and use Sanity for userdata

Studio Inspiration

Other people's approach to structuring the studio

• Movie CMS - Movie CMS using Sanity.io
• Hikawa.studio CMS - React+SSR for hikawa.studio via Sanity.io + Shopify GraphQL API
• Rendah Mag CMS - Sanity.io dashboard for Rendah Mag
• byteconf-sanity-schema - The sanity.io schema for byteconf.com
• perezperret.com CMS - sanity.io headless CMS for perezperret.com
• SeedTribe CMS - An API for SeedTribe content built using Sanity.io
• Itinerary studio - Studio for planning a journey

Related projects

• Official: GROQ - Graph-Relational Object Queries, the query language and execution engine for filtering and projecting JSON documents.
• Official: Portable Text - Portable Text is a JSON based rich text specification for modern content editing platforms.
• Official: vscode-sanity - Visual Studio Code extension for developing applications powered by Sanity.io
• Sanity Query Helper - Helper for using Sanity.io and generating GROQ
• dumbo-ears - Small(ish) listener implementation for Sanity. Useful if you only need listeners.
• picosanity - Tiny Sanity client alternative, if you only need to do queries and only need to support modern browsers.
• podcast-to-sanity - This CLI lets you import podcasts into Sanity via their RSS-feed.
• react-sanity-pagination - React pagination for Sanity.io
• reflector-client - Implements the messaging protocol that supports the Sanity real time presence exprience.

Media

Articles and blogs

• Strategies For Headless Projects With Structured Content Management Systems - Knut Melvær
• Make a Serverless Slack Notification Service – “A post was updated in Sanity” - Knut Melvær
• Make your own podcasting platform! - Knut Melvær
• My brand new blog powered by Sanity.io - Markus Schork
• Norwegian CMS startup Sanity - The New Kid in Town - CMS Connected

Podcasts

• Structured Content Done Right with Sanity.io - devMode.fm
• Headless CMS - Interview with Simen Svale Skogsrud - The Cherryleaf Podcast
• Structuring Content with Simen Svale Skogsrud and Knut Melvær of Sanity.io - JAMStack Radio
• Sanity.io w/ Knut Melvær - HTML All The Things
• Syntax.fm - Sanity is a regular sponsor of Syntax.fm

Videos

• Official Youtube Channel
• Sanity | ReactJS Norway - One of the very first public presentations about Sanity
• Build a Portfolio Site with Sanity.io and Gatsby - Learn with Jason - Espen Hovlandsdal teaches Jason Lengstorf how to build a portfolio site using Sanity.io and Gatsby. (Repos: Site, Studio)

Contribute

Contributions welcome! Read the contribution guidelines first.

License

To the extent possible under law, Passionate People has waived all copyright and related or neighboring rights to this work.