02Product

Dental Clinic Booking Platform

A booking platform for a fictional dental clinic. Patients pick a time and pay a deposit, and the database makes sure no slot is ever sold twice.

Client: Own project (fictional clinic)
My role: Design, development and payments
Timeline: [Start month] – [End month]
Stack: Stripe
Live site: [Demo URL]

Dental clinic homepage with the headline “Book the dentist without the phone call.”, a 20% deposit badge and a next free time card

At a glance

10 minSlot hold while paying

At a glance

20%Deposit, set server-side

At a glance

252Unit tests

02Before

The problem

Booking is easy to build. Booking that can't go wrong is not.

A clinic loses money when two patients get the same slot, when a booking is confirmed without payment, or when a reminder shows the wrong hour after a clock change.

[One sentence in your own words on why you chose a dental clinic.]

This project covers the part most booking demos skip: making those three mistakes impossible, not just unlikely.

03Build

The solution

One flow for patients.
One database that says no.

Patients choose a service, a clinician and a time, then pay a deposit through Stripe. A slot is held for 10 minutes while they pay. The clinic team runs everything from an admin dashboard with role-based access.

01
BookPick a service, clinician and time. Slots come from the same range the database enforces, so what you see is bookable.
02
PayA 20% deposit goes through Stripe Checkout in test mode. Only the signature-verified webhook confirms the booking, never the redirect.
03
ManageAdmins and staff see the week calendar, bookings, customers, services and working hours. A read-only demo login is available.

04Screens

Project screens

Booking step 1: four treatment cards with duration and price, and a note on how the 20% deposit works — FIG. 02Step 1. Choose a treatment. The deposit rule is explained before anything else.

Booking step 2: choose Any available or a specific dentist, with a live booking summary and the deposit due — FIG. 03Step 2. Only clinicians who offer the chosen service are shown.

Booking step 3: a six-day date strip with availability bars and time slots, with a note about the visitor's and the clinic's time zones — FIG. 04Step 3. Times are shown in the visitor's time zone, with the clinic's zone noted above.

Booking step 4: contact details form with an agreement to the cancellation policy — FIG. 05Step 4. Contact details only. No health information is collected.

Booking step 5: review and pay, with a 10-minute hold timer, the cancellation policy and a Pay $18 deposit button — FIG. 06Step 5. The slot is held for 10 minutes while the visitor pays the 20% deposit.

Stripe Checkout page for the deposit in test mode — FIG. 07Deposit payment. Stripe Checkout in test mode, with no real charges.

Confirmation page showing the booking reference, time, service, clinician and the $18 deposit paid — FIG. 08Confirmation. The booking is confirmed once the deposit is received, with a reference and the cancellation terms.

05After

The outcome

Finished for demo scope, and tested hard.

The platform is built end to end and runs in Stripe test mode, and the demo says so. In live checks, a $90 check-up produced an $18 deposit and a confirmed booking, and an abandoned checkout gave its slot back after exactly 10 minutes.

Overlapping bookings rejected by the database, not just app code

Bookings confirmed only by the verified Stripe webhook

Times correct across daylight saving changes (tested)

Admin, staff and read-only demo roles enforced by row-level security

Cancellation built and tested; not yet run live because email is off

Dental Clinic Booking Platform

The problem

The solution

Project screens

The outcome

Want results like this?