Backend — Teman Isyarat

Sanity CMS Content Studio powering the Teman Isyarat web platform. Serves as the headless content management backend for articles and team profiles, consumed by the Next.js frontend client.

---

Overview

This Studio manages structured content for the Teman Isyarat landing site:

• Articles — Blog posts and project updates
• Authors — Team member profiles
• Categories — Article taxonomy

Content is authored via the Sanity Studio interface and served to the frontend via Sanity's CDN API with GROQ queries.

---

Tech Stack

Layer	Technology
CMS Framework	Sanity v5
UI Framework	React 19
Plugins	Structure Tool, Vision Tool
Language	TypeScript
Styling	styled-components

---

Project Structure

backend/
├── components/
│   └── Icon.tsx              # Custom Sanity Studio logo
├── schemaTypes/
│   ├── index.ts              # Schema registry
│   ├── article.ts            # Artikel document schema
│   ├── author.ts             # Penulis document schema
│   └── category.ts           # Kategori document schema
├── static/
│   └── icon-teman-isyarat.png
├── sanity.config.ts          # Studio configuration
├── sanity.cli.ts             # CLI configuration
└── package.json

---

Content Schemas

Artikel (Article)

Field	Type	Description
article	string	Title
slug	slug	URL path (max 96 chars)
image	image	Thumbnail with hotspot
content	array(block)	Rich text body
author	reference	Link to Penulis
category	reference	Link to Kategori
date	datetime	Publish date
readingTime	number	Minutes to read

Penulis (Author)

Field	Type	Description
name	string	Full name
slug	slug	URL path (max 96 chars)
bio	string	Short biography
image	image	Profile photo with hotspot

Kategori (Category)

Field	Type	Description
category	string	Category name
slug	slug	URL path (max 96 chars)

---

Getting Started

# Install dependencies
npm install

# Start development server
npm run dev

# Build for production
npm run build

# Deploy Studio
npm run deploy

# Deploy GraphQL API
npm run deploy-graphql

The Studio runs on http://localhost:3333 by default.

---

Configuration

Key	Value
Project ID	mxxqb8kk
Dataset	production
Auto-updates	Enabled

Configuration is split across two files:

• sanity.config.ts — Studio plugins, schema registration, branding
• sanity.cli.ts — Deployment and API settings

---

API

Content is served via Sanity's CDN API at:

https://mxxqb8kk.api.sanity.io/v{apiVersion}/data/query/production?query={groq}

The frontend client consumes this endpoint using raw fetch with ISR-based caching (revalidation every 5 minutes). See frontend/src/lib/sanity.ts for query details.