🏕️ LetsCamp

Discover. Book. Camp.

A full-stack campground booking platform built for India's outdoor explorers.
Find stunning campgrounds, book your spot, and manage everything — all in one place.

• React 18 + React Router v6
• Tailwind CSS — custom design system with forest color palette
• Mapbox GL JS — interactive cluster maps + campground location maps
• Lucide React — consistent icon system (zero emojis in UI)
• Axios — API communication with credential support
• Razorpay JS SDK — seamless payment popup

• Node.js + Express — RESTful API
• MongoDB + Mongoose — database with Atlas cloud hosting
• Passport.js — session-based authentication (local strategy)
• Multer + Cloudinary — image upload and storage
• Razorpay Node SDK — order creation and signature verification
• Helmet + Mongo Sanitize — security middleware

• Groq (llama-3.3-70b-versatile) — CampBot chatbot + AI description generator
• Mapbox Geocoding API — convert location strings to coordinates

• Vercel — frontend hosting with CI/CD
• Render — backend hosting with auto-deploy
• MongoDB Atlas — cloud database
• Cloudinary — image CDN

Tourist  →  Browse, book, review, favorite campgrounds
Owner    →  Pay ₹999/year subscription → List campgrounds → View bookings
Admin    →  Approve/reject listings, manage users, view all bookings & revenue

Set your user's role field to "admin" in MongoDB Atlas. The Admin link appears in the navbar automatically.

• Node.js 18+
• MongoDB Atlas account
• Cloudinary account
• Mapbox account
• Razorpay test account
• Groq API key

git clone https://github.com/batman-rises/YELPCAMP.git
cd YELPCAMP

# Install dependencies
npm install

# Create .env file
cp .env.example .env
# Fill in your keys (see Environment Variables section below)

# Start backend
node app.js

cd frontend
npm install

# Create .env file — for local dev, DO NOT set VITE_API_URL
# Vite proxy handles routing automatically
echo "VITE_RAZORPAY_KEY_ID=rzp_test_your_key" > .env
echo "VITE_MAPBOX_TOKEN=your_mapbox_token" >> .env

# Start frontend
npm run dev

# From YELPCAMP root
cd seeds
node seedIndia.js

This seeds 20 Indian campgrounds across Himachal, Uttarakhand, Kerala, Ladakh, and more.

DB_URL=mongodb+srv://...
SECRET=your_session_secret

CLOUDINARY_CLOUD_NAME=your_cloud_name
CLOUDINARY_KEY=your_key
CLOUDINARY_SECRET=your_secret

MAPBOX_TOKEN=pk.eyJ1...

RAZORPAY_KEY_ID=rzp_test_...
RAZORPAY_KEY_SECRET=your_secret

GROQ_API_KEY=gsk_...

CLIENT_URL=https://your-vercel-app.vercel.app
NODE_ENV=production

VITE_API_URL=https://your-render-backend.onrender.com/api
VITE_RAZORPAY_KEY_ID=rzp_test_...
VITE_MAPBOX_TOKEN=pk.eyJ1...

Note: For local development, do not set VITE_API_URL — Vite's proxy handles /api routing automatically.

Tourist selects dates
       ↓
POST /api/payment/create-order  →  Razorpay order created (₹1)
       ↓
Razorpay popup opens  →  Tourist pays
       ↓
POST /api/payment/verify  →  Signature verified  →  Booking confirmed
       ↓
Dates blocked on campground  →  Visible in My Bookings

20 hand-picked Indian campgrounds including:

• Valley of Flowers Base Camp, Uttarakhand
• Spiti River Camp, Himachal Pradesh
• Rann of Kutch Desert Camp, Gujarat
• Nubra Valley Dune Camp, Ladakh
• Andaman Beach Camp, Havelock Island
• Pench Tiger Reserve Camp, Madhya Pradesh
• Munnar Tea Estate Camp, Kerala
• Darjeeling Tea Garden Camp, West Bengal
• Rishikesh White Water Camp, Uttarakhand
• Hampi Riverside Camp, Karnataka
• ...and 10 more across India

• Helmet.js for HTTP headers
• Express Mongo Sanitize against NoSQL injection
• Session-based auth with MongoStore
• Razorpay HMAC signature verification
• CORS restricted to known origins
• Cloudinary for safe image hosting

YELPCAMP/
├── app.js                  # Express app entry point
├── middleware.js           # Auth & role middleware
├── models/
│   ├── user.js             # User + subscription schema
│   ├── campground.js       # Campground + bookedDates schema
│   ├── booking.js          # Booking schema
│   └── review.js
├── routes/
│   ├── campgrounds.js
│   ├── payment.js          # Tourist booking + Razorpay
│   ├── owner.js            # Owner dashboard + subscription
│   ├── admin.js            # Admin management
│   ├── favorites.js
│   ├── reviews.js
│   └── ai.js               # Groq AI endpoints
├── controllers/
│   └── campgrounds.js
├── seeds/
│   └── seedIndia.js        # 20 Indian campgrounds
└── frontend/
    └── src/
        ├── pages/
        │   ├── HomePage.jsx
        │   ├── CampgroundsIndex.jsx
        │   ├── CampgroundShow.jsx
        │   ├── MyBookingsPage.jsx
        │   ├── OwnerDashboard.jsx
        │   └── AdminDashboard.jsx
        ├── components/
        │   ├── layout/      # Navbar, Footer, Layout
        │   ├── maps/        # ClusterMap, ShowMap
        │   ├── ui/          # CampBot, Skeleton, StarRating
        │   └── campgrounds/ # CampgroundForm
        └── context/
            ├── AuthContext.jsx
            └── ToastContext.jsx

• Email notifications on booking confirmation
• Campground availability calendar view
• Owner analytics dashboard with charts
• Social login (Google OAuth)
• Multiple campground image galleries
• Campground ratings on map popups
• PWA support for offline browsing

Binayak Panda

This project is for educational and portfolio purposes.