--- title: "How-To Guides & Tutorials" slug: "howto" category: "howto" tags: ["moc", "howto", "tutorial", "guides"] status: "stable" last_updated: 2026-09-01 summary: "Concrete step-by-step guides for the tasks developers repeat. Each guide pairs the rule with a verified procedure." --- > Step-by-step tutorials for the tasks developers run again every few months. Each guide names the prerequisites, walks the steps with the exact commands, ends in a verification a script could check, and links the umbrella pages it builds on. ## Pages - [[howto/launch-a-new-site]]: The ordered zero-to-indexed runbook: repo, deploy, DNS, discoverability files, search registration, and verification, with a copy-paste checklist. - [[howto/deploy-quartz-site]]: Fork Quartz, wire the GitHub Pages workflow, point a custom domain, verify with `curl`. - [[howto/set-up-claude-code]]: Install Claude Code, write the `CLAUDE.md` anchor, set up `TODO.md`, ship the first PR. - [[howto/add-jsonld-to-static-site]]: Pick the right schema types, inject JSON-LD into ``, validate with the Rich Results Test. - [[howto/optimize-core-web-vitals]]: Measure with CrUX and `web-vitals`, fix LCP, CLS, and INP, re-measure at p75. - [[howto/write-llm-friendly-content]]: Ship `/llms.txt`, `/ai.txt`, JSON-LD, OG cards, raw markdown links, and named heuristics agents can cite. - [[howto/ship-llms-txt]]: Decide structure, write the summaries, place the file at the site root, link from `robots.txt` and `ai.txt`. - [[howto/debug-postgres-slow-query]]: Enable `pg_stat_statements`, find the offender, run `EXPLAIN ANALYZE BUFFERS`, add the right index, confirm the new plan. - [[howto/run-a-quartz-static-site-locally]]: Clone, install Node 22, run `npx quartz build --serve`, fix port, theme, and plugin-order errors. - [[howto/audit-site-for-core-web-vitals]]: Lighthouse, CrUX, and web-vitals JS to measure LCP, INP, and CLS, then triage in priority order. - [[howto/configure-typescript-strict]]: enable strict, fix errors starting with noImplicitAny, add noUncheckedIndexedAccess, verify a clean build. - [[howto/deploy-to-vercel]]: import a project, set env vars, configure the build, attach a custom domain, enable preview deploys. - [[howto/migrate-css-to-tailwind]]: install Tailwind v4, remove conflicting resets, convert components using @theme tokens, lint with the sort plugin. - [[howto/optimize-images-for-web]]: resize to display dimensions, convert to WebP and AVIF, add lazy loading, set explicit width and height. - [[howto/run-claude-code-with-mcp]]: configure an MCP server in settings.json, restrict permissions, verify the connection with /mcp. - [[howto/set-up-cloudflare-tunnel]]: install cloudflared, create a named tunnel, route a hostname through Cloudflare DNS, run as a service. - [[howto/set-up-postgres-locally]]: install Postgres, create a role and database, configure pg_hba auth, connect via psql. - [[howto/set-up-pytest]]: add pytest and pytest-cov to pyproject.toml, write conftest.py, use fixtures, verify with --collect-only. - [[howto/write-meta-descriptions]]: write 150-160 character descriptions with the primary keyword and a clear benefit; A/B test with GSC. - [[howto/add-llms-txt-to-existing-site]]: Write a compliant /llms.txt index, place it at the site root, add the ai.txt sibling, cross-link from robots.txt, and verify with curl. - [[howto/audit-llms-txt-with-claude]]: Fetch /llms.txt from a live site, send it to Claude with a validation prompt, identify format violations and missing pages, then fix and re-validate. - [[howto/build-an-mcp-server]]: Choose a stack, define tools with JSON Schema, register the server, and verify it in MCP Inspector before wiring to Claude Code. - [[howto/connect-claude-to-postgres-via-mcp]]: Install the MCP postgres server, configure credentials safely, connect from Claude Code, and run a test query to confirm the integration works. - [[howto/wire-up-anthropic-sdk]]: Install the Anthropic Python SDK, load the API key, send a messages request, stream a response, and add a tool definition. - [[howto/set-up-rag-pipeline]]: Chunk documents, embed with a hosted model, store in pgvector, retrieve top-k at query time, and ground the answer with citations. - [[howto/configure-pgvector-on-neon]]: Enable the pgvector extension on a Neon database, create an embedding table, insert vectors, add an HNSW index, and run a similarity query. - [[howto/set-up-ollama-locally]]: Install Ollama, pull a model, run an interactive chat, set a system prompt, and integrate with the REST API or LangChain. - [[howto/deploy-fastapi-on-fly]]: Write a Dockerfile, configure fly.toml, set secrets, attach a Postgres add-on, deploy, and verify with curl. - [[howto/write-tests-for-fastapi]]: Wire pytest with TestClient, override dependencies for database isolation, and write fixtures that reset state between tests. - [[howto/migrate-postgres-database]]: Dump with pg_dump, restore with pg_restore, plan for downtime, verify row counts, and execute a clean cutover with minimal risk. - [[howto/optimize-postgres-query]]: Find the offender with pg_stat_statements, read the plan with EXPLAIN ANALYZE, add a targeted index, and verify the new plan matches expectations. - [[howto/migrate-react-to-server-components]]: Identify client/server boundaries, mark interactive subtrees with 'use client', move data fetching to async server components, and verify bundle size drops. - [[howto/set-up-cloudflare-r2]]: Create an R2 bucket, generate API keys, attach a public domain, and access it with the AWS CLI or boto3 via the S3-compatible endpoint. - [[howto/set-up-cloudflare-workers]]: Initialize a Worker with wrangler, write a fetch handler, bind KV storage, deploy to production, and verify with a curl request. - [[howto/set-up-quartz-with-cloudflare-pages]]: Fork Quartz, push to GitHub, connect Cloudflare Pages, configure baseUrl, and point a custom domain without touching GitHub Pages. - [[howto/run-pa11y-locally]]: Install pa11y, write a .pa11yci.json config, run a scan, fix the common issues, and plug pa11y-ci into a GitHub Actions workflow. - [[howto/configure-pa11y-thresholds]]: Set per-rule threshold overrides, add ignore patterns for acceptable failures, and wire the config to CI so new violations break the build. - [[howto/audit-dependencies]]: Run npm audit or pip-audit, classify findings by severity, patch or accept risk, re-test, then add a scheduled CI job to catch new CVEs. - [[howto/write-a-cursor-rule]]: Write a .cursorrules file for a TypeScript project: set voice rules, scope conventions, code style, and test expectations so the AI assistant follows the project's standards. - [[howto/static-site-seo]]: Ship every SEO artifact a static site needs at build time: canonicals, sitemap, robots, JSON-LD, OG images, llms.txt, then verify with curl before deploy. - [[howto/seo-migration-playbook]]: Run an SEO-safe site migration: crawl, build a redirect map, stage on noindex, flip DNS, submit sitemaps, monitor coverage for 4 weeks. - [[howto/master-google-search-console]]: Verify a property, submit sitemaps, and use every major GSC report (Performance, Coverage, URL Inspection, Enhancements) for weekly health checks. - [[howto/audit-a-package-json-for-vulnerabilities]]: Run npm audit or pnpm audit, interpret severity levels, fix resolvable issues, and add audit to CI to catch regressions. - [[howto/configure-vscode-for-typescript-projects]]: Configure VS Code with workspace settings, extensions, and TypeScript project references for accurate type checking on large projects. - [[howto/deploy-a-static-site-to-cloudflare-pages]]: Connect a GitHub repository to Cloudflare Pages, configure the build command and output directory, and deploy a static site with a custom domain. - [[howto/migrate-from-npm-to-pnpm]]: Replace npm with pnpm in a project or monorepo: install pnpm, import the lock file, fix phantom dependencies, and update CI. - [[howto/optimize-an-image-pipeline-with-sharp]]: Use Sharp to resize, convert to WebP or AVIF, and compress images in a Node.js build pipeline to reduce page weight and improve Core Web Vitals. - [[howto/set-up-an-mcp-claude-code-skill]]: Register an MCP server as a skill in Claude Code so the agent can call external tools during sessions. - [[howto/set-up-bun-as-a-package-manager]]: Install Bun, initialize a project, and run installs and scripts to replace npm or pnpm with Bun's faster runtime and package manager. - [[howto/set-up-github-actions-cache]]: Configure GitHub Actions cache for Node.js dependencies, build outputs, and tool caches to cut CI run times by 50 to 80 percent. - [[howto/write-an-llms-full-txt-generator]]: Write a Node.js script that concatenates your site's Markdown content into a single llms-full.txt file for LLM agents that need the full corpus. - [[howto/write-claude-md-from-scratch]]: Write a CLAUDE.md anchor file that gives Claude Code reliable session context: mission, schema, voice rules, folder map, and workflow checklist. - [[howto/bootstrap-a-research-vault]]: Generate an Obsidian research vault from a spec with the vault-architect scripts, run its deterministic auditor, close the autofix loop, and assemble the semantic-audit bundle. ## Related MOCs - [[seo/index|SEO]] - [[knowledge-vaults/index|Knowledge Vaults]] - [[ops/index|Ops]] - [[ai-agents/index|AI Agents]] - [[tooling/index|Tooling]] - [[backend/index|Backend]]