ai website generator
talk to it and watch a webpage build itself, one instruction at a time.
python · flask · langchain · openai gpt-4o-mini · docker · defang
a 2024 hackathon build, kept as a snapshot.
A hackathon project that lets you build a webpage by talking to it. You describe a change in plain language, or say it out loud, and an LLM rewrites the live page to match, one instruction at a time. It placed runner-up, but the reason I keep it here has more to do with the weekend than the code.
why i built it
The hackathon's whole category was AI, build something that used it in some way, so with a team of four we landed on this, a webpage you could conjure and edit just by describing what you wanted. We called it Web JARVIS. It was a fun, self-contained idea we could actually finish in a weekend.
how it works
Under the hood it's a Flask app wired to OpenAI's gpt-4o-mini through LangChain, and
the whole thing revolves around a single evolving HTML file. Every instruction you send
hits a /send-message endpoint that reads the current page, hands the model both that
HTML and your request, and asks it to return the full updated document with your change
applied, HTML, CSS, and JS only, no markdown fences, and an INVALID_REQUEST sentinel
if the ask doesn't make sense. The returned markup is written straight back to the
file, so the page literally rewrites itself a step at a time.
The frontend, which we called Web JARVIS, is a chat interface with both typed and voice
input (a mic button), a live preview iframe that reloads the current page, and a toggle
to flip between the rendered result and the raw generated code side by side. It's
packaged with Docker and deployed through Defang, so a single compose up takes it
from local to hosted.
the weekend
On the second day, one of our four left, and a tight deadline suddenly got a lot tighter. I ended up stepping into a leadership role to hold the team together, while still doing full-stack development across both the frontend and the website-generation backend itself. On top of that I took over the presentation, the slides, the script, and making sure the whole thing was actually ready in time.
It came together. We shipped on time and placed runner-up, and even though there was no prize attached to it, I was genuinely proud of how I performed that day. More than the project itself, that weekend is what pushed me to start seeking out leadership roles since.