bhopali.in
हिन्दी
claude ai-coding astro web-development experiment

How I Built bhopali.in With Claude Code

· 4 min read
Share this

I want to tell you exactly how this website was built, because I think the process is as interesting as the result.

Most of bhopali.in was not written by me — at least not in the traditional sense. I didn’t open a code editor and type HTML and TypeScript. Instead, I had a conversation. A very long, very detailed conversation with Claude Code (Anthropic’s AI coding assistant), where I described what I wanted and Claude wrote the code.

That conversation is documented in full in the project’s STORY.md — literally every prompt I gave and what resulted from it. This article is the human reflection on that experience.

How it started

I owned the domain bhopali.in and had a clear picture in my head of what I wanted: a content-rich, bilingual (Hindi + English), fast, accessible, SEO-optimised site — with no WordPress lock-in, portability built in, and modern UI/UX.

The first conversation wasn’t about code at all. It was about architecture. I asked: “WordPress or something else? Node.js or VPS?”

Claude’s response was to reframe the question entirely. The portability requirement wasn’t a hosting problem, it was a content problem. The answer was Markdown in Git, built with Astro. I didn’t know what Astro was before this conversation.

What I provided vs what Claude built

Here’s the honest breakdown:

I provided:

  • The vision and requirements (in plain language)
  • Business context (MFD, YouTube channel identity, “being curious…”)
  • Content direction and editorial standards (“not AI-sounding, human voice”)
  • Every decision when there was a choice to make
  • My WhatsApp number, social links, etc. (things only I could know)
  • Review and feedback after each phase

Claude built:

  • The entire technical stack (Astro + Tailwind + TypeScript + i18n)
  • Every component (Header, Footer, BaseHead, ContactForm, AuthorBio, etc.)
  • The bilingual routing system and content collections
  • The design system (lake-teal + saffron palette — a choice Claude made based on my description of Bhopal as the “City of Lakes”)
  • The PHP contact form handler
  • The .htaccess security configuration
  • All the documentation (STORY.md, DECISIONS.md, ARCHITECTURE.md, SETUP-GUIDE.md)
  • Git commits with proper commit messages

What surprised me

The design decisions were often better than I expected. When I described Bhopal, Claude chose a lake-teal palette and a saffron accent (heritage/sunset tones) without me asking for colour guidance. It felt right immediately.

The documentation was genuinely useful. The STORY.md captures every decision with its reasoning. When I come back to this project in six months, I won’t have to reconstruct why things are the way they are.

Claude pushed back when I was wrong. I assumed a contact form would require a VPS or Node.js. Claude explained clearly why that was incorrect and why PHP on shared hosting was better for my use case. That kind of honest correction is what I needed.

The bilingual implementation was robust. I said “bilingual from day one” and expected a simple language toggle. What I got was proper Astro i18n routing, hreflang tags, Devanagari-capable fonts, and separate content directories per language. It was more complete than I anticipated.

What I’d do differently

Start the content earlier. The architecture took several hours of conversation. The first real article (the Upper Lake piece you can find in the Explore section) was written in about 20 minutes once the system was in place. The system matters, but content is what actually brings people to the site.

Have my credentials ready. Things like the GA4 ID, WhatsApp number, and AMFI ARN could have been provided in the first session. Instead they’re placeholders. Not a big deal, but it would have made the first deployment cleaner.

What this means for how I work

bhopali.in taught me that my job in an AI-assisted build is to be a clear, demanding client — not a passive observer. The more specific I was (brand voice, what the site should feel like, what should be left out), the better the results. Vague prompts produced vague results.

The skills that mattered: knowing what I wanted, being able to describe it precisely, and knowing when to push back on suggestions that didn’t fit.

The skills that stopped mattering: knowing TypeScript syntax, knowing how to configure Astro i18n, knowing what .htaccess security headers look like.

That’s a meaningful shift. And this whole site is the evidence.


The complete build conversation is documented at docs/STORY.md — a living document updated with every change to the site.

MM

Manish Mahadware

Curious explorer from Bhopal. After ~20 years in IT, I now build websites, apps and AI-powered utilities for clients, make YouTube videos, and help people invest through mutual funds.

Tools: Claude CodeAstroTailwind CSSGitHub