Karan

Posted on Aug 1

The One File That Made Every Project Easier to Build 💡📁

#webdev #beginners #career #productivity

Hey everyone,

If there's one habit that has improved every project I've built, it isn't React.

It isn't Claude Code.

It isn't AI.

It's spending time planning before writing a single line of code.

My Biggest Mistake 😅

Up until this year, every time I got a new project idea, I would immediately open VS Code and start building.

Always chasing the thrill of seeing an idea come alive as quickly as possible. A bad habit some of us have.

The problem?

Halfway through the project, I would suddenly realize...

"Wtf am I doing?" 😭

Features would keep changing. The structure would become messy. I would rewrite the same files multiple times.

Sometimes I would even abandon the project completely because I hadn't thought things through.

Looking back, I wasn't failing because I couldn't code.

I was failing because I never planned.

The Advice That Changed Everything 💡

One day, my mentor — a senior developer at GoDaddy — gave me a piece of advice that completely changed how I looked at software development.

She said:

"Real coding begins on paper."

At first, I didn't fully understand what she meant.

Sure, I could sketch a few ideas. But what about things like:

Choosing the right tech stack
Planning the architecture
Organizing features
Thinking about edge cases

Questions like:

What happens if the user enters invalid data?
What if the server doesn't respond?
What if I want to add new features later without rewriting everything?

A simple flowchart wasn't enough.

That's when I discovered the power of a planning.md file.

What's Inside My `planning.md`? 📋

The very first thing I do is ask Claude to brainstorm with me instead of jumping straight into coding.

My prompt is usually something along the lines of:

"Let's brainstorm ideas for this project. Ask me plenty of questions, challenge my assumptions, and then create a planning.md file containing the features for Version 1, ideas for Version 2, and a phase-by-phase implementation plan."

From there, the planning file gradually grows into the project's full roadmap.

It usually contains things like:

Project goals
Core features
Future ideas (V2)
Tech stack decisions
Folder structure
Build phases
Edge cases
Things to remember while developing

Why This Actually Helps 🤖

Whether you're using AI tools like Claude Code or planning everything yourself, having a roadmap makes an enormous difference.

If you're using Claude Code — the planning.md file keeps Claude focused on the original vision instead of slowly drifting away as the conversation gets longer.

If you're not using AI — it still acts as your own personal project roadmap. Whenever you come back after a few days, you instantly remember:

What you're building
Why you're building it
What comes next

The planning file also becomes a place where brainstorming never really stops. As new ideas come to mind, they simply get added to the document instead of interrupting development.

Claude is surprisingly helpful here too. It often suggests:

Better alternatives
Cleaner architectures
Features I hadn't considered
Edge cases I completely missed

How It Played Out For Me 🚀

The first project where I fully committed to this workflow was my Gym Scheduler app.

The very first file I created wasn't a React component.

It was planning.md.

As the project grew, so did the planning document. Once Version 1 was complete, I went back and started planning Version 2.

Later, while brainstorming with Claude again, the idea expanded far beyond a simple scheduler. It evolved into a much bigger vision that included:

Feature	Status
AI-powered schedule adjustments	Planned (V2)
Workout tracking	Planned (V2)
Lifestyle and health tools	Planned (V2)
Trainer–trainee booking system	Planned (V2)