← Back to Blog
Showcase 8 min read

I Built a Notion Clone in 3 Hours

A real walkthrough of building a functioning Notion-style notes app using AI tools. What worked, what didn't, and what I learned.

By Kaden · May 3, 2025

Last Saturday I decided to test something: how far could I get building a Notion-style notes app using AI, starting from zero?

Three hours later, I had a working app. Not production-ready, not something I’d charge money for — but genuinely functional. Pages that nest inside pages. Rich text editing. Data that persists in the browser.

Here’s how it actually went.

The first hour

Started with the skeleton: sidebar on left, editor on right. The basic layout came together fast — maybe fifteen minutes to see something on screen.

The first real challenge was the nested pages structure. How do you represent pages-inside-pages in a way that’s easy to work with? The first attempt wasn’t quite right. Needed to think through the data model more carefully.

By the end of hour one, I could create pages and they appeared in the sidebar. Small win, but tangible progress.

The second hour

Now the core: actually editing content. Rich text formatting — bold, italic, headers. The kind of thing that sounds simple until you build it.

Choosing the right library mattered here. Some approaches would have been a rabbit hole. The one I landed on integrated cleanly and saved hours of custom work.

Content saved automatically as I typed. Refresh the page, everything still there. Not elegant under the hood, but it worked.

Drag-and-drop for reordering pages took longer than expected. Edge cases kept appearing. Three or four rounds of refinement to get something stable.

The third hour

Polish time. Page icons. Search. Visual bug fixes I’d been ignoring. The last thirty minutes were tweaking — making empty states nicer, keyboard shortcuts that felt right.

Small stuff that made it feel less like a hack and more like software.

At the end of three hours, I had something I’d actually use. Not a Notion replacement — too many features missing for that. But as a proof of concept? Legitimately impressive.

What surprised me

The speed was obvious. Three hours from nothing to working app is wild if you think about what that would have taken pre-AI.

What surprised me more: the code quality wasn’t terrible. It wasn’t perfect — there were some patterns I’d refactor if I was keeping this. But it was reasonable. Organized. Followable.

Also surprising: how much iteration mattered. The first attempt at almost every feature needed adjustment. Not because Claude Code was wrong, exactly, but because my initial descriptions were incomplete. Getting precise about what I wanted was half the work.

“The AI didn’t replace thinking. It replaced typing.”

What I’d do differently

If I did this again:

Start with a clearer spec. I made up features as I went, which caused some backtracking. Five minutes of planning would have saved twenty minutes of rework.

Test more frequently. A few times I built multiple features before testing, then had to debug compound problems. Smaller iterations work better.

Don’t accept the first suggestion if it feels wrong. Sometimes I went along with Claude Code’s approach even when I had doubts. Pushing back earlier usually led to better outcomes.

What this means

I’m not saying anyone can build Notion now. The real Notion has years of work from a huge team. What I built was a toy by comparison.

But here’s the thing: a toy that works is more than most people ever ship. And a toy can become a tool with more time.

The barrier to building has genuinely lowered. Not to zero — I needed to know what to ask for, how to troubleshoot, when to push back. But dramatically lower than it used to be.

If you’ve been sitting on an app idea, waiting until you “know how to code” — that excuse is getting weaker every month.

Ready to Start Building?

Our bundles teach you practical workflows for building real projects with AI coding tools.

See the Bundles →