Sanity Has a Free Structured Content Platform — Build Content-Driven Apps Without the CMS Headache

Most CMS platforms treat content as "pages." Sanity treats content as structured data — and that changes everything.

Sanity is an open-source headless CMS with a real-time editing experience. Your content lives in a hosted data store, and you query it with GROQ (their query language) or GraphQL.

What Makes Sanity Different

• Sanity Studio — a React-based, fully customizable editing environment
• GROQ — a powerful query language designed specifically for content
• Real-time collaboration — multiple editors, no conflicts
• Portable Text — rich text as structured data (not HTML blobs)
• Asset pipeline — automatic image optimization and transformations

Free Tier (Developer Plan)

• Unlimited projects
• 3 non-admin users
• 500K API requests/month
• 10GB bandwidth
• 5GB assets storage
• Unlimited documents

Quick Start: Querying with GROQ

GROQ is incredibly expressive:

import { createClient } from '@sanity/client';

const client = createClient({
  projectId: 'your-project',
  dataset: 'production',
  apiVersion: '2024-01-01',
  useCdn: true
});

// Get latest 10 posts with author details
const posts = await client.fetch(`
  *[_type == "post"] | order(publishedAt desc) [0...10] {
    title,
    slug,
    publishedAt,
    "author": author->{ name, image },
    "categories": categories[]->title,
    body
  }
`);

Portable Text: Rich Text Done Right

Instead of storing HTML, Sanity stores rich text as structured JSON:

// Render portable text in React
import { PortableText } from '@portabletext/react';

const components = {
  types: {
    code: ({ value }) => <pre><code>{value.code}</code></pre>,
    image: ({ value }) => <img src={urlFor(value).width(800).url()} />
  },
  marks: {
    highlight: ({ children }) => <span className="highlight">{children}</span>
  }
};

<PortableText value={post.body} components={components} />

Custom Studio

Sanity Studio is just a React app — customize everything:

// sanity.config.js
export default defineConfig({
  name: 'my-studio',
  title: 'My Content Studio',
  projectId: 'your-id',
  dataset: 'production',
  schema: {
    types: [
      {
        name: 'product',
        title: 'Product',
        type: 'document',
        fields: [
          { name: 'title', type: 'string', validation: Rule => Rule.required() },
          { name: 'price', type: 'number', validation: Rule => Rule.positive() },
          { name: 'description', type: 'portableText' },
          { name: 'image', type: 'image', options: { hotspot: true } }
        ]
      }
    ]
  }
});

Real-Time Subscriptions

Listen for content changes in real-time:

const subscription = client.listen('*[_type == "post"]').subscribe(update => {
  console.log(`${update.transition}: ${update.result?.title}`);
  // "appear", "update", or "disappear"
});

The Bottom Line

Sanity turns content management into a developer-friendly experience. Structured content, real-time collaboration, and a customizable studio — all on a generous free tier.

---

Need to extract structured data from websites, monitor content changes, or build data pipelines? I build custom web scraping solutions.

📧 Email me: [e-mail]
🔧 My scraping tools: Apify Store