Claude vs. Cursor AI: Creating an Intuitive To-Do Web App to See Which Works Better

Lately, I've been captivated by YouTube videos featuring founders without tech backgrounds who have used no-code tools to create million-dollar apps (though often these apps are simply clones of successful ones generating that revenue).

It's clear the world is moving toward no-code solutions.

I decided to leverage this trend to tackle two of my biggest challenges: rapidly transitioning from idea to prototype and creating a simple to-do app to boost my productivity. To achieve this, I experimented with two AI tools—Claude and Cursor AI.

The Quest for a Simple To-Do App

As a software engineer coding since before 2010, I paradoxically find myself both exhilarated and drained when starting new projects. The excitement of a new idea often clashes with the lethargy induced by starting from scratch, leading many of my projects to remain within the confines of my Notes app.

Frustrated by the lack of straightforward, easy-to-use to-do apps devoid of unnecessary features (trust me, I've tried them all), I decided to create my own - Ikleu.

It's a simple web app where you can list your tasks, assign estimated durations, and begin working on them quickly.

With an intuitive interface, the app tracks your progress, and if you finish before your estimated time, you earn points based on your task's length and time remaining.

This gamifies productivity, incentivizing you to complete tasks efficiently.

All data is stored client-side in your browser—no logins or friction, just a notepad-like UI with a bit extra to help you estimate and complete tasks.

Enter Claude and Cursor AI

While platforms like Bubble.io have been popular for prototyping web apps, I wanted to explore newer players in the market—Claude and Cursor AI.

Claude

Developed by Anthropic AI, Claude is an AI chatbot powered by Large Language Models (LLMs). It's trained for natural, text-based conversations and excels in tasks like summarization, editing, Q&A, decision-making, and code-writing.

The latest version, Claude 3.5 Sonnet, marks a significant upgrade from its predecessor, Claude 3 Opus, notably in coding proficiency—moving from incomplete implementations to fully functioning outputs.

Users find it more robust in handling complex coding tasks and crafting precise written content.

Cursor AI

Cursor AI is an AI-powered code editor that integrates seamlessly with your codebase.

Essentially an enhanced version of VS Code, it aims to boost productivity by embedding AI directly into the development environment.

You can choose from models like Claude 3.5 Sonnet, ChatGPT 4.0, or others. Cursor is designed to be a smart assistant for developers, helping with coding tasks by providing context-aware suggestions and autocompletions.

The Experiment Begins

Curious about claims that you can create an end-to-end web app using Claude, I decided to put it to the test.

I outlined my use case and features in Claude, asking it to build a simple HTML, CSS, and JavaScript app leveraging browser storage.

In about a minute, Claude generated the HTML, CSS, and JS files. Initially, I was thrilled—this was exactly what I wanted!

But did the solution work as expected?

The Reality with Claude

Unfortunately, it didn't.

Many of the UX features I described were misinterpreted. The JavaScript logic was broken, and while the minimalist UI was decent, it wasn't enough to meet my needs.

Turning to Cursor AI

That's when I decided to bring Cursor AI into the picture. I took the code generated by Claude and began debugging using Cursor's AI chat feature.

After spending almost a day, I had a semi-functional web app—far from what I envisioned, but at least it allowed me to input tasks and display them on the screen.

However, as I delved deeper, it became increasingly challenging to track issues.

Relying entirely on Cursor AI led to more problems, requiring me to revisit and understand more code to fix it.

I was down 5 cups of Kauai coffee, hadn't made any significant progress, and it was all very exhausting.

A New Approach with Cursor AI

Frustrated, I decided to ditch AI assistance entirely for the JavaScript logic.

I kept the HTML and CSS but deleted all the JS code to start from scratch.

This is when I truly discovered the power of Cursor AI.

The tab-complete feature, which performs context-based analysis to autocomplete your code, is one of the most powerful features I've encountered in any IDE.

I was able to set up a skeleton of my end-to-end logic in less than an hour—it was magical!

From there, it took me a couple more hours to refine the UI/UX to my satisfaction and introduce more session storage logic.

Since I knew exactly how I wanted to structure the core logic, my interactions with AI were now focused on specific issues—asking it to figure out why a line was erroring or to fix or extend particular parts of the logic.

In this context, the AI agent was spot on, with hardly any faulty logic.

Even CSS animations, which Claude struggled with, were a breeze with Cursor once all elements and logic were in place.

The Verdict: Cursor AI Wins

Overall, I felt more confident in my speed and code quality when I wrote the JavaScript logic from scratch using Cursor AI's assistance.

In just a few hours, my web app was ready.

And therefore, for me, the clear winner is Cursor AI.

While I've read articles suggesting Cursor AI has limitations with lesser-known languages, my experience with JavaScript, HTML, CSS, and even Python (on an unrelated project) was nothing short of magical.

Can Non-Tech Users Build Apps Easily?

But can Cursor AI be used by users with absolutely no tech expertise to build a web app easily?

No.

If you don't know what you're doing or what the core parts of your app are, you can easily get confused and exhausted.

This is true for Claude as well, especially the Claude chatbot.

Conclusion

While I'm convinced that, in its current state, neither Claude nor Cursor AI will deliver a fully functional app in minutes—as some click-bait YouTube videos claim—I'm also convinced that this is the most powerful generative AI has ever been.

Mark my words - the paradigm shift toward no-code tools is only going to intensify.

So, hop on the train and give Cursor a try. I'll keep you posted on a few other projects I'm developing with Cursor.

Meanwhile, try my simple to-do web app called IKLEU and share your thoughts on Cursor vs. Claude in the comments below!