Hotello

ReactTypescriptExpressMongoDB·Live
Hotello
Hotello
Hotello

Project Summary

Key Features:

  • Search & Booking: Filter hotels by city, date, price; dynamic pricing & total calculation
  • User Management: Profile management, booking history, secure authentication
  • Admin Controls: Add/edit/delete hotels and rooms, upload photos, set pricing
  • Payments: Stripe checkout with confirmation and error flows
  • Developer-Friendly: Modular TypeScript code, ESLint & TS setup, REST API architecture, full E2E suite

See screenshots below

Tech Stack:

Typescript, React, Tailwind, Express, MongoDB + Mongoose, Cloudinary, Stripe

Live Link: Hotello


GitHub: https://github.com/MezieNwagbo/hotello-app

Overview

Hotello is a full-stack hotel booking platform designed for travelers and hotel administrators alike. Users can search and browse hotels, view detailed listings with photos and amenities, make secure bookings via Stripe, and manage their profiles. On the admin side, hotel owners can add and manage listings, rooms, and pricing, enabling a SaaS-style management experience.

I built Hotello as a showcase of modular architecture, scalable full-stack design, and reusable UI patterns, demonstrating best practices in modern web development.

Roles and Responsibilities

When I started Hotello, the goal was clear: build a production-ready hotel booking platform from scratch with a clean, modular codebase.

Frontend & User Experience
I designed and implemented the client with React + Vite, ensuring:

  • A responsive and intuitive UI using Tailwind CSS
  • Fast, cache-friendly data fetching with React Query
  • Smooth forms and validation with React Hook Form
  • Route-based navigation via React Router

This made the booking experience seamless — from searching hotels to confirming a reservation.

Backend & Architecture
The backend was built with Express and MongoDB, with a focus on:

  • Authentication: JWT-based login/registration with role-based access (User/Admin)
  • Hotel & Room Management: CRUD operations for listings and rooms
  • Booking Flow: Secure Stripe payments with error handling
  • Media Management: Image uploads via Cloudinary

I structured the project as a monorepo, separating frontend, backend, and E2E tests for maintainability and developer productivity.

Testing & Reliability
All critical flows, especially booking and payment, are covered with Playwright E2E tests, ensuring the app behaves reliably under real-world conditions.