Context

• I approached this experiment as a non-technical user wanting to create a personal website (this website!)
• I have some basic web development experience, but it's been a while since I've done frontend work.
• I started with Claude web (paid version) before transitioning to Claude's desktop app with Model Context Protocol (MCP) servers enabled.
• I used the filesystem MCP server for file management i.e. the AI was allowed to read and write directly to the files in my computer.
• When referring to "AI" in this article, I'm primarily discussing Claude 3.7 with thinking mode enabled.

Pros

• The AI created a professional looking website that exceeded all expectations in significantly less time than I could have done manually. In fact, I don't think I would be able to build a website of this quality.
• Design isn't my strong suit, so it was particularly helpful when it came to creating the initial layout of the website.
• Leveraging AI allows me to focus on the final product rather than getting bogged down by the technical details.
• The AI can usually self-correct when I point out mistakes but, occasionally I had to start over in a new chat to remove any existing biases.
• The AI was also instructed to prompt me for my opinions when there were unconsidered design factors.
• MCP integration dramatically improved my productivity since the AI can now read and write directly to the files in my computer. This also eliminated the need to "pretrain" the model as I always start every chat with "look through all the files in the repository and tell me what you understand about the codebase."
• The experience of watching AI handle everything while I supervise is such a magical feeling and it never ceases to amaze me how far we've progressed with AI.

Cons

• When using AI through some web interface (e.g. Claude web, Google AI Studio), I had to upload some files to build context but as a non-technical user, I may not know which files are important for the task at hand.
• The goal of the AI is to complete the task but without sufficient information, the AI might make assumptions that can break existing code.
• Technical terminology can be overwhelming for non-developers, which may require additional clarification. This contributes to hitting the limits earlier.
• Knowledge cutoff limitations mean the AI may struggle with newer technologies. For example, I experienced issues with a newer version of Node.js as the AI was not familiar with the updated syntax.
• Subscription limits on questions can also interrupt the workflow but this doesn't apply to API users since they use a pay-as-you-go pricing.
• Unless stated explicitly in the prompt, security may not be a primary concern for the AI. For example, it once suggested exposing my API keys publicly, which could have been problematic.
• Complex features with many interdependent parts are challenging for AI to implement without bugs, and it may get stuck in circular reasoning or start hallucinating.

Takeaway

• Context is crucial - the more relevant knowledge the AI has, the better it performs.
• However, too long a context can also degrade the performance of the AI, so you need to strike a balance.
• As long as the scope of the website is small, most modern LLMs (with reasoning enabled) can create a professional looking website with a single prompt.
• For complex projects involving multiple systems (e.g., frontend connecting to a database), you can ask the AI to help you to break the task down into smaller problems before iteratively solving them.
• To expedite the pretraining phase, you can ask the AI in the previous conversation to summarize the chat so that you can "transfer" some context into the new chat.
• If you realize that the AI is going in circles, tell the AI to brainstorm multiple solutions, reflect on each solution and decide on the best approach and explain its reasoning.
• Regularly ask the AI to share its understanding of your requirements and assumptions.
• Instead of blindly copying and pasting the code generated from AI, review their proposals carefully because sometimes the solutions may be overly complex.
• Detailed prompts can help the AI to clarify assumptions. You can also consider ending the prompt by inviting the AI to ask questions.
• To aid with debugging, ask the AI for a step-by-step reasoning to identify any problematic assumptions.

I hope sharing my experience helps you in your own journey of building websites with AI. This field is evolving rapidly, and I'm continuously learning alongside you. If you've tried creating a website using AI or have questions about my process, I'd love to hear about your experience in the comments below or via X.