FitBit - A Fitness Trainer Appointment Scheduling Website (React + Tailwind)

FitBit is a web application designed to help fitness trainers efficiently manage appointments for their clients. The platform offers a user-friendly interface for adding, editing, and deleting client details and appointments. The addition of features such as calendar view enhances the overall experience for fitness trainers.

Tech Stack

• React
• Tailwind CSS
• Material UI
• Lucide
• Headless UI

Live Site

To seamlessly manage Fitness Appointments, visit the live site on FitBit

Getting Started

To setup the project locally in your system, follow these steps:

1. Clone the repository: git clone https://github.com/veerprakash28/fitbit-app.git
2. Navigate to the project directory: cd fitbit-app
3. Install dependencies: npm install
4. Start the development server: npm run dev
5. Open your web browser and go to http://localhost:5173 to see the project running.

Feel free to explore the code, make improvements, and share your ideas to help make the FitBit experience even better!

Features

1. Client and Appointment Management

• Add New Clients: Seamlessly add new clients by providing their first name, last name, location, and appointment details.
• Edit Appointments: Modify appointment details, including the client's name, location, and appointment times.

2. Appointment Actions

• Delete Appointments: Easily delete appointments to keep the schedule up-to-date.
• Delete User: Remove clients from the system, including all associated appointments.

3. Enhanced Appointment Handling

• Multiple Appointments: Add multiple appointments for a single client to accommodate various sessions.

4. Calendar View

• Calendar Page: View appointments in a calendar format to get an overview of scheduled sessions.

5. User-friendly Notifications

• Toast Notifications: Receive notifications for successful actions, providing a seamless user experience.

How the website works?

1. Dashboard

• Dashboard: Add New Clients and Start Managing their Appointments

• Add New Client: Add New Client with Field Validations

• Date Time Picker: Date Time Picker for Adding Appointments Date and Time

• Multiple Appointments: Functionality to Add Multiple Appointments with Delete option

• Toast Notifications: Notifications for Every Actions (Add, Delete, Edit, etc)

• Confirmation Modal: Confirmation Modal to prevent Accidental Delete

• Edit Details and Manage Appointments: Funcionality to edit User Details and Appointments

• Delete User: You can also Delete User from the directory if you want

2. Calendar View

• Calendar View: Section to view Appointments as per the date

• Search Functionality: You can search for appointments seamless and get the details of the user

3. Project Details

• Project Links: View Repository and Project Links