How I build a Next.js Tailwind marketing site in hours, not days
A practical Next.js Tailwind workflow: design tokens as CSS variables, reusable component conventions, and a build sequence for shipping pages fast.
Tag
TypeScript
TypeScript patterns for Next.js and Sanity — typed schemas, GROQ result types, and end-to-end type safety.
26 posts
5 min read
How I set up Next.js TypeScript for production from day one
A production next.js typescript setup: strict tsconfig, typed routes, Zod boundaries, safe env vars, and a CI type-check gate that catches real bugs.
How I structure React Next.js patterns across every client project
The React Next.js patterns I reuse on every project: server components by default, colocated data fetching, typed API boundaries, and error conventions.
Tailwind Next.js starter: create-next-app vs popular boilerplates
Comparing create-next-app + manual Tailwind against popular starters. Which tailwind Next.js starter ages well in 2026 and which ones rot.
Next.js as a backend: honest limits for production apps
Next.js route handlers and server actions work for many backend needs, but have real limits. Here's where they hold and where they break.
Node.js CMS in 2026: Payload, Strapi, Directus, Keystone, and Sanity compared
Choosing a Node.js CMS for a custom website? Honest trade-offs across Payload, Strapi, Directus, Keystone, and Sanity with a side-by-side comparison table.
Next.js API routes vs route handlers: when to use each
Pages Router API routes vs App Router route handlers compared — caching, streaming, edge runtime, and a clear migration path with real code examples.
Tailwind CSS in 2026: what actually changed for teams
Tailwind CSS v4 rewired how teams configure, share, and ship styles. Here's what the CSS-first engine means in practice.
How I Migrate WordPress to Sanity + Next.js: A Technical Walkthrough
A step-by-step guide to exporting WordPress content, mapping schemas, running an import script, converting HTML to Portable Text, and preserving SEO with 301 redirects.
Sanity Agent Actions: Complete Setup Guide for AI-Powered Content Workflows
How to configure Sanity Agent Actions to trigger AI content workflows from the API — generate drafts, translate, and enrich fields at scale. Includes working code examples and real automation patterns.
Sanity AI Assist Setup for Editors in Next.js
Step-by-step setup of Sanity AI Assist (@sanity/assist) in a Next.js + Sanity project: install, config, field instructions, and real editor workflows. Updated for 2026.
Strapi vs Contentful 2026: An Honest Side-by-Side Comparison
Strapi vs Contentful 2026 — self-hosted open-source vs managed SaaS. Pricing, admin UX, API, Next.js fit, and lock-in compared honestly.
Sanity Custom Validation Rules: A Practical Guide
Learn how to write Sanity custom validation rules: required fields, regex, async checks, cross-field logic, and clear editor error messages.
Sanity Structure Builder: Custom Ordering & Grouping
Learn how to configure Sanity Structure Builder's defaultOrdering, documentTypeList grouping, and icons so a 20+ schema Studio still feels deliberate.
Payload CMS vs Contentful 2026: Which Fits Your Next.js Project
Payload CMS vs Contentful compared on schema control, API, pricing curve, and Next.js fit for 2026. Pick the right tool before you commit.
Payload CMS vs Strapi in 2026: Complete Head-to-Head for Developers
Payload vs Strapi: compared on self-hosting costs, TypeScript support, plugin ecosystem, and real migration complexity. Here's which one wins for most teams — and why.
Sanity Roles & Document-Level Permissions (RBAC) Setup
Step-by-step guide to wiring Sanity CMS role-based access control with document-level permissions in a Next.js project. Covers custom roles, GROQ filters, and Studio UI.
React 19 New Hooks in Next.js App Router: What Changed
How useFormStatus, useActionState, and use() from React 19 changed the way I build forms and async UI in Next.js App Router. Concrete before/after code.
Sanity Studio Custom Input Component: A Colour Picker
Step-by-step guide to building a Sanity Studio custom input component using definePlugin, useFormValue, and PatchEvent with a real colour-picker example.
Advanced GROQ Queries: Joins, Coalesce & Array Flattening
Deep dive into advanced GROQ queries in Sanity: inline joins, the coalesce() function, conditional projections, and array flattening with real payload sizes measured.
How I use @next/bundle-analyzer to find and fix Next.js bundle size bloat
A step-by-step walkthrough of Next.js bundle size analysis and reduction: finding large imports, fixing vendor chunks, and trimming icon libraries.
Kill CLS on Sanity Images: sizes, width & height from Metadata
Kill CLS on Sanity images for good. Pull metadata.dimensions into next/image sizes and aspect-ratio boxes — exact GROQ and component code.
Sanity Portable Text Custom Components in Next.js
Learn how to build Sanity Portable Text custom components in Next.js — code blocks, callouts, embedded forms, and captioned images with full TypeScript types.
Sanity TypeGen: Fully Typed GROQ Queries in TypeScript
A step-by-step guide to Sanity TypeGen: CLI config, generating TypeScript types from GROQ queries, CI integration, and handling schema evolution gotchas.
Next.js App Router Tutorial 2026: Pages Router to Production
A practical Next.js App Router tutorial guide for 2026. Covers layouts, route groups, Server Components, data fetching, static export, and the metadata API.
Sanity CMS + Next.js App Router: A Practical Getting Started Guide
A step-by-step Sanity CMS + Next.js tutorial for developers setting up schemas, GROQ queries, and Sanity Studio with the App Router for the first time.