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 Rate Analysis
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. How can we quickly capture data from direct mail marketing returns? The solution to this problem was an expensive document scanner, data entry, or discarding the mail as a sunk cost. I built Returnzilla app, which allows anyone with a mobile phone to rapidly photograph the return mail. Those photos are batch converted into a data table using AI vision. That data is structured and prepared in the Returnzilla app for reporting return rates or integration into a suppression/enrichment list.
Working in 2 Hour Sprints
When I built this app, I was in bed sick, so I completed 80% of the work typing into the Lovable AI chatbot from my iPhone. 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 information 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. The foundation for your app lives in 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
To deploy my app, I consulted an sr engineer to do a code review. Lovable and Supabase together accelerate a lot of the iterative work. As a result, the build process that took hours shaved weeks off my timeline. However, moving beyond a prototype is not as simple as publishing to the web. Even with a simple app like Returnzilla, I had to take some important steps to properly secure the app.
Lovable does provide security scans as part of the design and development process. If you have ever built an app, you know that 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 was 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 from an sr engineer before considering your app production-ready.
For DataTools Pro, I already have access to a number of paid services and previous work that I reused. Here is a basic list of configuration steps required to prepare for production.
Secure communication relay for email– I use SendGrid to handle my application emails.
Domain Routing and Web Application Firewall (WAF) – I moved my app to the datatoolspro domain. Cloudflare is 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. If you do not have experience designing signed file access from a web app, you will need help from a developer.
Access to Device Camera – I set up Returnzilla to request access to the camera, but not the photo library. Error handling and mobile/desktop device handling took some time to test and validate, and required guidance for the AI that probably would have been easier to code.
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 manually unit test and system test without fuss. Knowing your way around the browser console and logs is very helpful. A more complex app will require proper regression testing, system testing, and promotion management. I moved my Lovable work to a development branch and now promote through a versioning step in GITHub.
These standard software development lifecycle procedures are 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.
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, has ushered in a new process for our work on DataTools Pro, where I 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. Now, I have a hook to go to a segment of marketing leaders who are doing direct mail. I will report back on how it works!
If you happen to do direct mail marketing, give Returnzilla a try. The first 50 scans are free!
