StayZio is a full-stack rental platform that enables property owners to manage listings and bookings seamlessly while allowing guests to explore, book, and review accommodations β all in a secure cloud-integrated environment with Next.js frontend, AWS Cognito for authentication, Node.js backend, and AWS RDS and S3 for database and storage.
| Layer | Technology |
|---|---|
| Frontend | Next.js (App Router, TypeScript, Tailwind CSS, Zustand) |
| Backend | Node.js + Express.js |
| Database ORM | Prisma (PostgreSQL) |
| Cloud Services | AWS EC2 / S3 |
| Authentication | JWT-based Auth (Role-based) |
| State Management | Zustand / Redux Toolkit |
| Styling | Tailwind CSS + ShadCN UI |
| Deployment | Vercel (Frontend), AWS EC2 (Backend) |
StayZio/
βββ client/ # Frontend (Next.js)
β βββ src/
β β βββ app/ # App Router (Auth, Dashboard, Listings, etc.)
β β βββ components/ # Reusable UI components
β β βββ hooks/ # Custom React hooks
β β βββ state/ # Zustand or Redux store
β β βββ lib/ # Utility functions & API client
β β βββ types/ # Global TypeScript types
β βββ package.json
β
βββ server/ # Backend (Express + Prisma)
β βββ src/
β β βββ controllers/ # Route controllers (auth, bookings, listings)
β β βββ routes/ # REST API routes
β β βββ middleware/ # Authentication & validation middlewares
β β βββ index.ts # Entry point
β βββ prisma/ # Prisma schema & migrations
β βββ package.json
β
βββ README.md
- Add, edit, and delete property listings.
- Manage rental pricing, availability, and images.
- Track and manage bookings.
- Browse and filter properties by city, price, and amenities.
- Book instantly or request availability.
- Leave ratings and reviews.
- JWT-based authentication with roles:
admin,host,guest. - Protected routes and session persistence.
- Image uploads to AWS S3.
- Deployment on AWS EC2 for scalability.
- Prisma ORM for structured database interaction.
- REST APIs with Express for listings, users, and bookings.
- Responsive UI with TailwindCSS + ShadCN.
- Modular and type-safe architecture.
- Built on Next.js App Router.
flowchart TD
A[User Visit StayZio] --> B{Authenticated?}
B -->|No| C[Login / Register Page]
B -->|Yes| D[Role Check]
D -->|Guest| E[Browse Listings]
E --> F[Filter & View Property Details]
F --> G[Book Property]
G --> H[Payment & Booking Confirmation]
H --> I[Email Notification Sent]
I --> J[Booking Data Stored in Database]
D -->|Host| K[Access Dashboard]
K --> L[Add / Edit Property Listings]
L --> M[Upload Images to AWS S3]
M --> N[Manage Bookings & Earnings]
N --> O[Database Update via Prisma]
D -->|Admin| P[Admin Dashboard]
P --> Q[Manage Users, Listings & Reports]
Q --> R[System Analytics & Logs]
R --> S[Cloud Backup & Security Checks]
graph TD
A[Client Request] --> B[Express Router]
B --> C{Controller}
C -->|Validation| D[Middleware]
D --> E[Prisma ORM]
E --> F[(PostgreSQL Database)]
C --> G[Response JSON β Client]
graph TD
A[User Interaction] --> B[Action Dispatch]
B --> C[Zustand/Redux Store]
C --> D[API Call via lib/api.ts]
D --> E[Backend Response]
E --> F[State Updated β UI Re-renders]
cd server
npm install
# Create .env file
cp env.example .env
# Run Prisma migrations
npx prisma migrate dev
# Start backend
npm run devcd client
npm install
# Create .env file
cp env.example .env.local
# Run development server
npm run devVisit π http://localhost:3000
Deployed on Vercel
npm run build
vercel deployHosted on AWS EC2 using PM2
pm2 start ecosystem.config.js
