Skip to content
BloggerSpot
AI & Vibe Codingbuild log

I Vibe-Coded a Live Website With Zero Coding Knowledge — Here's Every Way It Broke

By The BloggerSpot Author
A terminal window full of errors next to a finished, live website

I don’t code. I want to say that plainly before anything else, because it’s the whole point of this site. I’m not a developer learning in public for fun — I’m someone with no programming background who decided to build a real website anyway, using AI to write the actual code while I supplied the goal, the patience, and (it turns out) an almost bottomless capacity to stare at red error text without understanding a word of it.

The stack was: Astro for the site itself, GitHub to hold the code, Cloudflare Pages to host it, all free. On paper, that’s a completely reasonable, modern, beginner-friendly stack. In practice, it took me through nearly every corner of “you don’t know what you don’t know” that exists in web development.

This is the whole story, in order, warts included. It’s still going — the site is live, but “live” turned out to be a milestone, not a finish line.

Chapter 1: The First Wall Was Before I Even Started

I opened a terminal, typed npm run build like I’d been told to, and got:

'npm' is not recognized as an internal or external command

Turns out: npm comes bundled with Node.js, and Node.js doesn’t come with Windows. Nobody tells you that upfront. You’re handed a command to type as if the ground beneath it already exists.

Lesson zero, before lesson one: the tools you need to run the code aren’t installed just because you decided to start.

Chapter 2: Terminal, CMD, PowerShell, Bash — Four Names, One Confusing Mess

I kept following instructions that said “open your terminal and type this,” and sometimes it worked, and sometimes I got:

git : The term 'git' is not recognized as the name of a cmdlet, function, script file, or operable program.

Even though I had just installed Git. Even though VS Code’s own built-in Git panel could clearly see it and use it fine.

The thing nobody explained: “terminal” isn’t one thing. It’s just the window. The actual program running inside that window is what decides whether a command works — and Windows has multiple different programs that can live inside that window: Command Prompt (CMD), PowerShell, and (once you install Git) Git Bash.

→ Full breakdown: Terminal, CMD, PowerShell, Bash Explained

Chapter 3: “Not a Git Repository” — The Loop That Wouldn’t End

Once I understood terminals a little better, Git itself became the next boss fight:

fatal: not a git repository (or any of the parent directories): .git

Sometimes because I was standing in the wrong folder. Sometimes because I’d accidentally cloned a repo inside a folder of the same name, creating a nested my-site/my-site/ situation.

→ Full breakdown: The “Not a Git Repository” Error

Chapter 4: Deleting Everything, and Then Doubting Whether I Actually Had

At one point I needed to wipe old files and replace them with a new version. I ran git rm -r ., committed, pushed — and then looked at GitHub and thought: wait, are these the same old files, or new ones that just happen to have the same names?

→ Full breakdown: Deleting and Re-Uploading Files in Git

Chapter 5: When “No-Code” Tools Still Made Me Write Code

I was told: just open VS Code’s Settings, search for git.user, and fill in two fields. I could not find those fields no matter how I searched. Eventually the fix was to open settings.json directly and hand-type configuration into it — a real reminder that even beginner-friendly tools have edges where the friendliness runs out.

Chapter 6: The Question That Actually Saved Me — “Can I Just Drag and Drop?”

After enough Git chaos, I asked something I was almost embarrassed to ask: could I just drag my project folder into GitHub’s website instead of using any of this?

Yes. Completely legitimately, yes.

→ Full breakdown: Drag-and-Drop vs Git

Chapter 7: Two Cloudflare Products, One Very Confusing Deploy

I finally got something live — except the URL was something.workers.dev, not the .pages.dev address I expected. I had, without meaning to, deployed to Cloudflare Workers instead of Cloudflare Pages.

→ Full breakdown: Cloudflare Workers vs Pages

Chapter 8: Error 522, My Old Enemy

Connection timed out. Error code 522. This one came back twice, months apart. The real cause both times: routing conflicts from two different Cloudflare mechanisms fighting over the same domain.

→ Full breakdown: Decoding Cloudflare Error 522

Chapter 9: /* and the www vs Non-www Identity Crisis

That little /* in a routing rule confused me more than almost anything else. It’s a wildcard, and it revealed something bigger: Cloudflare treats www.yoursite.com and yoursite.com as two completely separate identities, not one site with an optional prefix.

→ Full breakdown: What Does /* Mean?

Chapter 10: It Went Live — And Then the Real Work Started

Once live, a whole second category of problems appeared: sitemap filename confusion in Google Search Console, leftover indexed pages from a previous platform, a deploy process quietly re-injecting itself on every build, conflicting Lighthouse results between testing tools, and a security scanner flagging a dependency I’d never heard of.

None of these are things a “how to deploy your first website” tutorial prepares you for, because they all live in the space after deployment.

Where This Stands Now

The site is live. It’s also, honestly, still a work in progress. I’m not writing this because I’ve got it all figured out. I’m writing it because I very much don’t, and I think that’s more useful to you than pretending otherwise.