#Windsurf
51 entries
Prompt to Add Cloudflare R2 File Upload
Copy-paste AI prompt to add Cloudflare R2 presigned upload URLs to a Next.js App Router project with server-side validation.
Prompt to Add Dark Mode with Tailwind CSS v4
AI agent prompt to add system-aware dark mode to a Next.js app using Tailwind CSS v4 CSS variables and next-themes, with no flash on load.
Prompt to Add PostgreSQL Full-Text Search
Copy-paste AI prompt to add native PostgreSQL full-text search with tsvector, GIN index, and ranked results to an existing Next.js app.
Prompt to Add a Sitemap and robots.txt
AI agent prompt to add a dynamically generated sitemap.xml and a correct robots.txt to a Next.js or Astro project for better search indexing.
Prompt to Add Stripe Checkout to a Next.js App
AI agent prompt to add Stripe Checkout with webhook handling, customer portal, and subscription status to a Next.js App Router project.
Prompt to Build a Cloudflare Worker API Proxy
Copy-paste AI prompt to build a Cloudflare Worker that proxies and rate-limits external API calls, adds auth headers, and caches responses.
Prompt to Build a Next.js AI Tool Directory
AI agent prompt to build a searchable Next.js AI tool directory with MDX data files, category filters, and static generation.
Prompt to Build a SaaS Pricing Page in Next.js
Copy-paste AI prompt to build a SaaS pricing page in Next.js with Tailwind, toggle billing, and Stripe-ready plan data.
Prompt to Build an Astro Static SEO Site
Copy-paste prompt for scaffolding a fully optimized Astro static site with content collections, sitemap, og-images, and TypeScript.
Prompt to Create a GitHub Actions Deploy Workflow
AI agent prompt to generate a production GitHub Actions CI/CD workflow for a Next.js app with type-check, test, build, and deploy steps.
Prompt to Create an Admin Dashboard in Next.js
AI agent prompt to build a protected Next.js admin dashboard with data tables, server-side auth guards, and a sidebar layout using Tailwind.
Prompt to Generate OG Images at Build Time
AI agent prompt to generate per-page Open Graph images at build time in Astro or Next.js using Satori and sharp, with no external service.
Prompt to Migrate a Next.js 14 App to Next.js 16
Structured AI agent prompt to migrate a Next.js 14 App Router project to Next.js 16 with breaking-change handling and incremental steps.
Prompt to Refactor a React Component Safely
Structured AI agent prompt to refactor a complex React component with a read-audit-refactor-verify loop that prevents regressions.
AGENTS.md Rules for an Astro Static Site
A drop-in AGENTS.md for Astro static sites that keeps AI agents on-stack, prevents SSR drift, and enforces content collection conventions.
AI Coding Rules for Auth and Security
AGENTS.md rules for authentication and security that prevent agents from rolling custom crypto, leaking secrets, or bypassing authorization checks.
AI Coding Rules for PostgreSQL Apps
AGENTS.md rules for PostgreSQL-backed apps covering query safety, migration discipline, indexing conventions, and preventing agents from writing N+1 queries.
AI Coding Rules for SEO Content Sites
AGENTS.md rules for SEO-focused content sites that prevent duplicate metadata, enforce structured data, and keep agents from breaking crawlability.
AI Coding Rules for Static Site Performance
AGENTS.md rules for static site performance that enforce Core Web Vitals, image optimization, font loading, and prevent agents from shipping render-blocking resources.
AI Coding Rules for TypeScript Strict Projects
AGENTS.md rules for TypeScript strict-mode projects that eliminate any types, enforce narrowing patterns, and prevent agents from compiling-but-wrong code.
Prompt-to-PR: Add a Pricing Page
SOP for generating a production pricing page with monthly/annual toggle, feature matrix, and Stripe Checkout links in a Next.js Tailwind project.
Prompt-to-PR: Add a Sitemap and robots.txt
SOP for adding a dynamic XML sitemap and robots.txt to a Next.js or Astro project — correct lastmod, priority, and crawl rules for production SEO.
Prompt-to-PR: Add an Admin Data Table
SOP for adding a server-side paginated, sortable, searchable admin data table in Next.js using TanStack Table and a PostgreSQL query — no ORM magic.
Prompt-to-PR: Add Better Auth to a Next.js App
Full SOP for wiring Better Auth into a Next.js App Router project — sessions, email/password, OAuth, and middleware protection in one pass.
Prompt-to-PR: Add Cloudflare R2 File Upload
End-to-end SOP for wiring presigned R2 uploads into a Next.js or Cloudflare Workers app — bucket binding, presigned URLs, and client upload flow.
Prompt-to-PR: Add Dark Mode
End-to-end SOP for adding flicker-free dark mode to a Next.js Tailwind app using next-themes — class strategy, system preference, and persisted toggle.
Prompt-to-PR: Add PostgreSQL Full-Text Search
SOP for adding native PostgreSQL full-text search with tsvector, GIN index, ts_rank, and a Next.js search API — no third-party search service needed.
Prompt-to-PR: Build a Static SEO Site with Astro
Complete SOP for scaffolding a content-driven static SEO site with Astro, Tailwind, MDX content collections, sitemap, and canonical tags from scratch.
Prompt-to-PR: Migrate Next.js 14 to 16
Step-by-step SOP for migrating a Next.js 14 App Router project to Next.js 16 — Turbopack, React 19, async APIs, and caching changes covered.
Checklist for Reviewing AI-Generated API Routes
A human review checklist for REST and RPC API routes written by AI coding agents — authentication, input validation, rate limiting, and error handling.
Checklist for Reviewing AI-Generated Auth Code
A human review checklist for authentication code written by AI coding agents — sessions, JWTs, OAuth flows, and authorization logic for web apps.
Checklist for Reviewing AI-Generated Cloudflare Workers
A human review checklist for Cloudflare Workers code written by AI coding agents — runtime limits, KV, D1, bindings, and security at the edge.
Checklist for Reviewing AI-Generated GitHub Actions
A human review checklist for GitHub Actions workflows written by AI coding agents — secret exposure, supply chain attacks, permissions, and deployment safety.
Checklist for Reviewing AI-Generated Next.js Code
A human review checklist for Next.js code written by AI coding agents — App Router, Server Components, data fetching, and deployment correctness.
Checklist for Reviewing AI-Generated Prisma Migrations
A human review checklist for Prisma schema changes and migrations written by AI coding agents — data loss, locking, and irreversible operations.
Checklist for Reviewing AI-Generated SEO Pages
A human review checklist for SEO-targeted pages written by AI coding agents — metadata, structured data, canonical URLs, and Core Web Vitals for Astro and Next.js.
Checklist for Reviewing AI-Generated Stripe Code
A human review checklist for Stripe integration code written by AI coding agents — webhook security, idempotency, race conditions, and payment flows.
Checklist for Reviewing AI-Generated Tailwind UI
A human review checklist for Tailwind CSS UI components written by AI coding agents — accessibility, responsiveness, dark mode, and purge safety.
How to Fix AI Breaking the Cloudflare Workers Runtime
AI agents import Node.js built-ins like fs, crypto, and path into Cloudflare Workers, causing runtime errors because the Workers runtime is not Node.js.
How to Fix AI Creating React Hydration Mismatches
AI agents generate React components that render different HTML on the server and client, triggering hydration errors and broken UI on first load.
How to Fix AI Forgetting Environment Variable Validation
AI agents read process.env values directly without validation, causing silent undefined bugs and missing startup errors when env vars are absent.
How to Fix AI Generating Invalid Prisma Relations
AI agents generate Prisma schema relations with missing back-relations, wrong referential actions, or mismatched field types that fail prisma validate and prisma migrate.
How to Fix AI Ignoring SEO Metadata
AI agents scaffold Next.js and Astro pages without title tags, Open Graph metadata, or canonical URLs, shipping pages that are invisible to search engines and social crawlers.
How to Fix AI Overusing useEffect
AI agents reach for useEffect to handle derived state, event transforms, and data fetching that should instead use useMemo, event handlers, or Server Components.
How to Fix AI Putting Server Code in Client Components
AI agents leak database queries, secret env vars, and Node.js APIs into 'use client' components, exposing server-only logic to the browser bundle.
How to Fix AI Coding Agents Using Outdated Next.js APIs
AI agents frequently generate Next.js code using deprecated Pages Router patterns, getServerSideProps, and removed APIs that break App Router projects.
How to Fix AI Writing Insecure SQL
AI agents build SQL queries with string interpolation instead of parameterized statements, introducing SQL injection vulnerabilities into production database code.
AI Tool Directory — Context Pack
Copyable context pack for an AI tool directory site built with Astro and PostgreSQL, so agents understand the submission flow, tagging system, and content model from prompt one.
Cloudflare Workers App — Context Pack
Copyable context pack for a Cloudflare Workers application with D1, KV, R2, and Hono so your AI agent understands the edge runtime constraints from the first prompt.
Next.js SaaS Starter — Context Pack
Copyable context pack for a Next.js SaaS app with App Router, Better Auth, Stripe billing, and Postgres so your AI agent works correctly from prompt one.
PostgreSQL Search App — Context Pack
Copyable context pack for a full-text and vector search application backed by PostgreSQL with pgvector, so your AI agent writes correct SQL and migration code from the start.