🏨 HOMYSTAY

Modern Full-Stack Hotel Booking Platform

A production-grade, full-stack MERN hotel reservation platform with role-based access control, real-time availability tracking, and integrated payment processing.

Live Demo · API Documentation · Report Bug · Request Feature

📸 Application Preview

🏠 Landing Page

🛏️ Room Listing & Filters

🔍 Room Details & Booking

🔐 Authentication

✨ Key Features

🏨 For Guests

🔍 Smart Search — Filter by city, dates, room type, price range
📅 Real-Time Availability — Conflict-free date-based booking
💳 Secure Payments — Razorpay integration with order verification
📄 PDF Invoices — Auto-generated booking confirmations
📱 Responsive UI — Seamless experience on all devices

🏢 For Hotel Owners & Admins

📊 Analytics Dashboard — Revenue, occupancy, and booking metrics
🛏️ Room Management — Full CRUD with multi-image uploads
👥 User Management — View registered users and booking history
✅ Booking Control — Approve, cancel, and manage reservations
🔒 Role-Based Access — Secure admin and owner workflows

🛡️ Role-Based Access Control

graph LR
    A[👤 Guest] -->|Browse & Book| B[🏨 Rooms]
    C[🏢 Hotel Owner] -->|Manage| B
    C -->|View| D[📊 Dashboard]
    E[👑 Admin] -->|Full Control| B
    E -->|Manage| F[👥 Users]
    E -->|Analytics| D
    
    style A fill:#4CAF50,color:#fff
    style C fill:#FF9800,color:#fff
    style E fill:#F44336,color:#fff

Role	Capabilities
Guest	Browse rooms, search & filter, check availability, book rooms, make payments, view booking history, download invoices
Hotel Owner	All guest features + add/edit/delete rooms, upload room images, view booking analytics, manage own listings
Administrator	Full platform control + user management, global analytics, booking management (approve/cancel/delete), system metrics

🏗️ System Architecture

Application Architecture

graph TB
    subgraph Client["🌐 Frontend (Vercel)"]
        React["⚛️ React 19 + Vite"]
        TW["🎨 Tailwind CSS + MUI"]
        Router["🔀 React Router v7"]
    end
    
    subgraph Server["⚙️ Backend (Render)"]
        Express["🚀 Express.js v5"]
        Auth["🔐 JWT Auth"]
        Multer["📁 Multer (Uploads)"]
    end
    
    subgraph Database["💾 Database (MongoDB Atlas)"]
        Users["👥 Users"]
        Rooms["🏨 Rooms"]
        Bookings["📋 Bookings"]
    end
    
    subgraph Payment["💳 Payment Gateway"]
        Razorpay["Razorpay API"]
    end
    
    React --> Express
    Express --> Auth
    Express --> Database
    Express --> Razorpay
    
    style Client fill:#1a1a2e,color:#fff
    style Server fill:#16213e,color:#fff
    style Database fill:#0f3460,color:#fff
    style Payment fill:#533483,color:#fff

Deployment Architecture

graph LR
    User((🧑‍💻 User)) <-->|HTTPS| Vercel["▲ Vercel<br/>React Frontend"]
    Vercel <-->|REST API| Render["🔧 Render<br/>Express Backend"]
    Render <-->|Mongoose| Atlas["🍃 MongoDB Atlas<br/>Cloud Database"]
    Render <-->|Payment API| Razorpay["💳 Razorpay<br/>Payment Gateway"]
    
    style Vercel fill:#000,color:#fff
    style Render fill:#46E3B7,color:#000
    style Atlas fill:#00ED64,color:#000
    style Razorpay fill:#3395FF,color:#fff

💻 Tech Stack

Layer	Technology	Version	Purpose
Frontend	React	19.1	UI Components & SPA
	Vite	6.3	Build Tool & Dev Server
	Tailwind CSS	4.1	Utility-First Styling
	Material UI	7.1	Admin Dashboard Components
	React Router	7.6	Client-Side Routing
	Axios	1.10	HTTP Client
Backend	Node.js	18+	Runtime Environment
	Express.js	5.1	REST API Framework
	Mongoose	8.16	MongoDB ODM
	Multer	2.0	File Upload Handling
Database	MongoDB Atlas	—	Cloud NoSQL Database
Payments	Razorpay	2.9	Payment Processing
DevOps	Vercel	—	Frontend Hosting & CDN
	Render	—	Backend Hosting
	GitHub Actions	—	CI/CD Pipeline

⚙️ Getting Started

Prerequisites

Node.js v18 or higher
MongoDB (local instance or Atlas cluster)
Git
Razorpay test/live API keys

Installation

# Clone the repository
git clone https://github.com/eldhoaby/HBApp.git
cd HBApp

Backend Setup:

cd backend
npm install

# Create environment file
cp ../.env.example .env
# Edit .env with your credentials (see Environment Variables section)

npm start        # Production
npm run test     # Development with nodemon

Frontend Setup:

cd frontend
npm install

# Create environment file
echo "VITE_API_BASE_URL=http://localhost:3000" > .env
echo "VITE_RAZORPAY_KEY_ID=your_razorpay_key" >> .env

npm run dev      # Development
npm run build    # Production build

Environment Variables

📋 Backend Variables (click to expand)

Variable	Description	Example
`PORT`	Server port	`3000`
`MONGODB_URI`	MongoDB connection string	`mongodb+srv://user:pass@cluster.mongodb.net`
`ADMIN_EMAIL`	Admin login email	`admin@example.com`
`ADMIN_PASSWORD`	Admin login password	`securepassword`
`RAZORPAY_KEY_ID`	Razorpay API Key	`rzp_test_xxxxx`
`RAZORPAY_KEY_SECRET`	Razorpay Secret	`your_secret`
`FRONTEND_URL`	Allowed CORS origin	`http://localhost:5173`

📋 Frontend Variables (click to expand)

Variable	Description	Example
`VITE_API_BASE_URL`	Backend API URL	`http://localhost:3000`
`VITE_RAZORPAY_KEY_ID`	Razorpay public key	`rzp_test_xxxxx`

📂 Project Structure

HBApp/
├── 📁 frontend/                # React + Vite Application
│   ├── 📁 public/              # Static assets & favicon
│   ├── 📁 src/
│   │   ├── 📁 assets/          # Images, icons, SVGs
│   │   ├── 📁 components/      # Reusable UI components
│   │   │   ├── 📁 hotelOwner/  # Admin dashboard components
│   │   │   ├── Hero.jsx        # Landing page hero
│   │   │   ├── Navbar.jsx      # Navigation bar
│   │   │   ├── Login.jsx       # Auth modal
│   │   │   └── Register.jsx    # Registration modal
│   │   ├── 📁 pages/           # Route-level pages
│   │   │   ├── Home.jsx        # Landing page
│   │   │   ├── AllRooms.jsx    # Room listing + filters
│   │   │   ├── RoomDetails.jsx # Room detail + booking
│   │   │   ├── Payment.jsx     # Payment processing
│   │   │   └── MyBookings.jsx  # User booking history
│   │   ├── App.jsx             # Root layout & routing
│   │   └── main.jsx            # React DOM entry
│   ├── vercel.json             # Vercel SPA rewrites
│   └── package.json
├── 📁 backend/                 # Express.js API Server
│   ├── 📁 configs/             # Database configuration
│   ├── 📁 models/              # Mongoose schemas
│   │   ├── user.js             # User model
│   │   ├── room.js             # Room model
│   │   └── booking.js          # Booking model
│   ├── 📁 routes/              # API route handlers
│   │   ├── auth.js             # Authentication routes
│   │   ├── rooms.js            # Room CRUD routes
│   │   ├── bookings.js         # Booking routes
│   │   ├── admin.js            # Admin routes
│   │   ├── payment.js          # Stripe payment routes
│   │   └── razorpay.js         # Razorpay payment routes
│   ├── server.js               # Express entry point
│   └── package.json
├── 📁 docs/                    # Technical documentation
├── 📁 screenshots/             # Application screenshots
├── 📁 .github/                 # CI/CD & GitHub templates
│   ├── 📁 workflows/
│   │   └── ci.yml              # GitHub Actions pipeline
│   ├── ISSUE_TEMPLATE.md
│   └── PULL_REQUEST_TEMPLATE.md
├── .env.example                # Environment template
├── .gitignore                  # Git exclusion rules
├── CHANGELOG.md                # Version history
├── CODE_OF_CONDUCT.md          # Community guidelines
├── CONTRIBUTING.md             # Contribution guide
├── LICENSE                     # MIT License
├── README.md                   # ← You are here
├── SECURITY.md                 # Security policy
└── render.yaml                 # Render deployment blueprint

📡 API Reference

Method	Endpoint	Description	Auth
`POST`	`/users/register`	Register a new user	Public
`POST`	`/users/login`	Authenticate user	Public
`GET`	`/rooms`	Fetch all rooms	Public
`GET`	`/rooms/:id`	Fetch room by ID	Public
`POST`	`/rooms`	Create a room	Owner
`PUT`	`/rooms/:id`	Update a room	Owner
`DELETE`	`/rooms/:id`	Delete a room	Owner
`POST`	`/rooms/check-availability`	Check room availability	Public
`POST`	`/bookings`	Create a booking	User
`GET`	`/bookings/user/:id`	Get user bookings	User
`PUT`	`/bookings/:id`	Update booking status	Admin
`DELETE`	`/bookings/:id`	Delete a booking	Admin
`POST`	`/admin/login`	Admin authentication	Admin
`GET`	`/admin/metrics`	Platform analytics	Admin
`POST`	`/razorpay/create-order`	Create payment order	User

📖 Full API documentation: docs/api.md

🚀 Deployment

The application is deployed on a modern cloud infrastructure:

Component	Platform	URL
Frontend	Vercel	hb-app-eldho.vercel.app
Backend	Render	homystay-backend.onrender.com
Database	MongoDB Atlas	Private cluster

📖 Full deployment guide: docs/deployment_setup.md

🗺️ Roadmap

🔑 OAuth2 (Google / GitHub) authentication
💬 Real-time chat (Socket.io) between guests & owners
🗺️ Mapbox integration for geographical hotel search
🌍 Multi-language (i18n) support
⚡ Redis caching for faster queries
📧 Email notifications (booking confirmations, reminders)
⭐ Guest review & rating system
📱 Progressive Web App (PWA) support

🤝 Contributing

Contributions make the open-source community thrive! See our Contributing Guidelines for details.

# Fork → Clone → Branch → Code → Push → PR
git checkout -b feature/amazing-feature
git commit -m "feat: add amazing feature"
git push origin feature/amazing-feature

📄 License

Distributed under the MIT License. See LICENSE for details.

🙏 Acknowledgments

React — UI Library
Express.js — Backend Framework
MongoDB Atlas — Cloud Database
Razorpay — Payment Gateway
Vercel — Frontend Hosting
Render — Backend Hosting
Tailwind CSS — Styling Framework

⭐ Star this repository if you found it helpful!

Made with ❤️ by Eldho

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Repository files navigation

🏨 HOMYSTAY

Modern Full-Stack Hotel Booking Platform

📸 Application Preview

🏠 Landing Page

🛏️ Room Listing & Filters

🔍 Room Details & Booking

🔐 Authentication

✨ Key Features

🏨 For Guests

🏢 For Hotel Owners & Admins

🛡️ Role-Based Access Control

🏗️ System Architecture

Application Architecture

Deployment Architecture

💻 Tech Stack

⚙️ Getting Started

Prerequisites

Installation

Environment Variables

📂 Project Structure

📡 API Reference

🚀 Deployment

🗺️ Roadmap

🤝 Contributing

📄 License

🙏 Acknowledgments

About

Uh oh!

Releases

Packages

Uh oh!

Contributors

Uh oh!

Languages

Name		Name	Last commit message	Last commit date
Latest commit History 71 Commits
.github		.github
backend		backend
docs		docs
frontend		frontend
screenshots		screenshots
.env.example		.env.example
.gitignore		.gitignore
CHANGELOG.md		CHANGELOG.md
CODE_OF_CONDUCT.md		CODE_OF_CONDUCT.md
CONTRIBUTING.md		CONTRIBUTING.md
LICENSE		LICENSE
README.md		README.md
SECURITY.md		SECURITY.md
render.yaml		render.yaml

Folders and files

Latest commit

History

Repository files navigation

🏨 HOMYSTAY

Modern Full-Stack Hotel Booking Platform

📸 Application Preview

🏠 Landing Page

🛏️ Room Listing & Filters

🔍 Room Details & Booking

🔐 Authentication

✨ Key Features

🏨 For Guests

🏢 For Hotel Owners & Admins

🛡️ Role-Based Access Control

🏗️ System Architecture

Application Architecture

Deployment Architecture

💻 Tech Stack

⚙️ Getting Started

Prerequisites

Installation

Environment Variables

📂 Project Structure

📡 API Reference

🚀 Deployment

🗺️ Roadmap

🤝 Contributing

📄 License

🙏 Acknowledgments

About

Topics

Resources

License

Code of conduct

Contributing

Security policy

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Uh oh!

Contributors

Uh oh!

Languages

Packages