https://github.com/protik111/studio-booking

A simple studio booking app with searching functionalities.
https://github.com/protik111/studio-booking

Last synced: 3 months ago
JSON representation

A simple studio booking app with searching functionalities.

• Host: GitHub
• URL: https://github.com/protik111/studio-booking
• Owner: Protik111
• Created: 2025-03-01T16:30:23.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2025-03-01T17:33:12.000Z (over 1 year ago)
• Last Synced: 2025-03-01T17:36:01.430Z (over 1 year ago)
• Language: TypeScript
• Size: 119 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Studio Booking Application

![React](https://img.shields.io/badge/React-20232A?style=for-the-badge&logo=react&logoColor=61DAFB) ![Ant Design](https://img.shields.io/badge/Ant%20Design-%230170FE.svg?style=for-the-badge&logo=ant-design&logoColor=white) ![TypeScript](https://img.shields.io/badge/TypeScript-%23007ACC.svg?style=for-the-badge&logo=typescript&logoColor=white)

The **Studio Booking Application** is a dynamic, user-friendly front-end application designed to allow users to search for studios, check their availability, and book time slots. Built using modern front-end development practices, this application leverages React, Ant Design, and JSON data to provide a seamless booking experience.

---

## Table of Contents

- [Features](#features)

- [Technologies Used](#technologies-used)

- [Project Structure](#project-structure)

- [Setup Instructions](#setup-instructions)

- [Usage](#usage)

- [Contributing](#contributing)

- [License](#license)

---

## Features

The Studio Booking Application includes the following key features:

1. **Studio Search**:

   - Users can search for studios by name or location.

   - Auto-complete suggestions for locations are provided.

2. **Filter by Proximity**:

   - Users can filter studios within a 10km radius based on their current geolocation.

3. **Availability Checking**:

   - View available time slots for a selected studio on a specific date.

   - Real-time updates on booked slots.

4. **Booking Functionality**:

   - Users can book available time slots by providing their name and email.

   - Bookings are stored locally and displayed in a detailed format.

5. **Responsive Design**:

   - The application is fully responsive and works seamlessly across devices.

---

## Technologies Used

- **Frontend Framework**: React (Functional Components, Hooks)

- **UI Library**: Ant Design

- **State Management**: React `useState` and `useEffect`

- **Geolocation**: `react-geolocated` and `geolib`

- **Date & Time Handling**: `dayjs`

- **Data Source**: Static JSON file (`staticData.json`)

- **Styling**: Inline CSS and Ant Design components

- **Build Tool**: Vite