I saved $2,000 building this tool with AI
I discovered a new AI tool called Lovable that’s changed how I build websites. Lovable bills itself as “your superhuman full stack engineer.” For non-coders like me, this means you can write a prompt describing what you want to build in plain English, and Lovable interprets it to turn your idea into reality. You can try Lovable for free, but for a proper website like the one I’m about to show you, you’ll need their starter subscription at $20 per month. Lovable gives you a URL so you can view your site on the web, but I wanted a custom domain, so I headed to Namecheap and got one for just over $10. For hosting, I used Netlify. The free version works for one simple website, but if you’re building multiple sites, you’ll want to upgrade to Pro for $19 monthly. Trust me, as someone who’s built many WordPress sites, this is affordable. Some of my WordPress hosting bills have cost hundreds of dollars per month. Before writing your prompt, spend time thinking about what you want to build. I’ve been training for a triathlon recently, and one thing triathletes obsess over is calculating carb consumption for races and fluid intake. After browsing various calculators online, I decided to build my own. I started by asking ChatGPT to help me write a good prompt for Lovable. My initial idea was to create a carb-fueling guide for triathletes. ChatGPT helped refine this into a prompt for an interactive website with specific features. I spent about 15 minutes refining the prompt to include all my requirements. Then I pasted it into Lovable, which promised to create a beautifully designed website for triathletes. On the right sidebar, I could see all the code Lovable was writing for me. Although I know some HTML and CSS, I’m not a coder and have zero interest in learning to code. I just wanted to see if this AI tool could create something useful for my next race. Lovable spent about five minutes creating the website, complete with a visual identity. I was pleased with the color scheme and branding, though I didn’t like the name and it was missing a top menu bar and supporting pages. However, I was amazed by the tools Lovable created. It recognized the four popular triathlon race types—sprint, Olympic, half, and Ironman—and built a fueling strategy calculator for each distance based on weight, race duration, experience level, and intensity. This was fantastic because I usually spend ages googling this information or writing it down by hand. Lovable even coded recommended carb sources and placed a nice FAQ at the bottom of the page. While some elements were missing from this niche calculator, I was happy with the first version. I spent another hour reprompting Lovable to improve the site—updating the footer, adding content, and enhancing the calculators. I included keywords for SEO and previewed each version. Being a new tool, Lovable sometimes had build issues requiring me to reprompt it to rebuild parts of the site. I got better results when providing specific information. For example, I shared guidelines about carb consumption for triathletes and added information for the resources pages based on my triathlon training experience. After several iterations, I changed the site name and built out a top menu with sections for diet basics, training supplements, race supplements, a race day checklist, and nutrition tips. I also updated the footer to link to Fitter Habits, a niche website I built years ago. Next, I asked ChatGPT what other calculators would be useful for triathletes. It suggested a sweat rate calculator, race nutrition planning tool, and electrolyte needs estimator. Lovable easily added these features—something that would have taken me hours to code or thousands to outsource. The sweat rate calculator lets you input pre-exercise weight, post-exercise weight, fluid consumed, and exercise duration, then calculates your sweat rate with scientific resources explaining the methodology. The electrolyte calculator works similarly, adjusting for duration and body weight to calculate needs in a visually pleasing table. I also asked Lovable to prepare the site for Google indexing with keywords, an SEO sitemap, metatags, and clean navigation. I added a tracking script for analytics and had Lovable source quotes from famous triathletes to enhance the homepage. For the triathlon packing checklist, I asked Lovable to improve the design and make it downloadable, since you wouldn’t be looking at a website while preparing for a race. It coded the site so users could download a PDF checklist to reference on their phone or print out. Once satisfied with the design, I spent about 10 minutes researching domain names and chose mytriathlonÂcalculator.com, which I purchased from Namecheap for about $10. Then I pushed the code to GitHub and connected Netlify as my hosting provider. All in all, I spent just 2–3 hours building this triathlon calculator website—something I’ve wanted to create for a while but never had the time or resources for. There are improvements I’d still like to make, like combining all calculators and checklists into a single downloadable PDF. Eventually, I could connect the site to Stripe and turn it into a viable business. If you want to check it out, head over to mytriathlonÂcalculator.com. I’m pleased with the results, and it’s given me ideas for other micro niche sites and tools I could build. Are you using AI tools like Lovable to turn your ideas into reality? What would you build? If you want help writing better prompts for AI tools like ChatGPT, Claude and even Lovable, check this out. |