andrelandgraf/fullstackrecipes
25 skills2.9k installs450 starsGitHub
Install
npx skills add https://github.com/andrelandgraf/fullstackrecipesSkills in this repo
1Ralph Loop WorkflowRalph Loop Workflow is an agent skill for solo and indie builders who want sustained autonomous development from a single broad prompt instead of hand-feeding tasks. It wires a /ralph-style command through a preflight check that confirms CLIs are installed, linked, and authenticated, then lets the agent harness own task decomposition while producing tests as executable acceptance criteria, user-facing documentation, and library changelogs. The loop emphasizes maximize time without human intervention: plan, build, verify, and iterate until checks pass. Verification spans typecheck, formatting, fallow, browser checks, tests, deploy, and production validation. It fits builders already using agent-first workflows and the Fullstack Recipes stack; it is not a substitute for missing test or lint setup—those recipes should be in place first.357installs2Og Image GenerationImplements dynamic Open Graph image generation for fullstack apps—template-driven renders with titles, branding, and page context—so shared links show polished previews that boost social click-through and reinforce brand across distribution channels.200installs3Shiki Code BlocksGuides agents to integrate Shiki code blocks in full-stack apps and docs: pick themes, register grammars, render highlighted HTML in Next or Vite, avoid hydration mismatches, and deliver readable, accessible snippets for tutorials, API references, and marketing pages.192installs4Use Fullstackrecipesuse-fullstackrecipes from andrelandgraf/fullstackrecipes teaches Claude to follow curated full-stack recipes for web apps, spanning frontend flows, backend APIs, and connecting infrastructure. It suits teams shipping SaaS or content products who want repeatable patterns instead of one-off stack decisions.190installs5Agent BrowserProvides recipes for agent-controlled browser automation: launch sessions, navigate pages, interact with elements, capture state, and chain web steps so AI agents can verify UIs, gather context, and execute real browser workflows during builds.179installs6Better Auth SetupFullstackrecipes skill for Better Auth setup: initialize the library, connect Postgres or SQLite adapters, configure GitHub or magic-link providers, protect API routes, handle callbacks, and verify login flows in dev before shipping authenticated SaaS features.151installs7Better Auth Protected RoutesThe better-auth-protected-routes skill documents how to secure pages and APIs with Better Auth in full-stack applications. It implements session-aware guards and middleware so authenticated-only areas remain protected consistently across server and client boundaries.149installs8Better Auth ComponentsFullstackrecipes skill for wiring Better Auth into React/Next apps with prebuilt sign-in, registration, OAuth, and session components so teams ship consistent login UX without custom auth UI from scratch.148installs9Better Auth Profilebetter-auth-profile from andrelandgraf/fullstackrecipes guides implementing Better Auth user profile APIs, session identity, and update patterns in fullstack TypeScript apps.146installs10Better Auth EmailsGuides implementation of Better Auth email integrations for full-stack apps: configure providers, templates, and callbacks for verification and password flows, align environment URLs, and ship reliable transactional auth emails.145installs11Vercel React Best PracticesVercel-react-best-practices is a React and Next.js performance guide maintained by Vercel. It contains 45 rules across 8 categories, from eliminating waterfalls and bundle size to re-render and rendering optimization. A developer references it when writing, reviewing, or refactoring React/Next.js code for performance.137installs12Skill CreatorSkill-creator is a meta guide for authoring new Claude skills. It documents the required SKILL.md file, its YAML frontmatter, and the optional scripts, references, and assets folders. A developer uses it when creating or updating a skill so the structure and description are clear enough for the agent to trigger it correctly.133installs13Better Auth Best PracticesThis skill is an integration guide for Better Auth, a TypeScript-first, framework-agnostic authentication framework. It documents environment variables, core config options, database and ORM adapters, session management, email flows, security settings, hooks, and plugins. Developers use it when configuring or extending Better Auth in a TypeScript app.131installs14Web Design GuidelinesWeb-design-guidelines reviews UI code for compliance with the Web Interface Guidelines. It fetches the latest guidelines, reads the specified files, checks them against all rules, and outputs findings in file:line format. A developer uses it to review UI, check accessibility, or audit design and UX.88installs15Sentry Best PracticesThis skill shows how to instrument errors and performance with the Sentry Next.js SDK: capturing exceptions, attaching user and per-exception context (tags and extra), adding performance spans and breadcrumbs, and logging via the Sentry logger. Developers use it when instrumenting errors, performance, or context in application code. It assumes the Sentry Setup recipe is already complete.55installs16Testing Best PracticesTesting-best-practices helps a developer choose the right test type and write it correctly. It ranks Playwright browser tests over integration tests over unit tests, and runs everything against an isolated Neon database branch that auto-deletes. A developer uses it when adding, running, or debugging tests for a feature.55installs17Logging Best PracticesThis skill shows how to emit structured logs with Pino across routes, libraries, and workflows, using a context-first signature (context object first, message second). It documents log levels from trace to fatal, the LOG_LEVEL threshold, API-route logging with timing context, and a use-step wrapper so workflows can log safely. Developers use it when adding logging to an application.54installs18Authentication Best PracticesThis skill shows how to read Better Auth sessions on the client and server, guard routes by redirecting unauthenticated users, and run sign in, sign up, and sign out flows in a Next.js app. Developers use it when gating pages or API routes on authentication or wiring auth flows. It assumes Better Auth is already set up and imports from canonical paths like @/lib/auth/client and @/lib/auth/server.53installs19Workflow Best PracticesWorkflow-best-practices builds durable workflows with the Workflow Development Kit. It covers the 'use workflow' orchestration and 'use step' checkpoint directives, streaming agent runs, and persisting results. A developer uses it when authoring, starting, resuming, or persisting a workflow.53installs20Url State PatternsUrl-state-patterns shows how to sync React state to URL query params using the nuqs library. It covers the required Suspense wrapper, parsers with defaults, clearing params, and driving deep-linkable dialogs from the URL. A developer uses it when building shareable filters, search, or URL-driven dialogs.51installs21Analytics Best PracticesA skill that shows how to track custom events and conversions with Vercel Web Analytics using the track() call. It covers naming events consistently, firing them inside component event handlers, and testing them in development mode. A developer uses it when instrumenting user actions, conversions, or form submissions in a Vercel app.49installs22Better EnvThis skill covers better-env, a tool for typed environment variable management with CLI-based remote sync and validation. It shows how to define typed config modules with configSchema, validate that all declared env variables exist per environment, and keep local dotenv files in sync with hosted providers. Developers use it when setting up typed config schemas, validating env vars, or managing remote env vars across Vercel, Netlify, Railway, Cloudflare, and Fly.io.49installs23Drizzle QueriesThis skill shows how to write type-safe Postgres queries with Drizzle ORM: selecting, inserting, updating, deleting, relational queries, and adding a new table. Developers use it when querying or mutating the database or adding a Drizzle table. It assumes the Neon plus Drizzle setup recipe is already complete and imports db from @/lib/db/client.48installs24Authoring RecipesThis skill gives maintainers guidelines for authoring fullstackrecipes content: setup recipes, exposed skills, cookbooks, templates, and registry utilities. It covers where skill files live, how the loader strips frontmatter to the first heading, naming conventions, and the three recipe tiers. It is for maintainers building the fullstackrecipes project itself, not for developers consuming the stack.46installs25Neon PostgresThis skill is a set of guides and best practices for working with Neon serverless Postgres, which separates compute and storage for autoscaling, branching, instant restore, and scale-to-zero. It covers getting started, connection methods and drivers, Neon Auth, the PostgREST-style data API, the Neon CLI, and the Platform API/SDKs, pointing to reference files for each. Developers use it for any Neon-related questions.46installs