Creating a Website with AI

Inspiration:

After the barrage of “Vibe-coding Hype” posts, I was inspired to build an app. That went well until you hit the “80% wall.” Once it’s built enough, it will continually break two things to fix one. Rather than restarting, I stopped and decided to do something easier before retooling and starting from scratch on the initial project.

Premise:

Can I, having never published a website without WordPress or web-flow, write a website entirely from scratch using AI tools to design and build a modern website?

Steps 1 (Pick a stack):

My Previous coding experience (Javascript, HTML, CSS, the foundation of websites, as well as Java).After going back and forth with ChatGpt, I settled on Astro. I felt using a language that I didn’t know that allowed for the integration of other languages would test the claim that vibe coding is the new wave.

Step 2 (Try to go at it fully AI-coded till you choose a template to work from):

After a few failed attempts, I settled on using a template called Devolio from a template repository. The idea was that if creating a fully new website was too time-consuming, working from a template would simplify things. I would then customize the layout while relying on the template’s initial structure.

Step 3 (Test tools & Processes throughout the process to find what works):

ChatGpt, Github Copilot, Claude with an MCP (I Downloaded my old web flow posts and added them to this site with one prompt 🤯), Cursor, and ultimately, Windsurf were the plethora of tools I tested to get this site operational. I ultimately stuck with Windsurf because of its Ease and cost.

Step 4 (iterate):

I ran a number of tests that I can update at a later point…

Step 5 (Deploy):

I deployed this site using GitHub Pages. Prior to this experience, the terminal and Github were like buggy men to me. Why am I looking at files? I thought this was an app. After being walked through what I was doing, the comfort of understanding had me excited rather than terrified to start pushing to Github, which ultimately led us here. I used to pay $30/month to Web Flow; now, I push and host a similar website for free.

Summary

The beauty of Vibe-coding, Vibe-Marketing, vibe-car-mechanic-ing? (Is that a word? Let’s make it one) is the barrier to entry they remove from learning. As a result of this project, I have a much more well-rounded understanding of web design, as a result of understanding through doing and having an always-on coach enabled me to do so.

Now, back to the drawing board on the initial app!