A Shadcn registry and collection of production-ready patterns and step-by-step guides (recipes) for full stack web AI apps
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Automates browser interactions for web testing, form filling, screenshots, and data extraction. Use when the user needs to navigate websites, interact with web pages, fill forms, take screenshots, test web applications, or extract information from web pages.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Guidelines for authoring fullstackrecipes content - setup recipes, exposed skills (in ./skills/), cookbooks, templates, and installable registry utilities. Use when creating or editing any catalog content. For maintainers building the fullstackrecipes project, not developers consuming the stack.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Skill for integrating Better Auth - the comprehensive TypeScript authentication framework.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Add UI components and pages for authentication flows including sign in, sign up, forgot password, reset password, and email verification.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Add email verification, password reset, and account management emails to Better Auth using Resend.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Add a complete account settings page with profile editing, password changes, email updates, session management, and account deletion.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Add server-side route protection to enforce authentication on specific pages while keeping others public.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Add user authentication using Better Auth with Drizzle ORM and Neon Postgres. Base setup with email/password authentication.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Better environment variable management for agents and humans with full type safety, CLI-based remote environment synchronization, and environment validation. Use when setting up typed config schemas, validating env variables, or managing remote env vars across Vercel, Netlify, Railway, Cloudflare, and Fly.io with…
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Codebase intelligence for JavaScript and TypeScript. Free static layer reports quality, changed-code risk, cleanup opportunities (unused files, exports, types, dependencies), code duplication, circular dependencies, complexity hotspots, architecture boundary violations, feature flag patterns, and opt-in security…
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Choose and create the right Neon branch type for testing and development. Use when users ask about Neon branching, migration testing with real data, isolated test environments, schema-only branch workflows for sensitive data, or branch creation via Neon CLI or Neon MCP. Triggers include "Neon branch", "test migrations…
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Diagnose and fix excessive Postgres egress (network data transfer) in a codebase. Use when a user mentions high database bills, unexpected data transfer costs, network transfer charges, egress spikes, "why is my Neon bill so high", "database costs jumped", SELECT optimization, query overfetching, reduce Neon costs…
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Guides and best practices for working with Neon Serverless Postgres. Covers setup, connection methods, branching, autoscaling, scale-to-zero, read replicas, connection pooling, Neon Auth, and the Neon CLI, MCP server, REST API, TypeScript SDK, and Python SDK. Use when users ask about "Neon setup", "connect to Neon"…
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's capabilities with specialized knowledge, workflows, or tool integrations.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance…
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Track custom events and conversions with Vercel Web Analytics via the track() call. Use when instrumenting user actions, conversions, or form submissions.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Read sessions client- and server-side, guard routes, and run sign in/up/out with Better Auth. Use when gating pages/APIs on auth or wiring auth flows.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Write type-safe Postgres queries with Drizzle ORM (select/insert/update/delete, relations, new tables). Use when querying or mutating the database or adding a Drizzle table.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Emit structured logs with Pino (levels, context-first signature, workflow-safe step wrapper). Use when adding logging to routes, libraries, or workflows.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Generate dynamic social preview images using Next.js file conventions and the next/og library. Server-rendered JSX images cached at build time.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Run a coding agent in an autonomous loop via a /ralph command, gated by a preflight check that every CLI is installed, linked, and authenticated. Use when driving long-running autonomous development from a wide, outcome-focused prompt.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Capture exceptions, attach user/context, add spans and breadcrumbs, and log via the Sentry SDK. Use when instrumenting errors, performance, or context in app code.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Syntax highlight code blocks with Shiki. Supports server-side rendering in RSC and automatic light/dark theme switching.
andrelandgraf/fullstackrecipes
Skill Claude CodeCodex
Choose and write the right test type (Playwright > integration > unit) against isolated Neon branches. Use when adding, running, or debugging tests for a feature.