Lovable Vibe Coding has captivated the market, enabling “vibe coders” with the ability to prototype and deploy apps in record time. With a full book of clients and workload, I found myself with an abundance of time fighting off a horrible cold for a week. I asked and posed the question… How long would it take me to build a fully functioning app with the following features:
- User sign-up and authentication
- Integration with 3rd party service: OpenAI
- Control over mobile phone function (camera)
- Secure with storage for upload
- Account and subscription management
- Payment management (Stripe)
- Responsive, multi-device support (mobile and desktop)
- Data export to CSV
- Secure delivery optimized system emails
Solving a simple problem: Return Mail Scanning
With no shortage of app ideas and prototypes, I decided to solve a very specific problem related to direct mail marketing: return mail management.
I decided to solve a simple analog problem. Direct mail marketing returns come back in bins. The solution to this problem is to purchase an expensive document scanner, data entry, or discard it as a cost of doing direct mail marketing. I built an app that allows someone with a mobile phone to rapidly photograph return mail and batch convert images to data with AI vision. That data is structured and prepared in the app for reporting return rates or integration into a suppression/enrichment list.
Working in 2 Hour Sprints
When I built this app, I was down sick lying sick so I completed 80% of the the work typing into the Lovable AI chat bot. I rested while it did all of the work. In 6 hours over 2 days, I had a working app that I was sharing with friends and family. They helped me come up with the name Returnzilla!
Having a clear vision of outcomes and value is more important than knowing what features to build…
If you don’t know exactly what to build or how to solve the problem, you should not start in Lovable. Instead, you should start your journey with ChatGPT or Claude. Explain the problem you are solving, and what features you are considering to solve the problem. Have the LLM break down and plan features that will make the most sense. Copy and paste that infromation into Lovable and let AI take the first leap forward prototyping your app.
Supabase is the unsung hero of Lovable Success
Lovable is a great front-end prototyping tool. To build an app, you need a database and middleware services to transact data to and from your database and third-party services. That is where Supabase comes in. I have used Google Firebase, but have immediately found an incredible alternative with Supabase!
- Managed PostgreSQL Database: Supabase provides a fully managed PostgreSQL database, offering the power and flexibility of a relational database system with features like advanced data types, indexing, and full SQL support.
- Authentication and User Management: It includes a comprehensive authentication system to securely handle user sign-ups, logins, and access control. It supports various methods like email/password, social logins (Google, GitHub, etc.), and multi-factor authentication.
- Realtime Subscriptions: Supabase enables real-time data synchronization between the database and connected clients, allowing for instant updates in applications like chat or live dashboards.
- File Storage: Supabase offers a secure and scalable file storage solution (built on S3 compatibility) for managing user-generated media like images, videos, and other files.
- Edge Functions (Serverless): It allows developers to deploy and run serverless functions (written in TypeScript) globally at the edge, close to users, reducing latency and improving performance.
Lovable Vibe Coding Prototype vs Production
If you have gotten to this point and are thinking there is still a lot of understanding needed to build an app, you are right. To deploy my app, I consulted a sr engineer to do a code review. Lovable and Supabase together accelerate a lot of the iterative work that historically happened over days/weeks in minutes. If you want to move beyond a prototype, even with a simple app, you need to take some important steps to lock down the app.
Lovable does provide security scans as part of the design and development process. If you have ever built an app, you know scrubbing inputs, CSPs, and other basic app design best practices must be followed. For a basic website, like the one I built for GoodmanGroup LLC, there is not a lot of work needed to make it production ready. The moment you start collecting data and adding gated content, it requires a login, the requirements to get to production change dramatically! I highly recommend seeking advice and oversight of a sr engineer before considering your app production ready.
In my case, I already have access to and configured best practices and multiple rounds of penetration test checklists to accelerate my journey. Here is a basic list to get you started:
Secure communication relay for email– I use SendGrid to handle my emails.
Domain Routing and Web Application Firewall (WAF) – I moved my app to the datatoolspro domain. I use Cloudflare as my DNS and proxy for all web apps.
Captcha – I use Cloudflare Turnstile to handle my captcha, which helps block bots from trying to sign up or attempting to overload my forms.
File Security – When I implemented file upload in Lovable, the default setting is to leave files wide open to the internet.
Access to Device – In an overabundance of caution, I set up my app to request access to the camera but not photos. I personally never give open access to any apps to access my photos.
Testing and QA
Lovable does an incredible job creating clean user experiences and connecting front-end, middleware, and backend. For this app, there are very few screens and workflows, so I was able to test and validate without a huge effort. A more complex app requries proper regression testing, system testing, and promotion management. These standard software development lifecycle procedures is just one example where you may need to make a jump from “vibe coding” prototypes to a properly managed and maintained application.
One of the challenges and cautions I provide to anyone wanting to vibe code their way into production is to stick to very simple apps or use Lovable for what it does best…prototyping. For example, I have mostly abandoned wireframing from my app design process for DataTools Pro.
Bottom Line: I love Lovable + Supabase
I love any product that allows me to extend my knowledge and experience to get more done. This design pattern, using AI to rapidly prototype, is fostering a completely new design pattern for our work on DataTools Pro, where we want to increase throughput by 30% by the end of the quarter.
Vibe coded micro-apps will change the way marketers think about microsites and lead magnets. Returnzilla at it’s core is a lead magnet to offer data services, identity reconciliation, and full funnel analytics. Who cares about return mail costs? Marketing leaders…. Now, I have a hook to go to a segment of marketeting leaders who are doing direct mail. I can demonstrate how I solve a simple pain point for pennies and lead into big and challenging problems of identity reconciliation and funnel optimization.
If you happen to do direct mail marketing, give Returnzilla a try. The first 50 scans are free!
