Agent skill · software engineering · davila7
building-blog
Use when adding a blog to a Next.js + Sanity site, building a blog section from scratch, integrating Sanity CMS for editorial content, or setting up an SEO-optimized article surface. Triggers on phrases like 'add a blog', 'build the blog', 'create blog section', 'set up blog with Sanity', 'integrate Sanity CMS', 'blog architecture', or any new-blog scoping conversation on a Next.js project.
Why this skill is useful
Provides a structured workflow and specific integration patterns for building a blog with Next.js and Sanity CMS that the AI wouldn't reliably generate on its own.
What it needs
Requires framer-motion, next, sanity, tailwindcss installed locally. Requires sanity account access. About 2k tokens when loaded. Last updated 2026-08-06. 30,138 stars on the source repository.
What this skill does
Building a Blog (Next.js + Sanity) Overview Universal workflow for adding a blog to a Next.js site backed by Sanity CMS. Targets a corporate blog: SEO-first, i18n-ready, performance-budgeted, accessibility-compliant. SKILL.md is the orchestrator. The spec lives in the two reference files. Files blog-technical-requirements.md — §0 intake questionnaire (30+ questions) → §1 Project Profile → §2–§20 universal spec → checklist. Edit only §0 answers and §1 per project. blog-image-style-guide.md — universal template for AI-generated hero imagery via Gemini 3 Pro Image (Nano Banana Pro). Intake questions on top, aesthetic skeleton in the middle, three example slots at the bottom. Workflow Step 1 — Scan the host project (before asking anything) Read what's already there. Pre-filling answers from detected values is much better than asking the user. Look for: package.json — Next.js version, next-intl, Sanity packages, Tailwind, framer-motion next.config.{ts,js,mjs} — existing images.formats, i18n config src/messages/, src/i18n/, messages/ — current locale set src/app/[locale]/ or app/[locale]/ — routing pattern tailwind.config., globals.css, design-system files — tokens, fonts CLAUDE.md, AGENTS.md, GEMINI.md — project conventions and approved overrides Existing sanity-studio/ or studio/ folder app/layout.{tsx,jsx} — fonts, analytics, motion config public/brand/, public/logo — publisher logo sitemap.ts, robots.ts — existing routes .env files — names of already-set env vars (do not log secret values) Record findings as a brief "Detected" list before the questionnaire. Step 2 — Run the intake questionnaire Open blog-technical-requirements.md and walk through §0. Claude Code: use AskUserQuestion. Group related questions into single calls (max 4 per call). Pre-fill recommended answers from the scan. Codex / CLIs without an interactive picker: list questions numerically in plain text, ask the user to answer in batches of 5–10. Show recommended answers from the scan. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills davila7/building-blog