Skip to content

SETUP_CHECKLIST.md

Latest commit

 

History

History
191 lines (140 loc) · 5.66 KB

SETUP_CHECKLIST.md

File metadata and controls

191 lines (140 loc) · 5.66 KB
Raw

Setup Checklist

Complete setup guide for integrating this Stripe API into your Firebase project.

✅ Pre-Setup

  • Have a Firebase project created
  • Have Firebase CLI installed (npm install -g firebase-tools)
  • Have a Stripe account (test mode is fine to start)
  • Node.js 20+ installed

📋 Step 1: Copy Files

  • Copy src/services/stripe/ to your project
  • Copy src/types/stripe/ to your project
  • Copy src/components/stripe/ to your project (optional)
  • Copy src/config/environment.ts to your project
  • Copy src/utils/firebase/config.ts to your project
  • Copy src/services/errorHandler.ts to your project
  • Copy functions/src/stripe-proxy.ts to your project
  • Copy functions/src/cors-helper.ts to your project
  • Copy functions/src/environment.ts to your project
  • Copy functions/src/services/errorHandler.ts to your project

📋 Step 2: Update Firebase Config

  • Open src/utils/firebase/config.ts
  • Replace YOUR_FIREBASE_API_KEY with your Firebase API key
  • Replace YOUR_PROJECT_ID with your Firebase project ID
  • Replace YOUR_MESSAGING_SENDER_ID with your sender ID
  • Replace YOUR_APP_ID with your app ID

📋 Step 3: Update CORS Config

  • Open functions/src/cors-helper.ts
  • Update allowed origins with your domains
  • Add your production domain
  • Add your staging domain (if applicable)
  • Ensure localhost ports are included for development

📋 Step 4: Set Up Stripe Secrets

Run these commands in your terminal:

Test Mode Secrets

  • firebase functions:secrets:set STRIPE_TEST_SECRET_KEY
    • Enter: sk_test_YOUR_KEY_HERE
  • firebase functions:secrets:set STRIPE_TEST_PUBLISHABLE_KEY
    • Enter: pk_test_YOUR_KEY_HERE
  • firebase functions:secrets:set STRIPE_TEST_ACCOUNT_ID
    • Enter: acct_YOUR_ACCOUNT_ID (optional)

Live Mode Secrets

  • firebase functions:secrets:set STRIPE_LIVE_SECRET_KEY
    • Enter: sk_live_YOUR_KEY_HERE
  • firebase functions:secrets:set STRIPE_LIVE_PUBLISHABLE_KEY
    • Enter: pk_live_YOUR_KEY_HERE
  • firebase functions:secrets:set STRIPE_LIVE_ACCOUNT_ID
    • Enter: acct_YOUR_ACCOUNT_ID (optional)

📋 Step 5: Create Firestore Config

Create a document at /config/stripe in Firestore with:

{
  "environment": "test",
  "testPublishableKey": "pk_test_YOUR_KEY",
  "livePublishableKey": "pk_live_YOUR_KEY",
  "createdAt": "2025-10-01T00:00:00.000Z",
  "updatedAt": "2025-10-01T00:00:00.000Z"
}
  • Document created at correct path
  • Test publishable key added
  • Live publishable key added
  • Environment set to "test" initially

📋 Step 6: Update Function References

  • Open functions/src/index.ts
  • Add: export { stripeProxy } from './stripe-proxy';
  • Verify no import errors

📋 Step 7: Update Proxy URL

  • Open src/config/environment.ts
  • Update STRIPE_PROXY_URL with your project ID
  • Should be: https://us-central1-YOUR_PROJECT_ID.cloudfunctions.net/stripeProxy

📋 Step 8: Install Dependencies

Frontend

  • npm install firebase

Functions

  • cd functions
  • npm install firebase-functions firebase-admin stripe
  • cd ..

📋 Step 9: Deploy Function

  • Run: firebase deploy --only functions:stripeProxy
  • Wait for deployment to complete
  • Note the function URL from output
  • Verify URL matches your STRIPE_PROXY_URL config

📋 Step 10: Test Integration

Create a test file or add to your code:

import { customersCreateService } from 'src/services/stripe';

async function testStripe() {
  const result = await customersCreateService.create({
    email: 'test@example.com',
    name: 'Test Customer'
  });
  
  console.log('Result:', result);
}

testStripe();
  • Test runs without errors
  • Customer created in Stripe Dashboard
  • No CORS errors in console

📋 Step 11: Verify Firestore Rules

  • Deploy Firestore rules: firebase deploy --only firestore:rules
  • Verify /config/stripe is readable by authenticated users
  • Test read access from your app

📋 Step 12: Production Checklist

Before going live:

  • Update Firestore /config/stripe document: { environment: "live" }
  • Verify live secret keys are set in Firebase Secret Manager
  • Test a live mode transaction (use real test card first)
  • Update CORS to restrict origins (remove * if used)
  • Enable Firebase App Check for security
  • Review Stripe webhook settings
  • Set up Stripe webhook endpoints in Firebase Functions
  • Test webhook deliveries

🎉 You're Done!

Your Stripe integration is ready to use. Key features:

  • ✅ No CORS issues
  • ✅ Full type safety
  • ✅ Runtime environment switching
  • ✅ Complete Stripe API coverage
  • ✅ Production-ready error handling

🆘 Troubleshooting

CORS Errors

  • Verify functions/src/cors-helper.ts has your domain
  • Redeploy functions: firebase deploy --only functions:stripeProxy

404 on stripeProxy

  • Check function deployed: firebase functions:list
  • Verify URL in src/config/environment.ts matches deployed URL

Type Errors

  • Ensure all files copied correctly
  • Restart TypeScript server in IDE
  • Check tsconfig.json includes src directory

Environment Not Switching

  • Verify /config/stripe document exists in Firestore
  • Check function logs: firebase functions:log --only stripeProxy
  • Ensure Firestore permissions allow read access

📚 Next Steps

  1. Read the full documentation in README.md
  2. Review INSTALLATION.md for advanced setup
  3. Check FEATURES.md for all available features
  4. Explore the service files in src/services/stripe/

Happy coding! 🚀