Skip to content
thehardik

Getting started

Hardik Desai

Full-stack developer in Ahmedabad. I build Next.js + Sanity sites in production, publish open-source Sanity plugins on npm, and write up notes on the web as I learn them. Lately: sanity-plugin-seofields.

articles11sites on one codebase12+years in production4.5+
Browse projects Get in touch

Quickstart#

Where to go first, depending on why you're here.

Featured package#

My most-used open-source project: an SEO toolkit for Sanity Studio, in active development since September 2025.

sanity-plugin-seofields

Sanity Studio plugin · Sanity v3 · v4 · v5 · v6

The complete SEO toolkit for Sanity Studio. SEO fields, social metadata, Schema.org JSON-LD, AI-generated copy and an SEO health dashboard — inside Sanity Studio, with render helpers for Next.js, Astro, Nuxt, SvelteKit and Remix.

versionv1.12.0licenseMITdownloads6.1k/mo
Project page Docs GitHub npm

Install

npm install sanity-plugin-seofields

Render it in the App Router

app/[slug]/page.tsxts
import {buildSeoMeta} from 'sanity-plugin-seofields/next'

export async function generateMetadata() {
  const page = await getPage()
  return buildSeoMeta({
    seo: page.seo,
    path: `/${page.slug}`,
  })
}

Feature reference#

Everything the plugin adds to Studio and to your front end.

01One field, full coverage
A single seoFields type: title, description, canonical, keywords, robots, Open Graph, X/Twitter, hreflang and custom meta tags.
02Live SERP preview
Editors see the Google result and social cards while they type, with character counters and focus-keyword checks.
03Schema.org JSON-LD
Structured-data types for BlogPosting, FAQ, Breadcrumbs and more, plus React / Next.js helpers to render them.
04AI-assisted copy
Generate titles and descriptions from the document body, through a server-side proxy so keys never reach the browser.
05SEO health dashboard
Audit every document from one pane, score it, and export the report as CSV or JSON. A publish gate can warn below a score.
06Framework-neutral head
buildSeoMeta() for the Next.js App Router, buildSeoHead() for Astro, Nuxt, Vue, SvelteKit, Remix and custom renderers. Plus a CLI.

Professional work#

Most of my hours go into client sites I can't link to. Here's the shape of that work.

Multi-tenant pharmacy platform

12+ UK pharmacy websites running from one shared Next.js + Sanity codebase — per-tenant content, shared components, one deploy pipeline.

  • Next.js
  • Sanity
  • Multi-tenant

WordPress → Sanity migrations

Moving content-heavy marketing sites off WordPress onto structured Sanity schemas with typed GROQ and live preview.

  • Sanity
  • Migration
  • GROQ

Freelance builds

Marketing sites, dashboards and internal tools for small businesses — React, Next.js, Laravel and Node.

  • React
  • Laravel
  • Node

Latest writing#

Tutorials and deep dives, written while building real projects.

All 11 articles
  1. How to Add SEO to Sanity Studio in 5 MinutesLearn how to add production-ready SEO to Sanity Studio using sanity-plugin-seofields. Covers metadata, Open Graph, Twitter Cards, and JSON-LD — with real code examples for Next.js App Router.
  2. Why Website Performance, Structured Data, Accessibility, HTML & Meta Tags Matter
  3. From Problem-Solving to Output Curation: Are We Losing Depth in the AI Era?In a world where AI can generate solutions instantly, are we still thinking deeply or just curating outputs? This piece explores how problem-solving is evolving and whether developers are trading understanding for convenience.
  4. CSS Shorthand vs Longhand Properties Explained with Simple ExamplesLearn CSS shorthand and longhand properties with simple examples. This guide helps frontend developers understand how shorthand works, when to use longhand, and best practices for writing clean and maintainable CSS.

Stack#

A working set, not a wishlist. Things I've shipped, debugged at 2 AM, and would reach for again tomorrow.

Frontend
FluentReactNext.jsTypeScriptJavaScriptHTML5CSS3
Working—
Nodding—
Style & motion
FluentTailwind CSSSCSS
WorkingGSAPFramer MotionBootstrap
Nodding—
Data & state
FluentReact QueryREST
WorkingGraphQLRedux
Nodding—
Backend & infra
FluentNode.js
WorkingExpressPHPMongoDBPostgreSQL
NoddingLaravel
Content & CMS
FluentSanityGROQ
WorkingStrapiWordPress
Nodding—
Tooling & craft
FluentGitVite
WorkingWebpackJestAuthPerformance
Nodding—

The Build Log

New posts, plugin releases, and the Sanity + Next.js tricks that didn't fit in a blog post. About once a month.