Full Stack · MERN · Production Grade

Roamio

A production-ready, full-stack hotel booking platform built with the MERN stack. Features luxury travel aesthetic, full user authentication, hotel search & filtering, room selection, and complete booking management.

Live Demo Github Repo All Projects

Project Overview

What is Roamio?

Roamio is a full-stack hotel booking application that simulates a real-world luxury travel platform. It demonstrates production-level patterns like JWT authentication, protected routes, admin roles, MongoDB relational modelling, and a polished mobile-first UI.

The database is pre-seeded with 8 world-class hotels across destinations like the Maldives, Santorini, Tokyo, Tuscany, NYC, Bali, Dubai, and Paris, each with 3 room types (Deluxe, Superior Suite, Presidential Suite).

This project was built to demonstrate full-stack ownership from MongoDB schema design to animated React UI to secure Express APIs.

TypeFull Stack Web App

StackMERN (MongoDB, Express, React, Node)

AuthJWT + bcrypt (12 salt rounds)

DB ModelsUser, Hotel, Room, Booking

Seeded Data8 Hotels · 24 Rooms · 2 Demo Users

Status Production Ready

Tech Stack

Layer	Technology
Frontend	React 18, React Router v6, Axios, date-fns
Backend	Node.js, Express.js, JWT, bcryptjs
Database	MongoDB, Mongoose
Styling	Vanilla CSS with CSS variables
State	React Context API + useReducer

Feature Deep Dive

What's Inside?

Home Page

Hero section with search bar, featured hotels showcase, destination cards, and property type filters.

Hotel Listing

Filter by city, property type, price range with server-side pagination and smooth UI updates.

Hotel Detail

Photo gallery, room selection cards, booking sidebar with real-time price calculation.

Booking Flow

Guest details form, price breakdown, booking confirmation screen with unique confirmation codes.

My Bookings

View all bookings with status badges (confirmed/cancelled), cancel option, and booking history.

Profile Page

Update personal information, view account stats, and manage preferences.

JWT Auth

Secure token-based authentication with bcrypt password hashing (12 salt rounds) and 30-day expiry.

Admin Routes

Protected admin-only endpoints for hotel and room creation, verified server-side on every request.

Fully Responsive

Mobile-first design across all breakpoints — every screen, every device, every time.

Backend Architecture

API Reference

Auth Endpoints

Method	Endpoint	Description
POST	/api/auth/register	Register new user
POST	/api/auth/login	Login & get JWT
GET	/api/auth/me	Get current user

Hotel Endpoints

Method	Endpoint	Description
GET	/api/hotels	Get all (with filters)
GET	/api/hotels/:id	Get single hotel
POST	/api/hotels	Create (admin only)
PUT	/api/hotels/:id	Update (admin only)

Booking Endpoints

Method	Endpoint	Description
GET	/api/bookings/my	Get my bookings
POST	/api/bookings	Create booking
PUT	/api/bookings/:id/cancel	Cancel booking

Security Notes

Passwords hashed with bcrypt (12 salt rounds)

JWT tokens expire after 30 days

Protected routes require Authorization: Bearer token

CORS configured for frontend origin only

Get It Running

Quick Setup

Clone & Install

git clone https://github.com/Kalpana-chavhan/Roamio-Home-Away-From-Home.git
cd roamio
npm run install-all

Configure Environment

Create backend/.env with:

PORT=5000
MONGODB_URI=mongodb://localhost:27017/roamio
JWT_SECRET=your_super_secret_key_here
JWT_EXPIRE=30d
FRONTEND_URL=http://localhost:3000

Seed the Database

npm run seed

Creates 8 hotels, 24 rooms, and 2 demo users. Admin: admin@roamio.com / admin123

Run the App

npm run dev

Frontend runs on http://localhost:3000 · Backend on http://localhost:5000