How to Use the Appointment Booking System

This page explains how to use the demo appointment booking system. It demonstrates a modern scheduling workflow built with Next.js, Firebase, and Tailwind CSS.

📅 Booking an Appointment

1️⃣

Open the booking page

Navigate to the homepage to start the appointment process.

2️⃣

Enter your information

Fill in your name, email address, and phone number.

3️⃣

Select a service

Choose from available appointment types such as consultation, check-up, or therapy session.

4️⃣

Pick a date and time

Available time slots update automatically based on existing bookings.

5️⃣

Confirm your appointment

Click Book Appointment to complete the booking.

🛡️ Admin Panel

1️⃣

Access the admin dashboard

Go to /admin to view and manage appointments.

2️⃣

Review bookings

See customer information and appointment details.

3️⃣

Cancel appointments

Admins can cancel bookings to free up time slots.

✨ Features Demonstrated

  • Real-time time slot availability
  • Responsive booking interface
  • Admin appointment management
  • Email confirmation workflow
  • Scalable backend architecture

⚠ Demo Environment

This is a demonstration version of the appointment system. Some functionality may be simulated and data may reset periodically. In production, the system uses Firebase for persistent data storage and EmailJS for automated confirmation emails.

🚀 Technology Stack

Next.js

React framework

React

UI library

Tailwind CSS

Styling

Firebase

Database & backend

EmailJS

Email confirmations

SMS / OTP

Authentication support