Skip to content
Want a website like this?
Rapi Barbershop Website

Demo Website

Rapi Barbershop Website

One-page site for a neighborhood barbershop: service price list, opening hours, and WhatsApp booking.

Open Live Preview

Industry

Personal Care & Grooming Services

Timeline

1 week

Package Used

A website with clear structure and navigation, for a small business going online for the first time

This is a demo website I built on my own as a sample, not paid client work. The business name is illustrative. The live preview above is the real build.

01

About This Website

One-page site for a neighborhood barbershop: service price list, opening hours, and WhatsApp booking.

02

Notes Behind This Demo

Rapi Barbershop is a barbershop I invented for this demo. The customer I pictured usually walks in without an appointment and opens the page to check prices and find a time that is not too busy.

Three design decisions

  1. There is a busy-hours table for weekdays and weekends, marking each time block as quiet, fairly busy, or busy. Walk-in customers can pick their own time, and the table rarely needs changing.
  2. I described booking as what it is here: a heads-up on WhatsApp before coming in. The process section has only three steps: send a chat, sit down, then pay at the counter when done. I kept the promises to what a small shop with no scheduling system can actually keep.
  3. Prices sit in three cards, and the Paket Hemat (value bundle) card gets a heavier border and a note that it saves Rp 20,000 against buying each service separately. I worked that figure out from the prices on the other cards, so visitors can check it themselves.

Starter is enough for content like this as long as there is only one shop. If the gallery of cuts should show more photos at a larger size, Business (Rp 5.000.000) stores them on Cloudflare Storage and a CDN so the page stays light. Per-barber schedules bookable by the hour need a database, which makes them an Enterprise feature.

03

What It Includes

  • One-page layout: Home, About, Price List, Contact
  • Price-board styled service list
  • WhatsApp booking button in the header and hero
  • Mobile-first responsive design
  • Basic on-page SEO

04

Built With

  • React
  • TypeScript
  • Tailwind CSS
  • WhatsApp Integration

Project Gallery

Rapi Barbershop Website - Screenshot 1
Rapi Barbershop Website - Screenshot 2

Interested in Similar Project?

We can build a similar site for your business, on the same technology and features.

This project uses:

A website with clear structure and navigation, for a small business going online for the first time

Pricing and packages for a barbershop website →

*Contact us for further consultation about your project