CinemaHub - Hệ thống đặt vé xem phim Full-stack production ready với Next.js 15 & React 18
--- Tổng quan dự án --- CinemaHub là hệ thống đặt vé xem phim trực tuyến hoàn chỉnh. Dự án cung cấp trải nghiệm đặt vé mượt mà, giao diện đẹp mắt và đầy đủ tính năng cho cả người dùng và quản trị viên. Mục tiêu: Tạo ra một nền tảng đặt vé xem phim hiện đại, dễ sử dụng và có khả năng mở rộng cao.
--- Tính năng đã hoàn thành ---
(1) Người dùng cuối
Quy trình đặt vé đầy đủ
Xem phim, trailer, rating, reviews
Chọn rạp, suất chiếu, ghế
Ghế 3 loại: Standard, VIP, Couple
Lock ghế real-time với Redis (10 phút)
Chọn combo đồ ăn, nước
Thanh toán ZaloPay, tiền mặt
Auto cancel sau 5 phút nếu chưa thanh toán
OTP 6 số, JWT, bảo mật
Lịch sử vé, QR code cho mỗi vé
Membership tiers: Bronze, Silver, Gold, Platinum
Hủy vé, release ghế tự động
(2) Quản trị viên
Dashboard doanh thu real-time
Thống kê bookings, movies, users
Top phim bán chạy
Chart revenue 6 tháng
CRUD phim, rạp, suất chiếu, combo
--- Tính năng kỹ thuật --- Database & Caching:
MongoDB + Mongoose
12 models: User, Movie, Cinema, Showtime, Booking, Combo, Review, Voucher, Promotion, Notification, OTP, AuditLog
Indexes tối ưu query
Redis seat locking
State Management:
Zustand
Auth + booking store
QR Code:
QR bookingCode
UI/UX:
Dark theme (#0a0e27)
Gradient (#f97316 → #dc2626)
Glass morphism, Framer Motion
--- Công nghệ sử dụng --- Frontend: Next.js 15, React 18, TS, Tailwind, Zustand Backend: Next.js API, MongoDB, Redis, JWT, Bcrypt Tích hợp: ZaloPay, Nodemailer, QRCode, Chart.js
--- Thiết kế UI/UX ---
Dark theme
Glass morphism
Animations
Responsive mobile-first
Toast notifications
Không emoji, dùng Lucide icons
--- Bảo mật ---
JWT + refresh token
bcrypt hashing
Protected API routes
Input validation (Zod)
XSS & CSRF protection
Rate limiting
--- Performance ---
Server Components
Next Image optimize
Redis caching
MongoDB indexes
Lazy loading
--- Deployment ---
Vercel
Docker
VPS + PM2
Lưu ý: cần config MongoDB, Redis, ZaloPay cho production
--- Tương lai ---
Social login (Google, Facebook)
Push notifications
Mobile App React Native
AI recommendations
Live chat support
Multi-language
PWA
XEM THÊM ==> Hướng dẫn cài đặt chi tiết
HƯỚNG DẪN CÀI ĐẶT
--- HƯỚNG DẪN CÀI ĐẶT (INSTALLATION GUIDE) ---
Yêu cầu hệ thống:
Node.js 18+
MongoDB
Redis
Git
Kiểm tra version: node --version npm --version mongod --version redis-server --version
Clone repository: git clone cd tickets-booking
Cài dependencies: npm install
File môi trường: cp .env.example .env.local
Các ENV chính:
MONGODB_URI=...
REDIS_URL=...
JWT_SECRET=...
SMTP_HOST=...
SMTP_USER=...
ZALOPAY_APP_ID=...
NEXT_PUBLIC_APP_URL=http://localhost:3000
Khởi động MongoDB & Redis: Terminal 1: mongod Terminal 2: redis-server
Seed dữ liệu (optional): curl http://localhost:3000/api/seed
Chạy dev server: npm run dev Truy cập: http://localhost:3000
Tài khoản test: Email: test@example.com Password: Test123456
Build production: npm run build npm start
Deploy options:
vercel deploy
docker build -t cinema-booking .
pm2 start npm --name "cinema" -- start
Xử lý sự cố thường gặp: Port 3000 in use → kill process MongoDB connection failed → restart mongod Redis connection failed → restart redis Module not found → xóa node_modules + npm install
Nguồn: Topcode.vn
