Skip to content
Business systemsBooking system

Booking & Reservation Platform

An online booking system with live availability, staff calendars, deposits, automatic reminders by email and WhatsApp, and an admin view for bookings, no-shows and capacity.

Project facts

Project type
Booking system
Category
Business systems
Industry
Appointment-based services
Technology stack
  • Next.js
  • React
  • TypeScript
  • PostgreSQL
  • Prisma
  • BullMQ
  • Stripe
  • WhatsApp Business API
Staff week calendar with colour-coded consultations, treatments, group sessions and online calls, plus staff utilisation

Overview

This demonstration project shows a booking platform for an appointment-based business — a studio offering consultations, treatments, group sessions and online calls. Customers book a service, pick a free slot and pay a deposit in about a minute; staff see their day in a shared calendar; the owner sees occupancy, no-shows and deposits.

The same structure fits clinics, salons, workshops, rental and tutoring businesses: the rules for services, durations, staff and capacity are configuration, not code.

The challenge

Bookings by phone, Instagram and WhatsApp end up in a paper diary or several calendars. Double bookings happen, customers cannot see availability outside opening hours, and no-shows cost money because nothing reminds people and nothing is paid upfront. Generic booking widgets rarely handle group capacity, multiple staff or the business's own cancellation rules.

The solution

The concept makes availability the single source of truth. Opening hours, staff schedules, service durations, buffers and group capacity are combined into bookable slots, and a slot is locked the moment someone starts booking. Customers can pay a deposit, reschedule or cancel within the rules, and receive confirmations and reminders automatically. Staff work from a week calendar; the admin manages services, customers, reminders and payments.

Key features

  • Online booking page with live availability per service and staff
  • Week, day and month calendar for staff and owners
  • Group sessions with seat capacity and waitlist
  • Deposits and online payment at booking
  • Automatic confirmations and reminders by email and WhatsApp
  • Rescheduling and cancellation within the business's rules
  • No-show tracking and occupancy reports
  • Customer records with booking history

Who it is for

  • Clinics, salons and studios working by appointment
  • Businesses losing money to no-shows
  • Teams juggling bookings across phone, social media and paper
  • Companies renting rooms, equipment or time slots

Technical approach

Next.js serves the public booking page and the staff area. Availability is calculated on the server from schedules and existing bookings in PostgreSQL, with database constraints preventing double bookings even under simultaneous requests. BullMQ schedules reminders and review requests; deposits use the payment provider's hosted checkout with webhooks; calendar sync and WhatsApp messages run through their official APIs.

Database
Integrations
StripeMollieWhatsApp Business APIGoogle CalendarSMTP

Screens

Customer-facing interface

Customer booking page with a month calendar, available time slots and a booking summary with deposit
Customer booking page with a month calendar, available time slots and a booking summary with deposit

Admin interface

Admin bookings list with status, payment and staff, plus reminder rules and bookings per weekday
Admin bookings list with status, payment and staff, plus reminder rules and bookings per weekday

Mobile & responsive views

Three phone screens of the booking flow: choose a service, pick a time and booking confirmation
Three phone screens of the booking flow: choose a service, pick a time and booking confirmation

Services behind this project

The work in this case study maps onto these services. Each page explains scope, process and what you receive.

Related projects

All projects
  • Storefront product listing with category filters, price range and eight product cards
    Online storesEcommerce platform

    Advanced Ecommerce Platform

    A custom online store with product management, fast search, customer accounts, a multi-step checkout and a complete order dashboard — built on Next.js, TypeScript and PostgreSQL.

    • Next.js
    • React
    • TypeScript
    • PostgreSQL
    • Prisma
    • +4
  • SaaS workspace dashboard with project counts, activity chart, project progress table and plan usage
    SaaS platformsSaaS platform

    SaaS Management Platform

    A multi-tenant SaaS foundation with workspaces, members and roles, subscription billing, usage limits, an audit log and an operator console for the team that runs the product.

    • Next.js
    • React
    • TypeScript
    • PostgreSQL
    • Prisma
    • +4
  • Garage workshop board with vehicles by stage from check-in to ready, each card showing licence plate, job and mechanic
    AutomotiveGarage management software

    Garage Management System

    Workshop software for car repair garages: a live workshop board, repair orders with parts and labour, vehicle history, online appointments, WhatsApp updates to customers and invoicing.

    • Next.js
    • React
    • TypeScript
    • PostgreSQL
    • Prisma
    • +3

Questions about this type of project

Is this booking system used by a real business?

No. It is a demonstration project with sample services, staff and bookings. It shows how Saad builds a custom booking and reservation platform.

How are double bookings prevented?

Availability is calculated on the server and each booking is protected by a database constraint, so two people cannot take the same slot — even if they click at the same moment.

Can reminders be sent by WhatsApp?

Yes, through the WhatsApp Business API using approved message templates, alongside email or SMS. Timings — for example 24 hours before — are set by the business.

Want a similar project?

Tell Saad what you need. You get a clear scope, a phased plan and direct contact with the developer who builds it — no middlemen.

  • Direct, clear communication

    You talk directly to the engineer writing the code — no sales intermediaries, no vague delivery dates.

  • Fully custom solutions

    No ready-made WordPress themes or copied code — every line is written to fit your business's exact requirements and scale.

  • From idea to launch

    Help shaping the specification and turning a rough concept into a real, usable digital product.

The request form opens with this type of project already selected.