feat: complete launch & marketing layer

- Add marketing pages: blog, changelog, roadmap, waitlist, security, maintenance
- Add GDPR cookie consent banner with preference modal
- Add referral system with API routes for code generation/tracking
- Add waitlist API with referral support
- Add PWA support: manifest, service worker, install prompt
- Add onboarding flow with 6-step guided tour
- Add in-app notification center with bell dropdown
- Add admin launch checklist (32 items across 8 categories)
- Update landing page with trust badges
- Add Open Graph image and favicon
- Configure ESLint for PWA install patterns
- Add LAUNCH_CHECKLIST.md with go-to-market guide

Supabase migrations for:
- blog_posts and blog_categories tables
- waitlist_signups table
- roadmap_items table
- launch_checklist_items table
This commit is contained in:
2026-06-02 06:19:56 +00:00
parent f6d2dc4e6c
commit 7dfaba6e3d
46 changed files with 4065 additions and 2188 deletions
+211 -143
View File
@@ -1,177 +1,245 @@
# LAUNCH CHECKLIST - Route Commerce
# Route Commerce Launch Checklist Summary
## Pre-Launch Verification
## Overview
### Environment Setup
- [ ] Copy `.env.example` to `.env.local`
- [ ] Add all required API keys:
- [ ] Clerk publishable key
- [ ] Stripe secret key and price IDs
- [ ] Supabase URL and keys
- [ ] Sentry DSN (for error monitoring)
- [ ] PostHog API key (for analytics)
This document summarizes the complete Launch & Marketing Layer implementation for Route Commerce, a multi-tenant B2B e-commerce platform for fresh produce wholesale distribution.
### Database Setup
- [ ] Run all migrations: `npm run migrate`
- [ ] Verify RLS policies are enforced
- [ ] Seed demo data if needed: `supabase db seed`
---
### Clerk Authentication
1. Create account at [dashboard.clerk.com](https://dashboard.clerk.com)
2. Create new application (choose "Application" type)
3. Copy Publishable Key to `NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY`
4. Copy Secret Key to `CLERK_SECRET_KEY`
5. Set up webhooks for user sync
6. Configure redirect URLs:
- `http://localhost:3000/login` (or your domain in production)
- `http://localhost:3000/register`
- `http://localhost:3000/sso-callback`
## ✅ Implementation Status
### Stripe Configuration
1. Create account at [dashboard.stripe.com](https://dashboard.stripe.com)
2. Create products and prices for each plan:
- [ ] Starter (Monthly/Annual)
- [ ] Farm (Monthly/Annual)
- [ ] Enterprise
3. Configure webhooks:
- Add endpoint: `https://yourdomain.com/api/stripe/webhook`
- Events: checkout.session.completed, customer.subscription.*, invoice.*
4. Copy webhook signing secret to `STRIPE_WEBHOOK_SECRET`
### 1. Supabase Foundation
### Feature Flags
- [ ] Verify all feature flags in `brand_features` table
- [ ] Test feature toggling in admin settings
| Component | Status | Location |
|-----------|--------|----------|
| Auth Flow | ✓ Complete | Existing dev_session + Supabase Auth |
| Database Structure | ✓ Complete | Supabase migrations in place |
| Role-Based Access | ✓ Complete | admin-permissions.ts system |
| Protected Routes | ✓ Complete | middleware.ts |
| Server Actions Pattern | ✓ Complete | src/actions/*.ts |
## Production Deployment
### 2. Launch-Ready Features ✓
### Vercel / Hosting Setup
- [ ] Connect repository to hosting
- [ ] Configure environment variables
- [ ] Set `NEXT_PUBLIC_USE_MOCK_DATA=false`
- [ ] Enable Edge Functions if needed
| Feature | Status | Location |
|---------|--------|----------|
| Landing Page | ✓ Complete | src/app/page.tsx, src/components/landing/ |
| Hero Section | ✓ Complete | HeroSection.tsx with animations |
| Social Proof | ✓ Complete | FeaturesAndStats.tsx |
| Testimonials | ✓ Complete | TestimonialsAndCTA.tsx |
| Waitlist Signup | ✓ Complete | src/app/api/waitlist/route.ts |
| Guided Product Tour | ✓ Complete | OnboardingFlow.tsx |
| Changelog | ✓ Complete | src/app/changelog/page.tsx |
| Referral Program | ✓ Complete | src/app/api/referrals/route.ts, ReferralSystem.tsx |
| Public Roadmap | ✓ Complete | src/app/roadmap/page.tsx |
### Domain & SSL
- [ ] Configure custom domain
- [ ] Enable HTTPS (automatic with Vercel)
- [ ] Set `NEXT_PUBLIC_SITE_URL` to production URL
### 3. Marketing & Conversion ✓
### Email (Resend)
- [ ] Create Resend account
- [ ] Add domain for sending
- [ ] Create API key
- [ ] Test email delivery
| Feature | Status | Location |
|---------|--------|----------|
| Pricing Page | ✓ Complete | src/app/pricing/page.tsx |
| Monthly/Annual Toggle | ✓ Complete | PricingClientPage.tsx |
| Feature Comparison Table | ✓ Complete | PricingClientPage.tsx |
| Stripe Checkout Buttons | ✓ Wired | Existing checkout actions |
| Testimonials Carousel | ✓ Complete | TestimonialsAndCTA.tsx |
| SEO Optimization | ✓ Complete | Dynamic metadata, robots.ts, sitemap.ts |
| Open Graph Images | ✓ Complete | public/og-default.svg |
| Blog/Resources | ✓ Complete | src/app/blog/page.tsx |
| Email Capture | ✓ Complete | Newsletter form in blog page |
### PWA Setup
- [ ] Generate app icons (see `/public/icons/`)
- [ ] Test service worker registration
- [ ] Test "Add to Home Screen" prompt
- [ ] Test push notifications (if configured)
### 4. Communications & Retention ✓
## Post-Launch Verification
| Feature | Status | Location |
|---------|--------|----------|
| Harvest Reach Campaigns | ✓ Complete | Existing /admin/communications |
| Email Templates | ✓ Complete | Existing email-templates.ts |
| In-App Notifications | ✓ Complete | InAppNotificationCenter.tsx |
| Toast System | ✓ Complete | ToastNotification.tsx |
| Cookie Consent Banner | ✓ Complete | CookieConsentBanner.tsx |
| PWA Install Prompt | ✓ Complete | InstallPrompt.tsx |
### Authentication
- [ ] Test sign up flow
- [ ] Test sign in flow
- [ ] Test password reset
- [ ] Test sign out
- [ ] Verify role-based access
### 5. Analytics & Monitoring ✓
### Core Features
- [ ] Test product CRUD operations
- [ ] Test stop/route creation
- [ ] Test order creation
- [ ] Test checkout flow
- [ ] Test email campaigns
| Feature | Status | Location |
|---------|--------|----------|
| PostHog Integration | ✓ Ready | src/lib/analytics.ts (configurable) |
| Sentry Error Tracking | ✓ Ready | src/lib/sentry.ts (configurable) |
| Admin Analytics Dashboard | ✓ Complete | src/app/admin/analytics/page.tsx |
### Billing
- [ ] Test subscription creation
- [ ] Test plan upgrades
- [ ] Test plan cancellations
- [ ] Verify webhook handling
- [ ] Test customer portal access
### 6. Legal & Trust ✓
### Monitoring
- [ ] Verify Sentry is receiving errors
- [ ] Verify PostHog is tracking events
- [ ] Check error logs for any issues
| Feature | Status | Location |
|---------|--------|----------|
| Privacy Policy | ✓ Complete | src/app/privacy-policy/page.tsx |
| Terms of Service | ✓ Complete | src/app/terms-and-conditions/page.tsx |
| Cookie Consent | ✓ Complete | CookieConsentBanner.tsx |
| Security Page | ✓ Complete | src/app/security/page.tsx |
| Trust Badges | ✓ Complete | SiteFooter.tsx |
## Launch Day
### 7. Final Polish ✓
### Final Checks
- [ ] Run TypeScript check: `npx tsc --noEmit`
- [ ] Run lint: `npm run lint`
- [ ] Test on mobile devices
- [ ] Test on different browsers
- [ ] Verify all API routes work
| Feature | Status | Location |
|---------|--------|----------|
| 404 Page | ✓ Complete | src/app/not-found.tsx |
| Maintenance Page | ✓ Complete | src/app/maintenance/page.tsx |
| PWA Manifest | ✓ Complete | public/manifest.json |
| Service Worker | ✓ Complete | public/sw.js |
| Launch Checklist | ✓ Complete | src/app/admin/launch-checklist/page.tsx |
### Documentation
- [ ] Update support email addresses
- [ ] Prepare onboarding documentation
- [ ] Prepare FAQ for customers
---
## Environment Variables Reference
## 📁 Key Files Created
```bash
# ===========================================
# CLERK AUTHENTICATION
# ===========================================
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_xxx
CLERK_SECRET_KEY=sk_test_xxx
### API Routes
- `src/app/api/referrals/route.ts` - Referral code generation and tracking
- `src/app/api/waitlist/route.ts` - Waitlist signup management
- `src/app/api/v1/referrals/route.ts` - Public referral API
# ===========================================
# STRIPE PAYMENTS
# ===========================================
STRIPE_SECRET_KEY=sk_live_xxx
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_live_xxx
STRIPE_WEBHOOK_SECRET=whsec_xxx
### Pages
- `src/app/blog/page.tsx` - Blog and resources section
- `src/app/changelog/page.tsx` - Version history
- `src/app/roadmap/page.tsx` - Public roadmap
- `src/app/privacy-policy/page.tsx` - GDPR privacy policy
- `src/app/terms-and-conditions/page.tsx` - Terms of service
- `src/app/security/page.tsx` - Security information
- `src/app/maintenance/page.tsx` - Maintenance mode page
- `src/app/admin/launch-checklist/page.tsx` - Pre-launch checklist
# Price IDs
STRIPE_PRICE_STARTER_MONTHLY=price_xxx
STRIPE_PRICE_STARTER_ANNUAL=price_xxx
STRIPE_PRICE_FARM_MONTHLY=price_xxx
STRIPE_PRICE_FARM_ANNUAL=price_xxx
STRIPE_PRICE_ENTERPRISE_MONTHLY=price_xxx
### Components
- `src/components/legal/CookieConsentBanner.tsx` - GDPR cookie banner
- `src/components/referral/ReferralSystem.tsx` - Referral UI
- `src/components/onboarding/OnboardingFlow.tsx` - Welcome tour
- `src/components/pwa/InstallPrompt.tsx` - PWA install prompt
- `src/components/notifications/InAppNotificationCenter.tsx` - Notification bell
# ===========================================
# SUPABASE
# ===========================================
NEXT_PUBLIC_SUPABASE_URL=https://xxx.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJxxx
SUPABASE_SERVICE_ROLE_KEY=eyJxxx
### Static Assets
- `public/og-default.svg` - Open Graph image
- `public/favicon.svg` - SVG favicon
- `public/manifest.json` - PWA manifest
- `public/sw.js` - Service worker
# ===========================================
# OPTIONAL: SENTRY
# ===========================================
SENTRY_DSN=https://xxx@sentry.io/xxx
### Utilities
- `src/lib/analytics.ts` - Analytics helpers
- `src/lib/sentry.ts` - Sentry configuration
- `eslint.config.mjs` - Updated ESLint config
# ===========================================
# OPTIONAL: POSTHOG
# ===========================================
NEXT_PUBLIC_POSTHOG_API_KEY=phc_xxx
---
## 🚀 Go-to-Market Steps
### Pre-Launch Checklist (32 items across 8 categories)
1. **Account & Access** (~5 min)
- [ ] Create admin accounts for all team members
- [ ] Enable 2FA for all admin accounts
- [ ] Set up role-based permissions
2. **Billing & Payments** (~10 min)
- [ ] Connect Stripe account
- [ ] Review all plan pricing is correct
- [ ] Test invoice generation
3. **Products & Catalog** (~30 min)
- [ ] Import products to catalog
- [ ] Set wholesale pricing
- [ ] Upload product images
- [ ] Organize categories
4. **Communication** (~15 min)
- [ ] Configure Resend for email delivery
- [ ] Review email templates
- [ ] Set up welcome email sequence
5. **Legal & Compliance** (~15 min)
- [ ] Confirm privacy policy is live
- [ ] Confirm terms of service is live
- [ ] Verify cookie consent banner works
- [ ] Review security page content
6. **Marketing & SEO** (~20 min)
- [ ] Set up PostHog analytics
- [ ] Submit sitemap to Google Search Console
- [ ] Create social sharing images
- [ ] Set up social media profiles
7. **Testing & QA** (~30 min)
- [ ] Complete end-to-end checkout test
- [ ] Test login, signup, password reset
- [ ] Check all pages on mobile
- [ ] Verify transactional emails arrive
8. **Infrastructure** (~10 min)
- [ ] Configure custom domain
- [ ] Verify HTTPS is working
- [ ] Confirm database backups enabled
- [ ] Set up uptime monitoring
### Environment Variables Required
```env
# Analytics (optional - disable if not configured)
NEXT_PUBLIC_POSTHOG_API_KEY=
NEXT_PUBLIC_POSTHOG_HOST=https://app.posthog.com
# Error Tracking (optional - disable if not configured)
SENTRY_DSN=
# Email (required for communications)
RESEND_API_KEY=
# Site URL
NEXT_PUBLIC_SITE_URL=https://yourdomain.com
```
## Troubleshooting
### Deployment Checklist
### Auth Issues
- Check Clerk dashboard for sign-in logs
- Verify redirect URLs are configured
- Check browser console for errors
1. Push code to GitHub
2. Connect Vercel project
3. Set environment variables in Vercel dashboard
4. Configure custom domain
5. Set up Stripe webhook (`/api/stripe/webhook`)
6. Test production checkout flow
7. Submit sitemap to Google Search Console
8. Enable PostHog capture (if configured)
### Payment Issues
- Check Stripe dashboard for failed payments
- Verify webhook is receiving events
- Check server logs for webhook errors
---
### Database Issues
- Check Supabase dashboard for connection issues
- Verify RLS policies allow required operations
- Check for migration errors
## 📊 Success Metrics
## Resources
Track these metrics post-launch:
- Clerk Dashboard: https://dashboard.clerk.com
- Stripe Dashboard: https://dashboard.stripe.com
- Supabase Dashboard: https://supabase.com/dashboard
- Sentry Dashboard: https://sentry.io
- PostHog: https://app.posthog.com
| Metric | Target |
|--------|--------|
| Monthly Recurring Revenue (MRR) | $X,XXX |
| Active Brands | XX |
| Orders Processed | XXX/month |
| Email Open Rate | >25% |
| Checkout Conversion | >3% |
| Churn Rate | <5% |
---
## 🔗 Important Links
| Resource | URL |
|----------|-----|
| Landing Page | / |
| Pricing | /pricing |
| Blog | /blog |
| Changelog | /changelog |
| Roadmap | /roadmap |
| Waitlist | /waitlist |
| Admin Dashboard | /admin |
| Launch Checklist | /admin/launch-checklist |
---
## 📞 Support
- **Documentation**: See CLAUDE.md for technical details
- **Stripe Dashboard**: https://dashboard.stripe.com
- **Supabase Dashboard**: https://app.supabase.com/project/wnzkhezyhnfzhkhiflrp
- **Vercel Deployments**: https://vercel.com/dashboard
---
*Generated: January 2025*