What this project is

Aqua Skin & Body Studio is a local med spa offering skincare treatments, body contouring, and wellness services. They had no website — just an Instagram page and a Vagaro booking profile. The owner reached out wanting something professional that could actually convert foot traffic into online bookings.

This was my first real client project with a full production deployment, a live domain, and someone's actual business on the line. That changes things. When it's your own side project and something breaks, you fix it whenever. When it's a client's booking page going down at 7pm on a Friday, that's a different conversation.

How I built it

The site is a React single-page app — not because the project strictly needed it, but because the client wanted room to grow. If they ever add a blog, a shop, or more pages, the architecture is already there.

The home page has a hero section with their brand photography, a services breakdown, client testimonials, and an embedded booking widget. That last part — the booking widget — is where Vagaro comes in.

Vagaro integration was actually smoother than expected. They provide a JavaScript embed snippet that drops a booking button or inline widget anywhere on the page. I customized it to match the site's color palette and tied it into the CTA sections throughout the page. The whole thing is client-managed — she can update her services, availability, and pricing on the Vagaro dashboard without touching any code.

Deployment is on Vercel with automatic deploys from the main GitHub branch. The domain lives on GoDaddy — I added Vercel's nameservers in the GoDaddy DNS settings, which redirects everything to Vercel's edge network. Full HTTPS out of the box, global CDN, zero server maintenance.

DNS tip: GoDaddy's nameserver propagation can take up to 48 hours, but in practice it usually hits within 2–4 hours. Set it up the night before you want to launch, not the morning of.

I used Vercel's environment variables for anything sensitive (API keys for a contact form) and kept the Vagaro embed ID out of the repo. Small thing, but the right habit to build early.

What's under the hood

React
Frontend framework
Vercel
Hosting & CI/CD
GoDaddy
Domain & DNS
Vagaro
Booking integration
Formspree
Contact form backend

What I'd do differently

Client work is 50% code and 50% communication. I underestimated how much time I'd spend clarifying scope — "does the gallery section need filtering?" "Should mobile nav have a phone number in it?" These questions seem small but they add up fast if you don't establish them upfront.

What worked: React for this size of project was probably overkill, but future-proofing the client was worth it. Vercel's DX is genuinely excellent for this type of deployment — preview URLs for every PR meant the client could see changes before anything went live.

What I'd change: I'd set up a more structured feedback process from the start. I had 3 rounds of "can we move this button?" type revisions because I hadn't locked in a design approval step early. Standard contract stuff, but you learn it by doing.

The Vagaro embed works great, but it does load some third-party JS that slightly impacts Lighthouse scores. For a service business booking site, conversion matters more than a perfect 100, so it's a reasonable trade — but something to be aware of if a client is score-conscious.

Back to All Posts
Next Post Cybersecurity Home Lab