Appointment Booking System

The Appointment Booking System is a web-based application developed using Next.js, React, TypeScript, MongoDB, Prisma, and Tailwind CSS. It allows users to create an account, login, create their own business services, and book appointments with those services. The system provides features such as listing upcoming appointments, managing reservations, displaying business services, and implementing search and filter functionality. The application is also responsive, ensuring a seamless experience across different devices.

Demo

https://bookablebiz.vercel.app/

Project Intro video

https://youtu.be/GOsriDFR_vY

Features

The Appointment Booking System provides the following key features:

1. User Registration and Login:

   • Users can create an account by providing their details.
   • Existing users can log in using their credentials.

2. Business Creation:

   • Logged-in users can add their own services.
   • The system updates the service listings displayed on the home page.

3. Appointment Booking:

   • Users can visit any service and can select a preferred date and time to book an appointment.
   • Users can book appointments with their desired services.

4. User Dashboard:

   • Upcoming : Users can view their upcoming appointments and cancel appointmens.
   • Your Reservations: Users can see the list of upcoming appointments for their business and business owner can cancel appointment with customer.
   • Your Business: Users can view and manage the services offered by their business.

5. Search and Filter Functionality:

   • Users can search for specific services using location.
   • Users can filter the list based on categories.

6. Responsive Design:

   • The application is designed to be responsive, providing an optimal user experience across different devices and screen sizes.

Installation and Setup

To install and set up the Appointment Booking System, follow these steps:

• Clone the project repository from the GitHub repository.
• Make sure you have Node.js and npm (Node Package Manager) installed on your system.
• Open a terminal or command prompt and navigate to the project's root directory.
• Run the command npm install to install the project dependencies.
• Set up the MongoDB database and connection URL.
• Configure the Prisma ORM to connect to the MongoDB database.
• Run the command npm run dev to start the development server.

Tech Stack

• Next.js13: A React framework for building server-side rendered and statically generated web applications.
• React: A JavaScript library for building user interfaces.
• TypeScript: A statically typed superset of JavaScript that enhances code quality and maintainability.
• MongoDB: A NoSQL database used to store application data.
• Prisma: An Object-Relational Mapping (ORM) tool that simplifies database access and management.
• Tailwind CSS: A utility-first CSS framework that provides pre-defined styling classes and components.