SweetShop

A complete subscription platform delivering curated candy boxes monthly. Users select box sizes, manage subscriptions, track deliveries, and process payments through a streamlined interface built for recurring revenue.

Core Features

Multi-Step Subscription Flow

Three-stage wizard guides users from box selection through shipping details to payment. Each step validates input before progression, storing intermediate state in React Router location state. Users choose between Small ($24.99), Medium ($39.99), or Large ($59.99) boxes, select flavor preferences (Sweet, Sour, Mix), and complete address forms with real-time validation.

Recurring Payment Processing

Stripe subscription engine handles monthly billing automatically. Payment methods attach to customer profiles for seamless recurring charges. The system creates subscription objects with trial periods, proration handling, and 3D Secure support. Webhook endpoints process subscription lifecycle events, updating database records when payments succeed or fail.

Delivery Tracking System

Box history displays every shipment with status progression from Pending to Shipped to Delivered. Each entry includes delivery dates, tracking numbers, and detailed item lists showing candy contents. Users filter boxes by date ranges or status, with pagination for accounts receiving boxes over extended periods.

Profile Management Dashboard

Centralized profile interface enables address updates, preference editing, and subscription control. Users view active subscription details including next billing date and box configuration. Invoice history provides downloadable receipts for accounting. One-click cancellation initiates termination flow with optional feedback collection.

Precise Control Features

Supabase Authentication

JWT-based sessions with Row Level Security enforce data isolation per user

Admin Dashboard

Role-based access to user management, subscription stats, and box shipping

Webhook Integration

Real-time subscription updates via Stripe event handlers with signature verification

Technical Foundation

Built with production-grade tools for reliable subscription management and payment processing at scale.

React 18 + TypeScript

Component architecture with hooks and custom state management ensures type safety across the subscription lifecycle

Express.js API

RESTful backend handles subscription creation, cancellation, status checks, and webhook event processing

Supabase PostgreSQL

Managed database with Row Level Security, real-time subscriptions, and automatic backups for user data

Stripe Subscriptions

PCI-compliant recurring billing with Elements integration, customer management, and automated invoice generation

TailwindCSS

Utility-first styling with responsive design patterns and dark mode support across all interfaces

Vite Build System

Fast hot module replacement during development with optimized production builds and API proxy configuration

Performance Advantage: Vite provides sub-second hot module replacement during development. Production builds leverage tree-shaking and code-splitting, while API requests proxy through Vite's dev server to eliminate CORS configuration complexity.

Database Architecture

Four PostgreSQL tables manage the complete subscription lifecycle with Row Level Security enforcing user data isolation.

user_profiles stores shipping addresses and preferences in JSONB columns, enabling flexible schema updates without migrations. subscriptions tracks active status, Stripe IDs, and next delivery dates with foreign keys to auth.users. received_boxes maintains delivery history with status progression tracking. box_items details individual candy contents per shipment.

Cascading deletes ensure data cleanup when users terminate accounts. Indexes on user_id and stripe_subscription_id optimize query performance for dashboard views and webhook processing.

Who This Is For

Subscription Business Founders

Entrepreneurs launching recurring revenue models need complete subscription infrastructure without building from scratch. This platform demonstrates user onboarding, payment automation, delivery tracking, and customer management patterns applicable to subscription boxes, memberships, or SaaS products.

Full-Stack Developers

Engineers building e-commerce applications benefit from seeing production-ready implementations of Stripe subscriptions, webhook handling, database schema design, and authentication flows. The codebase shows React state management, Express API architecture, and TypeScript patterns without unnecessary abstraction.

Payment Integration Learners

Developers implementing Stripe for the first time encounter practical examples of payment method attachment, subscription lifecycle management, webhook signature verification, and error handling. The implementation demonstrates real-world patterns beyond basic documentation examples.

Product Managers

Teams planning subscription features gain insight into technical complexity, data requirements, and user experience considerations. Understanding the complete flow from signup through recurring billing to cancellation informs product roadmap decisions and engineering resource allocation.

Why This Product Exists

Living between Sweden and the UK created a simple tradition. My wife visits from the UK, we explore Swedish candy shops together, filling bags with salty licorice and unique Scandinavian treats. She brings British sweets back chewy wine gums, proper chocolate bars, flavors unavailable in Sweden.

These exchanges became routine. Friends asked for specific items. We’d compile lists, make extra purchases, ship packages. The pattern repeated: people wanted cross-border candy access without traveling.

Subscription boxes solve logistics problems. Instead of coordinating individual requests, a recurring service handles selection, packaging, and delivery systematically. Customers receive curated boxes monthly without managing international shipping themselves.

Building this platform addressed technical curiosity alongside practical need. Implementing Stripe subscriptions with webhook handling, designing multi-step user flows, and architecting recurring payment systems required understanding subscription business models deeply.

The result is infrastructure supporting recurring revenue models beyond candy. The authentication patterns, payment processing, delivery tracking, and admin management systems apply to any subscription-based product requiring customer lifecycle management.

Why Choose This Approach

Subscription platforms require specific technical capabilities: recurring billing, customer lifecycle management, delivery tracking, and administrative oversight. Traditional e-commerce solutions focus on one-time transactions, lacking subscription-first architecture.

This implementation demonstrates targeted design choices:

Stripe Subscriptions Over Manual Billing: Automated monthly charging eliminates manual invoice generation. Payment method storage enables seamless renewals without customer intervention. Webhook events provide real-time subscription status updates.

Supabase Instead of Custom Auth: Managed authentication with Row Level Security removes identity infrastructure overhead. JWT tokens and session management work without building authentication systems from scratch. Database access controls enforce user data isolation automatically.

Multi-Step Wizard Over Single Form: Breaking signup into box selection, shipping, and payment reduces cognitive load. Users complete small focused tasks rather than overwhelming forms. State preservation between steps allows editing previous choices without data loss.

PostgreSQL Over Document Databases: Relational structure ensures referential integrity between users, subscriptions, and delivery records. Foreign key constraints prevent orphaned data. Complex queries join related entities efficiently for reporting and analytics.

React Router State Over Redux: Built-in location state handles wizard progression without external state management libraries. Navigation guards protect routes requiring authentication. The pattern scales adequately for application complexity without additional dependencies.

The architecture prioritizes proven subscription patterns over custom implementations, reducing development time while maintaining reliability.

Cross-Border Commerce Simplified

SweetShop demonstrates how subscription infrastructure enables international product delivery without complex logistics management. The platform handles recurring payments, customer management, and delivery tracking, proving that modern web technologies make subscription businesses accessible to small-scale entrepreneurs.