New
How To Build A Mobile App Using Free Ai Tools: My Journey With Splitup
I recently created Splitup, a simple expense-splitting app, using only free AI tools. Here's a step-by-step guide on how I did it and what I learned about leveraging AI to streamline app development.
What I Wanted to Build
I'd tried several expense-splitting apps, but most felt cluttered or overly complex. My goal was to create something focused on 3 things:
- Split expenses seamlessly
- Send reminders to friends
- Simplify settling up
With a clear vision, I turned to free AI tools to bring Splitup to life. Here's how you can do the same.
Step 1: Set Up Your App's Foundation
Tool: Cursor + GitHub Copilot (free tiers)
How I Used It: These tools were perfect for generating the app's structure, routing, and boilerplate code. I used Cursor's AI to scaffold my Flutter project and Copilot to suggest code snippets for navigation and basic setup.
Tip: Use Cursor rules for optimal results. Start with small, specific prompts like
- Generate a Login Screen with google and apple login buttons.
- Create a Controller using Riverpod 2.0.
- Keep the business logic in Controller separate from the UI.
Break down your app's core components and let AI handle the repetitive setup work.
Step 2: Build a Robust Backend
Tool: Supabase AI
How I Used It: Supabase was a revelation for me as a first-time user. Its AI features helped me design database schemas, set up Row-Level Security (RLS) policies, define constraints, and create webhooks for real-time functionality.
Tip: Use Supabase's AI to draft your database schema by describing your data model in plain language (e.g., "a table for expense transactions with foreign key constraints to group table (group_id)"). Test and refine the generated SQL to fit your needs.
Step 3: Design a User-Friendly Interface
Tool: ChatGPT
How I Used It: I leaned on ChatGPT for UI inspiration, app icon ideas, and writing app store descriptions. For example, I prompted it with "suggest a clean, modern UI for a budgeting app" and got actionable design ideas.
Tip: Be specific with your prompts:ask for color schemes, layout ideas, or even specific UI components. Use the suggestions as a starting point and tweak them to match your vision. Now I would use https://stitch.withgoogle.com, which would do a much better job at UI design.
Step 4: Debugging, Optimizations and Core app Features
Tool: Grok
How I Used It: Grok was my go-to for debugging tricky issues, writing Supabase edge functions, and exploring monetization strategies. It helped me fix bugs by analyzing error logs and suggesting precise solutions. Apps's core logic of settling balances was written by Grok.
Tip: When stuck, share your code or error messages with Grok and ask for step-by-step fixes. For advanced features like edge functions, describe the logic you need with as much detail as possible, and refine the generated code through iteration.
Key Takeaways for Building with AI
Break It Down: You can't build an entire app with one prompt. Split features into smaller tasks (e.g., "create a login screen" or "write a function to split expenses") and iterate multiple times.
Clarify Your Vision: A clear product idea keeps your prompts focused and ensures AI tools deliver relevant outputs.
Embrace Iteration: AI-generated code or designs often need tweaking. Test early, refine often, and don't expect perfection on the first try.
AI Is Essential: After this experience, I can't imagine coding without AI - it saves time and sparks creativity.
The Result
Splitup is now live on both appstore and playstore, and I'm thrilled with how it turned out. You can check it out here: https://onelink.to/etcezf.
Building it was a testament to how powerful free AI tools can be for indie developers.
Try It Yourself
Start with a simple app idea, pick one or two AI tools, and experiment. What's your favorite AI tool for development, or what are you building next? Share your tips below!
#AppDevelopment #FlutterDev #Supabase #IndieDev #MobileApps #AItools #Tutorial
