Categories
AI Development

Tips for LLM-based Development With Lovable

This is a collection of tips I’ve picked up over the past few weeks while building on my baseball coaching app using Lovable.

First, start a new feature with Claude. Seriously. Lovable does great UI, but is more focused on getting something built (and usable, from a usability perspective) than making a good capital-p Product.

I start almost every new feature in Claude. I give it enough to get the gist of what I want, then I ask it to have a conversation with me to really hone in on it.

I recently built a feature to recommend a batting order. Here’s the start of the prompt:

Know what this sounds like?

(“A lazy PM?”, you say? Yes, but…)

It sounds like a conversation you’d have with someone smarter than you when you’re just kinda spit-balling an idea. I put this in a Claude project about my baseball project, and then we just “chat”.

Claude asks me questions about edge cases, UI, and usage. It uncovers things I was thinking about but never thought to write down. It also uncovers things I wasn’t thinking about and challenges my answers. Seriously underrated.

Now that you have your prompt, past it into Lovable, but click on the “Chat” option and add one line to the end of it:

Think step by step and build a plan to implement this feature.

In my experience, Lovable LOVES TO WRITE CODE. Which is great, considering that’s what we think we’re asking it to do.

But what I’ve noticed is that Lovable loves to write code before it’s really thought through it. So it is doing it’s thinking while it’s doing it’s writing, which almost always ends up with crappy, error-prone code.

Enabling chat mode and asking it to build a plan before writing code lets Lovable actually think about how to pull this off well.

It will then work for a couple of minutes, put together a real plan that you can review (and change), then give you a button to “Implement the Plan”. One click, and it starts whirring away at building your feature.

Categories
AI Development

Debugging Lovable Bugs

You are running into issues with your Lovable app and are having a hard time getting Lovable to fix it’s own bugs. I struggled with this for a while building my baseball coaching app with Lovable, but have come up with a strategy that has always solved my issue, using only about a tenth of the credits I was using.

  1. Tell it exactly what you see and what you would expect to see. When reporting a bug, talk to it like you would talk to an engineer. Attach a screenshot as proof. "When I click the tab, it's showing pitching stats. But when I click the batting tab, it should show batting stats."
  2. Ask chat to think step by step. This is something that I picked up from the early days of Lovable while watching how it interacted with itself. It tells itself to think step by step. Now, your bug fixing prompt says "When I click the tab, it's showing pitching stats. But when I click the batting tab, it should show batting stats. Think step by step to understand why this is happening."
    • Note: I’ve even started using this outside of Lovable (in Claude or ChatGPT for non-coding related questions) and am seeing a massive improvement in results. It’s like you’re giving it permission to take a beat and think instead of just getting into it.
  3. Ask chat to build a plan. Did you know that you can click on the “chat” button to interact with Lovable without having it right any code? This is helpful if you need to understand how something works. But it’s especially helpful if you want Lovable to build a plan for you to review before it starts writing code.

    When fixing a bug (or even implementing a feature), click on the “chat” button, then submit the query and ask it to build a plan for you to review. This will use a Lovable credit since it’s working, and you won’t have any code output for it, but this has significantly improved my success rate as it actually does some deeper thinking before starting to write code.

    Example: "When I click the tab, it's showing pitching stats. But when I click the batting tab, it should show batting stats. Think step by step to understand why this is happening, then build a plan to resolve the issue."
  4. Restore and try again. Lovable will let you restore to any previous point in the chat. When push comes to shove, restore back to a point before you started building the feature and simply ask again. Since chatbots are non-deterministic, you can get a completely different result by pasting in the exact same prompt.