Ứng dụng web full-stack quản lý và vận hành quán cafe, hỗ trợ các nghiệp vụ từ quản lý người dùng, bàn, menu đến đặt bàn, gọi món, xử lý đơn hàng và thanh toán. Hệ thống được xây dựng theo mô hình phân quyền với ba vai trò Admin, Staff và Customer. Backend cung cấp REST API bằng Spring Boot, sử dụng Spring Security + JWT để xác thực và phân quyền, JPA/MySQL để quản lý dữ liệu và Cloudinary để lưu trữ hình ảnh sản phẩm. Frontend được phát triển bằng React + TypeScript, kết hợp Redux Toolkit và giao diện responsive.
Câu chuyện dự án
Quá trình, quyết định và kết quả nổi bật của dự án.
Câu chuyện dự án
Quá trình, kiến trúc và các thành phần nổi bật của hệ thống quản lý quán cafe full-stack.
Tổng quan
Cafe Management System là một ứng dụng web full-stack được xây dựng nhằm mô phỏng quy trình vận hành của một quán cafe từ phía khách hàng đến phía quản trị.
Hệ thống tập trung vào các nghiệp vụ chính như:
Authentication
→ User Management
→ Table Management
→ Reservation
→ Menu
→ Order Processing
→ Payment
Project được xây dựng theo kiến trúc frontend/backend tách biệt, trong đó Spring Boot đảm nhiệm backend REST API và React 19 + TypeScript phụ trách giao diện người dùng.
Dữ liệu được lưu trữ trong MySQL, hình ảnh menu được quản lý thông qua Cloudinary, đồng thời toàn bộ frontend, backend và database có thể được chạy bằng
Docker Compose
.
Chức năng chính
Hệ thống cung cấp các nhóm chức năng chính:
Đăng ký tài khoản.
Đăng nhập người dùng.
JWT Authentication.
Access Token và Refresh Token.
Phân quyền người dùng.
Quản lý thông tin tài khoản.
Quản lý khách hàng và nhân viên.
Quản lý bàn trong quán.
Theo dõi trạng thái bàn.
Đặt bàn.
Xác nhận và quản lý reservation.
Quản lý menu.
Upload hình ảnh món ăn và đồ uống.
Quản lý trạng thái sản phẩm.
Tạo đơn hàng.
Quản lý chi tiết món trong đơn hàng.
Theo dõi trạng thái đơn hàng.
Quản lý thanh toán.
Theo dõi lịch sử giao dịch.
Dashboard quản trị.
RESTful API.
Dockerized deployment.
Authentication & Authorization
Authentication được triển khai bằng:
Spring Security + JWT
Hệ thống sử dụng cơ chế token-based authentication thay vì lưu session phía server.
Luồng đăng nhập chính:
User
→ Login
→ AuthController
→ Authentication Service
→ JWT Access Token
→ Protected REST API
Các request truy cập tài nguyên được bảo vệ sẽ đi qua JWT filter trước khi được xử lý bởi controller.
Project hoàn thiện một hệ thống quản lý quán cafe full-stack với các nghiệp vụ chính được kết nối xuyên suốt từ:
Authentication → User Management → Table & Reservation Management → Menu Management → Order Processing → Payment Management → Media Storage → Containerized Deployment
Điểm nổi bật của project là việc tổ chức nhiều domain nghiệp vụ thành một hệ thống thống nhất, thay vì chỉ triển khai các chức năng CRUD độc lập.
Backend được xây dựng bằng Spring Boot, áp dụng kiến trúc Controller – Service – Repository, kết hợp Spring Security, JWT, DTO, Validation và JPA để xử lý authentication, authorization và business logic.
Frontend sử dụng React + TypeScript để xây dựng giao diện quản trị và người dùng, đồng thời tách riêng service layer, state management và các reusable component nhằm giúp source dễ quản lý và mở rộng.
Thông qua project, mình có cơ hội thực hành và củng cố các kỹ năng về Full-stack Development, Spring Boot Backend, REST API Design, Authentication & Authorization, Relational Database Design, React Dashboard và Dockerized Deployment.
Tech Stack
Java 17 · Spring Boot 3 · Spring Security · JWT · Spring Data JPA · MySQL · MapStruct · Cloudinary · React 19 · TypeScript · Vite · Redux Toolkit · Redux Persist · React Hook Form · Zod · Tailwind CSS · Shadcn UI · Radix UI · TanStack Table · Recharts · Framer Motion · Docker · Docker Compose · Nginx
Social Media Realtime — Nền tảng mạng xã hội thời gian thực