When I was hired to develop Furever Happy for a client in the US, the goal was to create a mobile application that worked seamlessly on both Android and iOS while offering a flexible, secure subscription system for users. In this post, I'll walk you through how I achieved this using React Native for the frontend, NestJS for the backend, and Stripe for managing recurring payments.
What is Furever Happy?
Furever Happy is an app designed to [insert a brief description of the app’s main purpose, e.g., "help pet owners manage the health, nutrition, and happiness of their furry companions"]. To offer premium features, I integrated monthly and yearly subscription plans, allowing users to unlock exclusive content.
Tech Stack
- React Native: To create a native mobile app for Android and iOS with a single codebase.
- NestJS: A robust framework for building a scalable and secure RESTful API.
- Stripe: For managing payments, subscriptions, and billing securely and efficiently.
- PostgreSQL + Prisma: For efficient database management.
The Development Process
1. Project Setup
I started the project by creating two repositories: one for the React Native frontend and another for the NestJS backend.
- For the frontend, I used Expo to speed up the initial development process.
- On the backend, I set up NestJS with Prisma to handle database operations.
2. Architecture Design
I chose a client-server architecture:
- Frontend: State management using Context API, API requests handled with Axios, and responsive design for various devices.
- Backend: A RESTful API with controllers to manage user authentication, subscriptions, and payment-related endpoints.
3. Stripe Integration
One of the biggest challenges was implementing the subscription system. Here’s how I did it:
- Created NestJS endpoints to handle Stripe customer creation, subscription management, and payment processing.
- On React Native, I used the Stripe React Native SDK to securely handle in-app payments.
4. Managing Subscriptions
To ensure smooth subscription management:
- I implemented logic to handle different subscription statuses (active, canceled, past_due, etc.) both on the server and client sides.
- Users can easily upgrade, downgrade, or cancel their subscriptions directly from the app.
Challenges Faced
- Handling Stripe webhooks efficiently to keep subscription statuses updated in real time.
- Ensuring a smooth user experience across different devices and screen sizes.
- Securing payment data and implementing best practices for API security.
Key Takeaways
Building Furever Happy was an exciting journey that helped me deepen my knowledge of mobile development, backend APIs, and payment integrations. The combination of React Native, NestJS, and Stripe proved to be powerful, flexible, and scalable for creating subscription-based apps.
If you’re planning to build something similar, I hope this post helps you get started. Feel free to ask any questions or share your thoughts in the comments!
