Skip to content

Latest commit

 

History

History
72 lines (57 loc) · 2.65 KB

CLAUDE.md

File metadata and controls

72 lines (57 loc) · 2.65 KB

CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

Build Commands

  • pnpm dev - Start development server with turbo mode
  • pnpm build - Build for production
  • pnpm start - Start production server
  • pnpm lint - Run ESLint

Architecture Overview

Headless WordPress starter using Next.js 16 App Router with TypeScript.

Data Layer (lib/wordpress.ts)

  • All WordPress REST API interactions centralized here
  • Type definitions in lib/wordpress.d.ts (Post, Page, Category, Tag, Author, FeaturedMedia)
  • WordPressAPIError class for consistent error handling
  • Cache tags for granular revalidation: ['wordpress', 'posts', 'post-{id}', 'posts-page-{n}']
  • Pagination via getPostsPaginated() returns { data, headers: { total, totalPages } }
  • Default cache: 1 hour (revalidate: 3600)

Routing

  • Dynamic: /posts/[slug], /pages/[slug]
  • Archives: /posts, /posts/authors, /posts/categories, /posts/tags
  • API: /api/revalidate (webhook), /api/og (OG images)

Data Fetching Patterns

  • Server Components with parallel Promise.all() calls
  • generateStaticParams() uses getAllPostSlugs() for static generation
  • URL-based state for search/filters via searchParams
  • Debounced search (300ms) in SearchInput component

Revalidation Flow

  1. WordPress plugin sends webhook to /api/revalidate
  2. Validates x-webhook-secret header against WORDPRESS_WEBHOOK_SECRET
  3. Calls revalidateTag() for specific content types (posts, categories, tags, authors)

Configuration Files

  • site.config.ts - Site metadata (domain, name, description)
  • menu.config.ts - Navigation menu structure
  • next.config.ts - Image remotePatterns, /admin redirect to WordPress

Code Style

TypeScript

  • Strict typing with interfaces from lib/wordpress.d.ts
  • Async params: params: Promise<{ slug: string }> (Next.js 15+ pattern)

Naming

  • Components: PascalCase (PostCard.tsx)
  • Functions/variables: camelCase
  • Types/interfaces: PascalCase

File Structure

  • Pages: /app/**/*.tsx
  • UI components: /components/ui/*.tsx (shadcn/ui)
  • Feature components: /components/posts/*.tsx, /components/theme/*.tsx
  • WordPress functions must include cache tags

Environment Variables

WORDPRESS_URL="https://example.com"      # Full WordPress URL
WORDPRESS_HOSTNAME="example.com"          # For Next.js image optimization
WORDPRESS_WEBHOOK_SECRET="secret-key"     # Webhook validation

Key Dependencies

  • Next.js 16 with React 19
  • Tailwind CSS v4 with @tailwindcss/postcss
  • shadcn/ui components (Radix primitives)
  • brijr/craft for layout (Section, Container, Article, Prose)