From an Excel sheet to a production React Native app. AI-powered financial assistant built with Expo, Supabase, and intelligent automation.
From Excel to Production Mobile App
“And to think that it all started from an Excel sheet…”
New year, new savings goals, new budgets… That’s how it began. A shared Excel template for weekly expense tracking became the perfect opportunity to finally dive into mobile development.
The origin story
When María Sugasaga shared her Excel template for expense control, I saw the opportunity to transform a spreadsheet into a native mobile app - and finally explore React Native development I’d been postponing.
Why React Native? Technical Decision-Making
After evaluating different mobile frameworks, React Native won for key technical advantages:
Development Efficiency
- Single codebase for iOS and Android (~90% code sharing)
- Hot Reloading for rapid iteration during development
- Near-native performance through native component architecture
Ecosystem & Flexibility
- Mature ecosystem of libraries and tools
- JSI (JavaScript Interface) for low-level operations
- Flexibility to integrate native modules for platform-specific optimizations
React to React Native
As a developer interested in React for web, jumping to React Native was a stimulating technical challenge. The transition leverages existing React knowledge while opening mobile development capabilities.
The Power of Expo & Supabase
Expo: Streamlined Mobile Development
We incorporated Expo as our build platform, which enabled us to:
- Accelerate development without complex native configurations
- Rapid testing using Expo Go during development
- Pre-configured native APIs for common functionalities
- Cloud builds optimized for both platforms
Supabase: Complete Backend Solution
For the backend, we chose Supabase as our all-in-one platform:
Authentication System
- Robust and secure authentication implementation
- Social login and email/password support
Edge Functions
- Serverless functions for business logic
- AI integration for expense analysis
- Real-time data processing
PostgreSQL Database
- All application data stored in production-grade infrastructure
- Relational data modeling for transactions and categories
- Built-in Row Level Security (RLS)
Real-Time Capabilities
- Live data synchronization across devices
- Instant updates without polling
Clean Architecture Implementation
Implemented a clean architecture with clear separation of concerns:
├── UI Layer (React Native Components)
├── Business Logic (Custom Hooks & Services)
└── Data Persistence (Supabase Client & Edge Functions)This architecture ensures:
- Maintainability as the codebase grows
- Testability of business logic
- Scalability for future features
Real User Impact
| Metric | Impact | User Feedback |
|---|---|---|
| Average monthly savings | +20% | “I finally see where my money goes” |
| Time managing finances | -75% | “No more manual Excel updates” |
| Expense visibility | 100% | “Complete financial transparency” |
| Budget adherence | +60% | “Alerts keep me on track” |
The real problem solved
Traditional finance apps show data but don’t help make decisions. CoinPi goes further: it analyzes, recommends, and learns from your habits using AI.
AI-Powered Intelligence
Personalized Recommendations
The AI analyzes spending patterns and provides:
- Specific recommendations for your financial situation
- Concrete actions based on real data, not generic advice
- Behavioral insights to improve financial habits
Automatic Expense Analysis
- Intelligent categorization of transactions
- Learning from your patterns for automatic tagging
- Anomaly detection for unusual expenses
Future Capabilities (In Development)
- Predictive expense forecasting
- Savings goals with automatic tracking
- Smart alerts for unusual spending patterns
- Banking integration for automatic transaction sync
Technical Stack Deep Dive
Frontend (Mobile)
- Framework: React Native + Expo
- Language: TypeScript
- State Management: React Context + Custom Hooks
- UI Components: Custom design system
Backend (Serverless)
- Platform: Supabase
- Functions: Edge Functions (Deno runtime)
- API: RESTful + Real-time subscriptions
- AI Integration: OpenAI GPT-4 for analysis
Database
- Type: PostgreSQL (via Supabase)
- ORM: Supabase Client Library
- Security: Row Level Security (RLS)
DevOps
- CI/CD: Expo Application Services (EAS)
- Deployment: Automated builds for iOS & Android
- Monitoring: Supabase Analytics + Custom logging
Next Technical Challenges
Secure Banking API Integration
- Implementing PSD2-compliant banking connections
- OAuth 2.0 for secure authorization
- Transaction synchronization with Spanish banks
Performance Optimization
- Bundle size reduction for faster app loads
- Code splitting for lazy-loaded features
- Image optimization and caching strategies
Advanced AI Features
- ML models for spending prediction
- Custom recommendation engine
- Financial health scoring algorithm
Collaborative project
This project is being developed in collaboration with María Sugasaga as part of my technical exploration into mobile development, fintech, and AI integration.
Development Philosophy
This project embodies several key principles:
- Agile development with iterative improvements
- AI integration for intelligent user experiences
- Continuous learning and skill expansion
- Real-world problem solving over theoretical exercises
Connect with me
Interested in React Native, fintech, or AI integration? I’d love to connect with other developers to discuss technical approaches, optimizations, and best practices.
Current Status
- Mobile app: Complete and in active use
- Web version: In development
- Banking integration: Planning phase
- AI enhancements: Ongoing improvements
