Kent C. Dodds' site

This repository contains the source code for kentcdodds.com, built with React Router v7, React, TypeScript, Vite, and Cloudflare Workers.

Tech stack

• React Router + React + TypeScript
• Vite build pipeline + @cloudflare/vite-plugin (local dev in workerd)
• Cloudflare Workers (production) with D1 + KV + R2
• Flat SQL migrations (services/site/migrations/) + @remix-run/data-table (runtime DB)
• Tailwind CSS
• Vitest and Playwright for testing

Prerequisites

• Node.js 26
• npm >=10
• git

Setup

1. Clone the repository.
2. Copy environment variables:
   • cp services/site/.env.example services/site/.env
3. Run the full setup script:
   • npm run setup -s

The setup script installs dependencies, resets the local D1 database (Miniflare), validates the project, installs Playwright browsers, and runs end-to-end tests.

This repo now uses npm workspaces. Install dependencies from the repository root so the site and worker packages share one lockfile and one node_modules tree. The site itself lives in services/site, while root npm run ... commands forward to that workspace for convenience.

Local development

Start the development server (MDX watcher sidecar + workerd via Vite):

• npm run dev

Then open http://localhost:3000. External APIs are mocked by default (MOCKS=true). Transactional emails are written to services/site/mocks/msw.local.json.

Git hooks

This repo uses Husky + lint-staged from the repository root.

• On git commit, staged files are formatted with Prettier, then the repo runs npm run lint:all, npm run typecheck:all, and npm run build:all.
• On git push, the repo runs npm run test:all.

If hooks stop running after a fresh clone, run npm install from the repo root to reinstall them via the prepare script.

Useful scripts

• npm run dev - start local development server
• npm run format:staged - format staged files the same way pre-commit does
• npm run test - run unit/component tests
• npm run test:all - run workspace tests used by pre-push
• npm run test:e2e:dev - run Playwright tests against dev server
• npm run lint - run Oxlint
• npm run lint:all - run lint across the site and workspace packages
• npm run typecheck - run TypeScript checks
• npm run typecheck:all - run TypeScript checks across all workspaces
• npm run build - build the app
• npm run build:all - run workspace builds used by pre-commit
• npm run nx:graph - inspect the Nx workspace graph

Contributing

For contribution guidelines and manual setup details, read CONTRIBUTING.md.