Introduction
If you’re building a SaaS or premium mobile app, subscriptions are one of the most reliable monetization models.
But implementing subscriptions correctly is not just about adding a payment button — it involves:
- Secure validation
- Real-time status updates
- Handling edge cases (expiry, restore, refunds)
In this guide, I’ll walk you through how I implemented a production-ready subscription system using FlutterFlow + RevenueCat + Firebase.
Why RevenueCat?
Instead of directly handling App Store / Play Store billing, I used RevenueCat because it simplifies everything.
Key Benefits:
- Single integration for both iOS & Android
- Handles receipts, validation, and renewals
- Real-time subscription status via webhooks
- Reduces development complexity
Without RevenueCat, managing subscriptions manually becomes very complex.
System Architecture (Simple View)
Here’s how the system works:
- FlutterFlow App (Frontend)
- User interacts with UI (Upgrade, Restore)
- RevenueCat SDK
- Handles purchase flow
- RevenueCat Server
- Validates transactions
- Firebase (Firestore + Cloud Functions)
- Stores subscription status & triggers updates
Complete Subscription Flow
Here’s the exact flow I implemented:
1. User Action
User clicks “Upgrade to Premium”
2. Purchase Trigger
RevenueCat SDK opens native purchase screen (App Store / Play Store)
3. Payment Processing
- Payment handled securely by Apple/Google
- RevenueCat validates purchase
4. Webhook Trigger
RevenueCat sends event → Firebase Cloud Function
5. Firestore Update
User document is updated:
{
"isPremium": true,
"plan": "monthly",
"expiryDate": "timestamp"
}
6. UI Update
- FlutterFlow listens to Firestore
- Premium features unlock instantly
Firestore Database Structure
To keep things scalable and clean, I used this structure:
users collection
{
"userId": "123",
"isPremium": true,
"plan": "yearly",
"expiryDate": "timestamp"
}
subscriptions collection
{
"planId": "monthly_001",
"price": 9.99,
"duration": "1 month"
}
events collection (VERY IMPORTANT)
{
"userId": "123",
"eventType": "PURCHASE",
"timestamp": "server_time"
}
This helps in:
- Tracking revenue
- Debugging issues
- Analytics
Handling Edge Cases (Most Developers Miss This)
This is where most apps fail
1. Expired Subscription
- Check expiryDate regularly
- Disable premium access automatically
2. Restore Purchases
- Add Restore button
- Sync with RevenueCat
- Update Firestore again
3. Cancelled Subscription
- User cancels from App Store
- RevenueCat webhook updates backend
- Access removed after expiry
4. Refunds
- RevenueCat sends refund event
- Immediately update user access
Backend Validation (CRITICAL)
- Never trust frontend logic
- Always validate subscription from backend using:
Why?
- Prevents fake unlock hacks
- Ensures real subscription status
- Keeps your app secure
Performance & Cost Optimization
Here’s what I optimized:
Avoid Excessive Reads
- Store only required subscription fields
- Don’t fetch full history every time
Use Real-Time Listeners Smartly
- Listen only to user document
- Avoid unnecessary listeners
Cache Subscription Status
- Reduce repeated API calls
UI Best Practices (Conversion Focused)
Subscription UI is not just design — it impacts revenue 💰
What worked for me:
- Highlight best plan (yearly)
- Show discount badge (Save 30%)
- Clear CTA: “Upgrade Now”
- Add trust elements (secure payment, cancel anytime)
Final Result
After implementing this system:
- Smooth and secure purchase flow
- Real-time subscription updates
- Scalable backend architecture
- Reduced bugs and edge case failures
Final Thoughts
FlutterFlow + RevenueCat is a powerful combination for building subscription-based apps quickly.
But the real difference comes from:
- Proper backend validation
- Clean database design
- Handling real-world edge cases
That’s what turns a basic app into a production-ready SaaS product.
