Remix

Make your own version of StayEase Rental Admin

Edit the prompt below and generate a customized version in seconds.

Original by Karan Dhanraj

Describe your app

Admin Panel, SaaS App. Target users: rent app use for rent rooms and houses. Design: Dark Mode, Bold & Colorful, Material Design, Dashboard Style.   Build a complete full-stack Airbnb-style Rental Marketplace web application called "StayEase" using React.

====================================
TECH STACK
====================================

Frontend:
- React 18 + Vite
- TypeScript
- Tailwind CSS
- Shadcn/UI (or Radix UI + Tailwind)
- React Router DOM v6
- React Hook Form + Zod
- Zustand (global state)
- Axios or TanStack Query (React Query)
- Framer Motion
- React-Leaflet (for maps)
- date-fns
- Lucide React
- Sonner (toast notifications)

Backend:
- Node.js + Express.js
- MongoDB + Mongoose
- JWT Authentication
- Multer + Cloudinary (for image uploads)
- bcryptjs
- cors
- dotenv

(Alternative Backend option: Supabase with React — but prefer custom Express + MongoDB)

====================================
FOLDER STRUCTURE
====================================
client/          → React frontend (Vite)
server/          → Express backend

====================================
DATABASE MODELS (MongoDB)
====================================

1. User
   - name, email, password, avatar, phone, bio, isHost, createdAt

2. Property
   - host (ref User)
   - title, description
   - propertyType (entire, private_room, shared_room)
   - location: { city, state, country, address }
   - coordinates: { lat, lng }
   - pricePerNight, cleaningFee
   - maxGuests, bedrooms, bathrooms
   - amenities: [String]
   - images: [String]
   - isActive
   - createdAt

3. Booking
   - property (ref)
   - guest (ref)
   - host (ref)
   - checkIn, checkOut
   - guestsCount
   - totalPrice
   - status: pending | confirmed | cancelled | completed
   - createdAt

4. Review
   - booking, property, guest
   - rating (1-5)
   - comment
   - createdAt

5. Wishlist
   - user, property

6. Message
   - booking, sender, receiver, content, isRead

====================================
FEATURES TO IMPLEMENT
====================================

1. Authentication
   - Register / Login
   - JWT based auth
   - Protected routes
   - Persist login (localStorage + context/zustand)
   - Become a Host functionality

2. Home Page
   - Hero with search bar (location, check-in, check-out, guests)
   - Categories
   - Featured properties

3. Search & Filter Page
   - Location, dates, guests
   - Price range
   - Property type
   - Amenities
   - Bedrooms/Bathrooms filter

4. Property Listing
   - Cards with image, title, location, price, rating, wishlist heart
   - Grid view

5. Property Detail Page
   - Image gallery
   - Description + Amenities
   - Map (React-Leaflet)
   - Reviews
   - Sticky booking card with price calculation
   - Reserve button

6. Booking System
   - Date selection
   - Price breakdown
   - Create booking
   - Booking confirmation

7. User Dashboard
   - My Trips (Upcoming / Past)
   - Wishlist
   - Profile edit

8. Host Dashboard
   - Add Property (multi-step form + image upload)
   - Edit / Delete Property
   - Manage Bookings (accept/reject)
   - Earnings overview

9. Wishlist functionality
10. Reviews system
11. Basic messaging between guest & host

====================================
API ENDPOINTS (Express)
====================================

Auth:
- POST /api/auth/register
- POST /api/auth/login
- GET  /api/auth/me

Properties:
- GET    /api/properties
- GET    /api/properties/:id
- POST   /api/properties          (host only)
- PUT    /api/properties/:id
- DELETE /api/properties/:id

Bookings:
- POST   /api/bookings
- GET    /api/bookings/my
- GET    /api/bookings/host
- PATCH  /api/bookings/:id/status

Reviews, Wishlist, Messages bhi banao.

====================================
UI/UX REQUIREMENTS
====================================
- Modern Airbnb-inspired clean design
- Fully responsive (mobile-first)
- Loading skeletons
- Toast notifications
- Form validation
- Beautiful empty states
- Smooth animations

====================================
EXTRA
====================================
- Seed at least 12-15 realistic properties (mostly India focused: Goa, Manali, Jaipur, Kerala, Mumbai etc.)
- Proper error handling
- Protected routes on frontend
- Image upload with preview

Make the entire application fully working end-to-end (Frontend + Backend).

Free to use. No credit card required.