Site icon Animalz

Code Is Now Content: How We Built Our SEO Calculator With AI

Code is now content hero image

“Software is now content,” writes Dan Shipper, co-founder of Every. His statement captures a shift most of us haven’t yet grasped: marketing teams — like yours! — can now build apps with AI and without coding skills.

AI researcher Andrej Karpathy calls this “vibe coding:” You provide high-level ideas and direction (the vibe) while the AI handles the technical details (the code).

For the past six months, I’ve been vibing as a non-coder. I’ll show you what I’ve learned from converting a basic SEO forecasting template into a polished, public-facing tool.

Famous Last Words: “I’ll Build That In an Hour”

My adventure started with a messy spreadsheet that estimated organic traffic from a list of keywords. While it worked for internal strategy gut checks, we’d never show it to a client: a cacophony of cells, jumbled formulas, and zero brand polish.

The genesis of our forecasting app: a good old spreadsheet.

I said, “I can turn that into an app in less than an hour,” overconfident from my first successful vibe coding experience — updating our content refresh tool Revive.

I opened Anthropic’s Claude, pasted in the spreadsheet’s logic with some additional context,
prompted it to create an app, and…

A functional SEO calculator appeared!

The final version on the right still bears some resemblance to Claude’s first mockup.

Smooth sailing vibing so far.

Styling was easy, too. I attached our brand guidelines and a screenshot of Revive, and Claude more or less nailed the design that appears in the live tool today.

Let’s pause here for a moment to reflect on what we just did. In half an hour, I created a professional-looking, functional mini-app. Pre-AI, this would have taken a developer at least a day.

I was right: I could build the app in under an hour!

Well, yes, but there were issues.

You can click around in prototypes within Claude’s interface, but you can’t run more complex code and interactions, like uploading CSV files with keywords, as I wanted to do.

The other problem with coding in Claude is its usage limits (even on the paid plan). Each interaction uses “tokens” — essentially credits that measure how much you can ask the AI to do.

Generating code uses up these tokens quickly, especially if, like me, you don’t really know what you’re doing and need multiple attempts to get things working. And so you’ll often find yourself waiting for hours until Claude will help you again.

Quick aside: My coworker and fellow vibe coder Nathan Wahl sees Claude’s limitation as a benefit. Both of us discovered (and you might too) that coding is addictive. He finds himself at his computer way past bedtime too often, trying to fix or add just “one more thing”—Claude’s usage limits actually force him to go to sleep.

Time for the Big League With a Real Dev Tool

As you get more ambitious with your apps, you’ll run up against the limitations of AI chat tools — as I did. To build exciting stuff, you need a real programming tool that allows you to:

I’ve been using Cursor, but similar alternatives exist, like Replit and Windsurf. They all present a similar interface: overwhelming walls of code and a small AI chat panel on the right.

The good news is that you’ll rarely have to venture into the dark depths of code because most of your time is spent in that chat window.

Does that mean you should say goodbye to Claude and ChatGPT? Not at all. They were often the last thing standing between me and my computer flying out of the window after hours of failed bug fixing. But we’ll get to that.

First, let’s go back to Cursor’s chat window and the SEO forecasting tool.

In the chat, I explain in plain English what I want to build, saying things like:

Whenever I give tasks like these, the AI proposes a change to accept or reject.

Pro tip I learned the hard way: before starting in Cursor, discuss your project with an advanced AI model like Claude or ChatGPT’s o1 pro. Explain you’re building an app and want the AI to help you think through the scope and architecture. The AI will create a brief for Cursor to set up an organized file structure.

I skipped this step and ended up with all my code in one massive file — a mess that forced me to rebuild significant parts of the project later.

Surviving the Valley of Death (Where Ambitious Apps Die)

With AI handling the code, is there anything left for you to worry about? Well, yes. The challenge is getting your tool to function and feel exactly how you want it to.

The hill I nearly died on during this project was the algorithm behind the forecast. It’s the perfect example of why a tailored experience increases the time you spend on app building — and the handicaps you face as a non-coder.

Initially, the forecasts of the Claude prototype seemed good. But as I started looking at details, there was a lot to dislike:

Issues like these led to endless conversations with my code in Cursor. “Make it harder for low DA sites to rank for high KD keywords.” “Introduce a probability for keywords not to rank at all.” And so on.

This worked, until it didn’t.

Low DA sites stopped ranking for hard keywords, but then the probability for keywords not to rank would break. I fixed that, then my low DA sites would rank again for hard keywords.

I was going around in coding circles, and it was driving me mad. I knew a real coder would solve these issues in minutes, but I could only work through my interpreter, Cursor’s chat.

I was ready to throw my computer out the window. As a last resort, I called the Mr. Wolf of AI models, ChatGPT’s o1 pro.

Just as different team members bring unique strengths to a project, each AI model has its own “personality” and role. Claude is fast and excels at creativity and regular coding tasks. O1 pro is like a senior engineer: analytical, wise, and thorough (and expensive!).

This became my standard troubleshooting process whenever I hit a wall:

  1. Ask Cursor for an exhaustive overview of the problem and the solutions we’ve tried “for a senior engineer to review.”
  2. Bring Cursor’s output and relevant code to o1 pro.
  3. Ask o1 pro to find the problem and propose solutions written in a prescriptive way for “your developer to implement.”
  4. Copy-paste the solutions back into Cursor to see if they solve your problem. Usually, they do.

This approach saved me countless times. Once, I’d tried everything to tweak the forecasting algorithm but kept seeing incorrect values in my chart.

Cursor was no help. It kept contradicting itself while the charts remained stubbornly wrong. First it would insist, “The calculations are correct, no changes needed.” Then in the next response: “Actually, we need to change the algorithm.”

I’d make the suggested changes, but the charts were still incorrect. Then Cursor would flip back: “No, the original calculations were right after all.” Round and round we went in a maddening loop.

By calling in o1 pro to review the relevant code, I determined:

  1. The algorithm was working as I intended.
  2. The problem was in the front-end code that renders the user interface.
  3. A duplicate piece of code caused problems and had to be removed.

This debugging dance between different AI models became a regular part of my development process. Sometimes, I felt less like a developer and more like a messenger running between AI tools — perhaps a glimpse of our future role: coordinating AIs instead of doing the work directly.

Here’s another example of my AI runner role: I used Gemini’s Deep Research feature to analyze SEO performance benchmarks from Ahrefs, Backlinko, Moz, and others. (ChatGPT and Perplexity have since introduced similar deep research capabilities.) The AI extracted metrics and patterns about ranking factors, which I then fed to o1 pro and Cursor to refine our forecasting algorithm with real-world data.

Think You’re Done? Let’s Deploy

I spent more time wrapping up the project than creating the initial MVP because to make an app accessible to others, you must host it on a server.

For non-technical folks like me, doing so used to be intimidating, cumbersome, or impossible. Now, because of serverless deployment platforms like Vercel, it’s become feasible: Vercel configures a server for scripts, programming languages, databases, and anything else required to run your app.

Vercel, your app’s final destination.

That’s not to say it’s easy. For starters, you need to sync your app into Vercel through GitHub, a version control system for code. (And we’ll touch on how much I like GitHub soon…)

After getting your app in Vercel, you’ll likely face a few, “but it worked on my computer!” moments. For example, my email capture form stopped working because Vercel needed separate access credentials to ConvertKit (an email service).

As before, my friend in such situations is ChatGPT (and especially o1 pro). I could have never navigated Vercel without an AI chat window to guide me when I got stuck.

Pro tip: When you don’t know what to do, drop screenshots into ChatGPT or Claude, and it will tell you exactly what to try next.

Once I finally had the app accessible to others through Vercel, there was one step left for actual humans: testing.

I asked AI to point out issues with my work, but fellow beings still found flaws our robot friends missed:

Some of these issues took a minute to fix. Others sent me through another hour-long loop of Cursor → o1 pro → Cursor. 🤯

What I Learned the Hard Way

Here are the most valuable lessons I learned from weeks of running between AI tools, banging my head against walls, and nearly launching my laptop into orbit building with AI. Hopefully, they save you some headaches.

I talk to three of the below lessons in this video on LinkedIn.

Be Realistic About Your Scope

Don’t dismiss the “5-minute AI app” possibility. But before you start, evaluate if you’re building a standard app AI can quickly create or something bespoke that will take much more time. That clarity helps you decide if the project is worth pursuing.

I thought our SEO forecaster would be quick and simple. Weeks later, I wished I’d done that assessment more carefully. I might have approached the project differently — or invested my time elsewhere.

Pick the Right AI for Your Needs

Each AI model brings different capabilities (dare I say “personalities”?) to your development process, much like team members with distinct roles:

Know When to Ship (and When to Stop)

AI makes anything possible. There’s always another improvement to make or flaw to fix, so it’s tempting to keep tweaking forever.

My SEO calculator started with basic calculations. Then, it grew to include real-world benchmarks and probability curves. Each addition added complexities, potential bugs, and debugging time.

The trick is finding a balance between “minimum viable” and “perfect.” Start simple, validate with real users, and add complexity only when truly needed. Ship the app before you convince yourself to add “just one more feature.”

Accept Version Control as Your Frenemy

AI sometimes introduces unwanted changes in unknown places. Without version control, you quickly end up in a maze of broken code with no way back.

I learned to save frequently with GitHub so I could revert when things went wrong — which happened often.

(Actually, that sentence doesn’t begin to capture the struggles I’ve been through to get some understanding of GitHub. Even after this project, I still need a cheat sheet with GitHub commands AND constantlyask ChatGPT questions about it.)

Let AI Be Your Translator

AI became my universal translator throughout this project. Not just for turning my feature requests into code, but for bridging many other gaps in understanding:

Be Engaged, Not Afraid

The black screen filled with code can seem scary at times. But vibe coding means you don’t need to understand every technical detail — that’s the AI’s job.

You do need to keep an eye on the AI’s actions. Watch for obvious issues like it getting stuck in loops or duplicating files unnecessarily. You’re still the driver, though it often feels like you’re in the passenger seat!

Yes, We Can Code Now

We’ve entered a world where AI lets anyone build software without first spending years learning how to code. But building well still requires patience, planning, and persistence. The “5-minute AI app” is possible but often won’t meet your needs, especially if you create apps for others.

Still, this democratization of coding is significant. It seems like a small miracle that I eventually ended up with a live SEO forecasting tool.

With curiosity and determination, you can create scripts that speed up your day, interactive experiences that delight your audience, and tools that solve real customer problems.

So, take a sticky note, write “code is now content,” and put it on your screen as a constant reminder of your new superpowers.

Exit mobile version