How to vibe codePayhip

Prerequisites

• Node.jsfree

  Runtime for running the Next.js full-stack framework and build tools.

• GitHubfree

  Version control and continuous deployment connection to hosting providers.

• Stripe Accountfree

  Test mode credentials required to build and verify checkout and payment webhook processing.

AI coding tools

• Claude Code

  Agentic terminal coding tool best equipped to build multi-file database models, API routes, and frontend views iteratively.

• Cursor

  AI-native editor for detailed UI refinement on storefront components and checkout forms.

Build guide

1. 01Project Scaffolding & Database Schema

   Initialize the Next.js project with Tailwind CSS, configure Drizzle ORM connected to Neon Postgres, and define database schemas for users, products, orders, and license keys.

   Create a new Next.js project using Tailwind CSS and TypeScript. Configure Drizzle ORM to connect to a Neon Postgres instance. Write the complete database schema in `db/schema.ts` with tables for users (creators), products (title, description, price, fileUrl, type), orders (stripeCheckoutSessionId, customerEmail, amount, status, createdAt), and licenseKeys. Set up relational constraints and indexes. Include migration scripts and a test seed script with dummy creator accounts and digital products to verify the data layer.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

2. 02Authentication & Creator Dashboard

   Implement authentication using better-auth and create the creator onboarding dashboard where users can manage their store profile and add digital products.

   Implement authentication using `better-auth` supporting email/password sign-up and login. Create a protected dashboard route `/dashboard` where authenticated creators can view their sales statistics, list their products, and access a product creation form. The product creation form must allow setting a title, description, price, and uploading a digital file. Store uploaded file references securely and save product records to the Neon database via Server Actions.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

3. 03Storefront Builder & Public Product Pages

   Build public storefront pages for creators featuring customizable bio layouts and direct product checkout buttons.

   Build a dynamic public storefront route `/[username]` that fetches the creator profile and their published products from Neon. Create clean, responsive product cards and an individual product detail page at `/[username]/p/[productId]`. Include a 'Buy Now' button that initiates a checkout flow. Add basic storefront customization options in the dashboard (store name, accent color, bio) and apply them dynamically on the public storefront.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

4. 04Stripe Checkout & Webhook Integration

   Implement secure checkout sessions via Stripe API and handle webhook events to fulfill orders and issue secure download links.

   Implement Stripe Checkout server integration. When a buyer clicks 'Buy Now', create a Stripe Checkout Session via API passing product metadata. Create a Stripe webhook endpoint at `/api/webhooks/stripe` that listens for `checkout.session.completed`. Upon successful payment, verify the event signature, record the order in the Neon database, generate a secure random license key, and trigger an automated receipt email to the buyer via Resend containing a secure download link.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

5. 05Secure Digital Asset Delivery & Download Portal

   Build a secure file download system using tokenized expiring URLs to prevent unauthorized file sharing.

   Build a secure digital download delivery route at `/api/download/[token]`. When an order is completed, generate a cryptographically secure token tied to the order ID with an expiration window. When a buyer accesses the download link with a valid token, stream the file securely from object storage or protected local storage without exposing raw file URLs. Handle expired tokens gracefully with a request-new-link form.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

6. 06Tax Compliance Engine & Discount Codes

   Add basic geographic tax calculation logic for EU/UK VAT simulation and a coupon discount code system at checkout.

   Add a discount code system where creators can create coupon codes (percentage or fixed amount off) in their dashboard and apply them at checkout. Implement basic geographic tax handling: detect buyer country from Stripe checkout session billing details, calculate a simulated EU/UK digital VAT percentage based on country rules, and add it to the final invoice total. Record tax amounts collected in the order database record for reporting.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

Cost vs paying for Payhip