Subscription Box
E-commerce · React + Node (Express) · 16 @molecule/* packages
Cratejoy-like recurring subscription boxes with billing, customization, and shipment tracking
Quick preview
Opens instantly. Runs on sample data, so changes reset on reload.
What is inside
Screens (12)
- Landing
/ - Login
/login - Signup
/signup - ForgotPassword
/forgot-password - ResetPassword
/reset-password - Dashboard
/dashboard(signed in) - Boxes
/boxes(signed in) - Customize
/customize(signed in) - Shipments
/shipments(signed in) - BoxDetail
/boxes/:id(signed in) - Billing
/billing(signed in) - Settings
/settings(signed in)
Data model (13 tables)
- box_items — id, box_id, product_id, product_variant_id, name, quantity, is_custom, created_at, …
- boxes — id, user_id, subscription_id, theme, billing_period, scheduled_for, status, customizations, …
- devices — id, createdAt, updatedAt, userId, name, pushPlatform, pushSubscription, hasPushSubscription
- invoices — id, user_id, subscription_id, stripe_invoice_id, amount_due, amount_paid, currency, status, …
- order_events — id, orderId, status, metadata, createdAt
- order_items — id, orderId, productId, variantId, name, price, quantity, image
- orders — id, userId, status, subtotal, tax, shipping, discount, total, …
- payments — id, createdAt, updatedAt, userId, transactionId, productId, platformKey, data, …
- product_variants — id, productId, name, sku, price, inventory, createdAt, updatedAt
- products — id, name, slug, description, price, currency, status, imageUrl, …
- shipments — id, box_id, user_id, carrier, tracking_number, label_url, estimated_delivery, status, …
- subscription_plans — id, name, slug, description, price, currency, interval, interval_count, …
- subscriptions — id, user_id, plan_id, status, payment_subscription_id, stripe_subscription_id, preferences, current_period_start, …
API (7 handlers)
- \_async
api/src/handlers/_async.ts - \_seed
api/src/handlers/_seed.ts - \_test
api/src/handlers/_test.ts - boxes
api/src/handlers/boxes.ts - plans
api/src/handlers/plans.ts - shipments
api/src/handlers/shipments.ts - subscriptions
api/src/handlers/subscriptions.ts
Subscription tiers
free / pro / team — gated by: maxBoxes, maxPlans, maxShipments, maxSubscriptions, advancedFeatures, canExport, retentionDays
Built from 16 @molecule/* packages
@molecule/api-cron-node-cron@molecule/api-database-postgresql@molecule/api-email-templates@molecule/api-emails-mailgun@molecule/api-entitlements@molecule/api-image-sharp@molecule/api-payments-stripe@molecule/api-resource-order@molecule/api-resource-payment@molecule/api-resource-product@molecule/api-resource-user@molecule/api-uploads-s3@molecule/app-billing-react@molecule/app-data-table@molecule/app-gallery@molecule/app-stepper
Required secrets
DATABASE_URLPostgreSQL connection stringSTRIPE_SECRET_KEYStripe secret keySTRIPE_PUBLISHABLE_KEYStripe publishable keySTRIPE_WEBHOOK_SECRETStripe webhook signing secretS3_BUCKETS3 bucket for box imagesAWS_ACCESS_KEY_IDAWS access keyAWS_SECRET_ACCESS_KEYAWS secret keyMAILGUN_API_KEYMailgun API keyMAILGUN_DOMAINMailgun domain
The @molecule/* packages are Apache-2.0. The app you build from this template is yours to export and self-host. Licensing