It wasn’t always my plan to jump on to the current AI (or LLM) driven development or vibe-coding. But at some point my curiosity got the better of me and I wanted to see for myself what all the fuss on Linkedin was about.
While attending some professional events in Helsinki, I came across a presentation by someone on how they had built entire projects using Lovable and so I decided to give it a try. My agenda was to build a website for my newly established company as a proof of concept. Additionally, I was aiming to have something portable that did not force me to get stuck with a hosting platform.
Here’s what i learnt.
The Process
Since I have little to no experience building websites using modern Javascript/Typescript frameworks (although I can code in JS), I was almost completely reliant on Lovable getting the design patterns and architecture right. For a small website this isn’t necessarily a problem. There were a few key steps though.
- An AI assistant drafts the prompt for Lovable. I used MS Copilot as i have a subscription. I instructed it to generate a prompt for Lovable in markdown as per my requirements.
- Use the prompt in Lovable. It was fairly straightforward. Lovable generated the first draft and also some output in the chat window around the tech-stack decisions, theme and content choices and so forth.
- Connecting with Github. After the first draft, the content was not as expected and it didn’t feel quite useful to have Lovable edit everything, not the least because there are limited free credits in the gratis account tier. I decided that this was a good opportunity to re-learn version control - something I hadn’t used in a few years. So I connected my project with my github and it was farily seamless in Lovable.
- More github. I decided to create two branches from the master repo: one for Lovable and one for the edits that I made directly. This would allow me to revert changes if things went south. I used the Lovable branch for more involved tech changes, including writing a PHP script for connecting the contact form to the backend MySQL database on Hostinger platform. I kept my branch almost solely for content and design changes.
- Upload the generated files to Hostinger. Generating the output was quite painless as well thanks to npm. Lovable generated an easy-to-follow Readme.md file that helped a lot.
- Some modifications to the footer by prompting Lovable.
- Connect the domain, test everything manually. I had to make sure that the contact submission form was working as expected.
And that was that, the website was live in about 20 hours of work.
What I learnt
The overall process creates an illusion of fluidity and error-free development. However, the chickens can quickly come home to roost if you aren’t on top of the source-code and perform an audit. This style of development works satisfactorily for small-scale projects and rapid prototyping but I would be skeptical of how well it can function out of the box for more complex products.
With some experience in developing websites for pocket money back when I was a master’s student, there was some latent know-how on how to set things up and I had an experienced full-stack developer to lean on for advice. But i don’t think vibe-coding can completely replace experienced developers.
As an example, the PHP script that connects with the backend has to be written pretty defensively to prevent hacking attempts. Lovable also did not include any tests and didn’t automatically build a CI/CD pipeline. If you are not at least cursorily aware of these crucial best practices, the likelihood of building a project that works until it doesn’t remains substantial.
And I certainly wouldn’t launch something mission critical without an extensive audit with the help of seasoned professionals.
That said, not having to write boilerplate code and minutely worry about each and every transition, design and style element was a relief.
Next Steps
Since this is still more of a proof of concept project, I am leveraging it to improve my understanding of modern web interfaces and design patterns. I explicitly introduced tests by prompting Lovable and also used it to incorporate a CI/CD pipeline.
But once you get down this rabbit hole, there are other things that come to the fore. For example, your development environment needs to be set up for the tests to run, mimicking the functionality of the backend database.
…
All in all, there have been important learnings and it’s been a fun-ride so far. My future intention is to use more of these tools to improve my skills but marry my enthusiasm with a healthy dose of caution.
As regards to my business prospects, well it’s been a rough beginning. C’est la vie.
Hey, at least I got a blog post out of it!