-
one of the 5 examples - a personal portfolio.
-
The home page where people can request a custom website
I## Inspiration
I'm a freelance web developer just starting out, and one of the biggest hurdles I've faced is showing potential clients what I can actually build before they trust me with their project. I wanted to create a site that doubles as both a portfolio and a live pitch — instead of just telling people I can build custom websites, I show them, right there on the page.
What it does
Craft & Code is a personal website-building service page where visitors can browse five real, fully working example projects — a task-based focus timer, an animated anniversary page, a password-locked birthday surprise, a developer portfolio, and a decorated daily journal — then request their own custom site. Each example represents a different kind of client I could build for: businesses, individuals, or personal gifts.
How I built it
I used plain HTML, CSS, and JavaScript across every page — no frameworks or build tools. The main page uses a warm cream, sage green, and coral color palette to feel calm and trustworthy, while each example project has its own distinct visual identity to show range. Every example is fully interactive: the focus timer actually counts down, the birthday page has a real password gate and mini-games, and the journal has working calendar navigation and mood tracking.
Challenges I ran into
Bringing five very different projects together into one cohesive site was the biggest challenge — each example needed its own logic and styling while still feeling like it belonged to the same "Craft & Code" brand. I also worked on making sure every example was a real, working demo rather than a static mockup, since that's the whole point of proving I can actually build things, not just design them.
