Link demo: https://drive.google.com/file/d/1B-XbafGrDLBCGR15Fw0n38RNkeXzabir/view?usp=sharing
1. Giới thiệu dự án
Hệ thống quản lý và đặt vé xe khách toàn diện, được xây dựng trên nền tảng công nghệ mới nhất. Code được tối ưu hóa về hiệu năng, xử lý dữ liệu chặt chẽ và giao diện người dùng hiện đại, dễ dàng tùy chỉnh.
2. Công nghệ sử dụng
-
Frontend: Next.js 15 (App Router), React, Tailwind CSS.
-
Backend: Next.js API Routes (Serverless Functions).
-
Database: SQL Server (MSSQL) với thư viện mssql.
-
Authentication: Cơ chế đồng bộ giữa LocalStorage và Cookie giúp duy trì đăng nhập ổn định.
3. Các tính năng nổi bật
-
Quản lý tuyến đường: Thêm, sửa, xóa và cập nhật trạng thái hoạt động của các chuyến xe.
-
Bộ lọc thông minh: Tìm kiếm tuyến đường theo địa điểm, thời gian và nhà xe vận hành.
-
Ràng buộc dữ liệu: Hệ thống kiểm tra logic chặt chẽ, ngăn chặn lỗi dữ liệu trống (NULL) từ phía người dùng.
-
Đồng bộ Auth: Tự động khôi phục phiên đăng nhập mà không gây hiện tượng lặp trang (infinity reload).
-
Giao diện linh hoạt: Sidebar có thể thu gọn, Modal form chuyên nghiệp và bảng dữ liệu hỗ trợ cuộn mượt mà.
4. Ưu điểm kỹ thuật
-
Xử lý bất đồng bộ (Async/Await) chuẩn xác cho các API động.
-
Cấu trúc code sạch, phân tách rõ ràng giữa UI components và logic xử lý dữ liệu.
-
Giao diện Responsive hoàn toàn, hiển thị tốt trên mọi thiết bị.
XEM THÊM ==> Hướng dẫn cài đặt chi tiết
Nguồn: Sharecode.vn
Đây là bản mô tả dự án được viết lại theo phong cách chuyên nghiệp, tối giản và hoàn toàn không sử dụng icon:
Hệ Thống Đặt Vé Xe Khách Trực Tuyến - Next.js 15 và SQL Server
Bộ Source Code website đặt vé xe khách toàn diện, được tối ưu hóa về logic xử lý và hiệu năng. Sản phẩm phù hợp cho đồ án sinh viên hoặc làm nền tảng phát triển hệ thống quản lý vận tải thực tế.
Tính Năng Cốt Lõi
-
Tìm kiếm và Lọc: Hệ thống lọc chuyến xe thông minh theo điểm đi, điểm đến và thời gian thực.
-
Đặt vé và Quản lý: Quy trình đặt vé trực quan, hỗ trợ quản lý lịch sử giao dịch và trạng thái đơn hàng.
-
Quản trị Tuyến đường: Giao diện Admin chuyên nghiệp để thêm, sửa, xóa và điều chỉnh trạng thái nhà xe hoặc tuyến đường.
-
Thông báo tự động: Tích hợp SMTP gửi Email xác nhận vé ngay lập tức sau khi đặt thành công.
-
Auth Sync: Cơ chế đồng bộ phiên làm việc thông minh giữa LocalStorage và Cookie, xử lý triệt để lỗi lặp trang.
Công Nghệ Sử Sử Dụng
-
Framework: Next.js 15 (App Router) - Phiên bản mới nhất.
-
Styling: Tailwind CSS (Giao diện hiển thị tốt trên mọi thiết bị).
-
Database: Microsoft SQL Server (MSSQL).
-
Backend: Next.js API Routes với cơ chế xử lý Async/Await chặt chẽ.
Hướng Dẫn Cài Đặt
-
Cài đặt môi trường: Mở Terminal tại thư mục dự án và cài đặt các thư viện bằng lệnh: npm install.
-
Thiết lập Cơ sở dữ liệu: Tạo Database mới trên SQL Server. Sau đó chạy nội dung file database.sql đính kèm để khởi tạo cấu trúc bảng và dữ liệu mẫu.
-
Cấu hình Biến môi trường: Sửa file .env hoặc .env.local với các thông tin về tài khoản SQL Server và cấu hình SMTP Email.
-
Khởi chạy: Sử dụng lệnh npm run dev để bắt đầu dự án ở môi trường phát triển.
Ghi Chú Kỹ Thuật
Dự án đã được xử lý các vấn đề kỹ thuật quan trọng bao gồm:
-
Giải quyết yêu cầu unwrapped params trên Next.js 15.
-
Kiểm soát ràng buộc dữ liệu từ Frontend đến API để ngăn chặn lỗi NULL trong SQL Server.
-
Tối ưu hóa trải nghiệm người dùng với cơ chế đồng bộ tài khoản không cần tải lại trang.
Thông tin liên hệ và hỗ trợ: