โ† Back to Projects

Barber Shop

Livebusiness

A polished local barber shop website with service listings, client testimonials, Google Maps embed, and smooth scroll navigation โ€” built to drive bookings for a local business.

๐ŸŒ Live Site๐Ÿ“ GitHub RepoBy Kyle Parsotan ยท 2024

Problem

Local barber shops rely on walk-ins and referrals. A well-designed website with clear service pricing, location info, and a booking call-to-action helps them compete with online booking platforms and attract new clients.

Solution

Designed a clean, single-page Next.js site with anchor-based smooth scroll navigation. Service cards display pricing and descriptions. Testimonials build social proof. Google Maps is embedded directly so clients can get directions in one tap. Resend handles email inquiries.

Tech Stack

Frontend
Next.jsTailwindCSSshadcn/ui
Backend
Resend (email)
DevOps
Vercel
Other
Google Maps Embed API

Architecture

Frontend

Next.js single-page site with section-based layout (Hero โ†’ Services โ†’ Testimonials โ†’ Gallery โ†’ Location โ†’ Contact). Smooth scroll navigation uses anchor links with CSS `scroll-behavior: smooth`. Service cards are mapped from a static data array. Google Maps is embedded via an `<iframe>` using the Maps Embed API. shadcn/ui supplies the contact form components.

Backend

Next.js API Route handles the contact form and sends an inquiry email via the Resend SDK. No persistent storage.

Database

None.

Features

Future Improvements

By Kyle Parsotan ยท 2024

Get to Work

Contact me for freelance work, full-time opportunities! I'm always open to discussing new projects, creative ideas, or opportunities to be part of your visions.