BookIt: Experience & Slots

A full-stack slot booking web app where users can explore travel experiences, select available slots, and complete bookings. All with REST API integration.

---

Demo

Screenshots

More Screenshots

Tech Stack

Component	Technology
Frontend	React (Vite)
Backend	Node.js + Express
Database	MongoDB
API Architecture	REST

---

📂 Project Structure

BookIt/
├─ backend/
│  ├─ src/
│  │  ├─ controllers/
│  │  │  ├─ bookingController.js
│  │  │  ├─ experienceController.js
│  │  │  └─ promoController.js
│  │  ├─ models/
│  │  │  ├─ Booking.js
│  │  │  └─ Experience.js
│  │  ├─ routes/
│  │  │  ├─ bookingRoutes.js
│  │  │  ├─ experienceRoutes.js
│  │  │  └─ promoRoutes.js
│  │  └─ server.js
│  └─ package.json
└─ frontend/
  ├─ src/
  │  ├─ components/
  │  │  ├─ ExperienceCard.tsx
  │  │  ├─ Header.tsx
  │  │  └─ SearchBar.tsx
  │  ├─ hooks/
  │  │  ├─ use-mobile.tsx
  │  ├─ lib/
  │  │  ├─ api.ts
  │  ├─ pages/
  │  │  ├─ Checkout.tsx
  │  │  ├─ Confirmation.tsx
  │  │  ├─ ExperienceDetails.tsx
  │  │  ├─ Home.tsx
  │  ├─ App.tsx
  ├─ index.html
  ├─ package.json
  ├─ README.md
  ├─ tsconfig.json
  └─ vite.config.ts

---

Backend APIs

Method	Endpoint	Description
GET	/api/experiences	Return list of experiences.
GET	/api/experiences/:id	- Return details and slot availability
POST	/api/bookings	Remove item from cart.
POST	/api/promo/validate	Validates promo codes.

---

🛠️ Setup Instructions

1 Clone Repository

git clone https://github.com/Dheeraj-Chintala/BookIt.git
cd BookIt

2 Backend Setup

cd backend
#create .env file with MONGO_URI="Your_mongo_string" and PORT=number  
npm install
npm start

3 Frontend Setup

# in new terminal
cd  BookIt/frontend
#create a .env file with VITE_API_BASE=http://localhost:5000/api 
npm install
npm run dev

Credits

Built by Dheeraj Chintala