CrownCode AI: Shipping a Claude-Powered Website Generator
CrownCode started with a question I kept coming back to.
What is the real barrier for someone who needs a website but has no technical background? It is not budget. It is not even the tools. It is the blank page problem. Someone who runs a small business or a personal brand does not know what a good website looks like for their context. They do not know what to ask for. Every tool that exists assumes they already have an answer to that question.
CrownCode was built to remove that barrier entirely. Describe your business. Get a real, deployable website.
The Architecture
The technical foundation is straightforward: Claude API on the backend, routed through a Vercel serverless proxy, with a Next.js frontend. The proxy pattern is the same one I built for the portfolio assistant at portfolio.davishiggins.com. It keeps the API key off the client and gives me a clean interface to control request structure.
The interesting part is not the infrastructure. It is the prompt engineering.
Getting Claude to produce clean, deployable HTML and CSS instead of tutorial-quality code is a different problem than most people expect. The first version of my system prompt produced code that technically worked but looked like a generic template. Centered hero, blue button, three-column feature grid, stock photo placeholders. Exactly the kind of output that makes a small business look like it was built from a kit.
The shift came from specificity in constraints. Not "build a website for a coffee shop." Instead: "Build a single-page site for a specialty coffee shop in Charlotte, NC. Dark background. Matte cream typography. Menu section with four items in a two-column grid. No hero image. Use a full-width text headline instead. Contact section with just a phone number and address. No footer links." That level of specificity produces something that looks designed.
Aesthetic constraints matter as much as functional ones, and they need to be in the prompt, not left as assumptions. Claude also needs to know what it is not building. "No stock image placeholders" removes a whole category of unfinished output. "No purple gradients" eliminates the single most recognizable AI-generated aesthetic. Negative constraints are underused in AI product design.
Latency Was the Harder Problem
The Claude integration took about a day. Latency handling took three.
Generating a full website takes six to ten seconds depending on complexity. That is a long time to show someone a spinner. The solution is streaming. Read the response in chunks and render it incrementally so the user sees the site being built in real time instead of waiting for a complete response.
Implementing streaming correctly in a Next.js serverless function is not as simple as the documentation implies. There is a specific interaction between Vercel's response handling and the ReadableStream API that requires careful buffer management. I broke the output encoding twice before getting it right.
What I Would Change
The prompt engineering is still manual. Every constraint in the system prompt was written by hand based on observing bad outputs and adding corrective language. The better version of this is a structured constraint system where dropdowns and toggles inject specific prompt segments based on user input. That would make the output quality more consistent across different business types.
I would also add an edit layer. Right now, generation is one-shot. If someone wants to change the color scheme or restructure a section, they re-generate the whole thing. An edit interface that lets users make targeted changes through natural language is the feature that would turn CrownCode from impressive into actually indispensable.
The Main Lesson
AI does not remove the need for taste, structure, and review. It makes those things more important. CrownCode was not built by describing what I wanted and accepting the first output. It was built through iteration, constraint-setting, output review, and constant refinement of the instructions. Speed only works when direction is clear.
Related Project
View CrownCode AI