Gumroad

Prerequisites

• Node.jsfree

  Required for running the Next.js framework and build toolchains

• GitHubfree

  Version control and deployment integration

• Supabase Accountfree

  Managed PostgreSQL database, authentication, and file storage bucket

• Stripe Accountfree

  Test-mode payment processing for checkout testing

AI coding tools

• Claude Code

  Best-in-class agentic coding tool for scaffolding full-stack multi-file architectures and running test loops

• Cursor

  Ideal for iterative frontend component styling and reviewing UI diffs

Build guide

1. 01Database Schema & Authentication Scaffolding

   Initialize a Next.js project with Tailwind CSS and shadcn/ui. Set up Supabase authentication and define relational tables for creators, products, variants, purchases, and license keys. Implement Row Level Security policies so creators can only edit their own products.

   Initialize a new Next.js project configured with TypeScript, Tailwind CSS, and standard App Router structure. Connect Supabase for authentication and PostgreSQL database access. Create a comprehensive database migration schema with tables for 'profiles' (id, username, bio, avatar_url), 'products' (id, creator_id, title, description, price_cents, file_path, pay_what_you_want, is_subscription), 'variants' (id, product_id, name, price_diff_cents), 'purchases' (id, product_id, buyer_email, stripe_session_id, created_at), and 'license_keys' (id, purchase_id, product_id, key_string, activations_count). Write robust TypeScript types matching this schema and configure Supabase RLS policies ensuring public read access to published products and strict creator-only write access.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

2. 02Creator Storefront & Product Management Dashboard

   Build the creator dashboard where users can create, edit, and publish digital products, configure pricing models, and upload downloadable files. Build public creator profile pages and individual product sales pages.

   Build a dashboard layout in Next.js under app/dashboard with sidebar navigation for Products, Sales, and Settings. Create a product creation form supporting title, description, pricing (fixed or pay-what-you-want), and a file upload zone. Implement server actions that securely upload digital assets to Supabase Storage or Cloudflare R2 and save product records. Build public storefront routes at app/[username]/[productId] featuring a clean checkout preview, dynamic variant selectors, and responsive typography optimized for conversion.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

3. 03Stripe Checkout Integration & Digital Asset Delivery

   Implement Stripe Checkout sessions for purchasing products. Handle webhook verification to fulfill orders, generate signed download links, and issue license keys upon successful payment.

   Implement Stripe Checkout integration for digital product purchases. Create an API route or server action that generates a Stripe Checkout session with metadata containing product_id and buyer details. Write a Stripe webhook endpoint (/api/webhooks/stripe) to handle 'checkout.session.completed'. Upon receipt, record the purchase in the database, automatically generate a unique software license key if the product requires one, and trigger a fulfillment email containing a secure, time-limited signed download link from storage.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

4. 04Secure File Storage & Download Portal

   Build a customer download portal where buyers can access their purchased files via secure, expiring signed URLs, protecting original files from hotlinking and public scraping.

   Build a customer library/download portal at app/library where buyers can enter their email to view all products they have purchased across creators. Implement a secure file-download endpoint that validates ownership against the 'purchases' table and generates a short-lived signed URL (e.g., valid for 15 minutes) using Supabase or R2 storage SDKs, streaming the asset directly to the verified purchaser without exposing bucket URLs.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

5. 05License Key Generation & Validation API

   Build a lightweight licensing API that software developers can use to check license key validity and track activation counts from desktop or web applications.

   Create a REST API endpoint at /api/v1/licenses/verify that accepts a product_id and a license_key string. The endpoint must check the 'license_keys' table, verify whether the key is valid and has not exceeded maximum allowed activations (default to 3), increment the activation count securely using a Postgres transaction, and return a JSON payload with activation status, customer email, and expiration data. Include API rate limiting and basic error handling.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

6. 06Creator Analytics & Sales Dashboard

   Build analytics views for creators to track daily sales volume, revenue graphs, customer geographic insights, and recent purchase activity.

   Build a sales analytics dashboard for creators within app/dashboard/sales. Use Tailwind CSS and a charting library like Recharts to display revenue over time (daily/monthly aggregations), total sales count, and average order value. Query purchase records grouped by date and product using SQL aggregation queries in Supabase. Include a sortable recent transactions table showing buyer email, product sold, amount paid, and timestamp.

   ⧉copy promptopen in Claude CodeCopen in Codexopen in Cursor

Cost vs paying for Gumroad