Blog

Posts

You Can't Tickle Yourself

Using Claude Code to set up our front end and protect us from mistakes.

Tags: Agentic AI, Claude Sonnet 4, Claude Code

Friday, August 1, 2025 9:04 PM

This post is part of a series. Follow along with the development progress here: moodring-vibe repository. More to come!

Please note that this is not a tutorial. This is a documented first-time experience with a fully-enabled AI agent. Do not take this as professional advice. Always protect your data, use version control, and refer to documentation if you decide to follow any of these steps yourself.

Now that we have our database and back end set up, we can establish the remaining key element of our application: the front end.

What better way to start than by making a mistake?

Package bungler

I decided to ask Claude to include a bundler as an afterthought, but I had forgotten that Expo uses its own bundler: Metro.

I quickly realized my mistake. But what if I hadn't? At the end of this post, we'll talk about protections and guidelines we can create that can persist throughout projects.

The rest of the owl

Claude already knows how we want the front end built, so once again, we can just give the green light.

We've already caught ourselves once. Let's evaluate another of the decisions we already made.

Good! This does make our development process easier. And it's nice to know that we can ask Claude to make major changes later—we don't have to get everything right the first time.

Check yourself

There's another benefit to agentic development: you finally have time to write all those tests you never got around to. Of course, we'll monitor Claude to ensure it's disciplined enough to keep its word.

Claude only commited some of its recent changes. We need to make sure that doesn't happen in the future.

Building fences

Anthropic recently released a video about vibe coding in prod. That's not what we intend to do here. So we need to make some changes to which branch we push to...

...and to the commits that already exist in our intended production branch.

Now, this is one area we still need to be very cautious with: version control won't stop Claude from inadvertently removing all your code with a git force push, if your branch allows it. But there are ways to recover from it if you're paying attention. You can use GitHub itself to make a new branch based on a past commit, or you can use git reflog.

If you're the administrator of your repository, you will need to disable force push for everyone including yourself if you want to be sure your entire codebase isn't overwritten by an unintended git operation. This good practice anyway.

Now we need to make sure the main branch doesn't have any of our recent changes.

We do our best to prevent Claude from pushing to main, but we'll need to follow up on this later.

So now that we have the basic components of our app, how do we run it?

Couldn't you stop me?

Claude allowed us to make a couple mistakes during this phase of our setup. It would be better if our agent were more critical of our prompts and contained some failsafes to be sure we aren't advising it incorrectly.

And the important part:

You may notice some rules we didn't define yet in this document. I performed the above prompts while I was reflecting on this blog post, but you'll see how we organically added the unfamiliar rules in some following posts.

You can see how we can not only use Claude to perform our requests, but also to create rules for itself and to evaluate those same guidelines. It's kind of a turtles-all-the-way-down scenario. We'll find out how effective this method is as we go.