Dự án này cho phép thu thập phản hồi của người dùng thông qua một biểu mẫu và lưu lại vào một tệp cục bộ. Trình thu thập phản hồi người dùng là một tính năng cơ bản trong nhiều ứng dụng — nó là một công cụ hoặc hệ thống được sử dụng để thu thập ý kiến từ người dùng về trải nghiệm của họ với sản phẩm hoặc dịch vụ. Công cụ này giúp các nhóm phát triển hiểu được người dùng nghĩ gì, cảm thấy thế nào hoặc cần gì, từ đó đưa ra các cải tiến hợp lý.
Yêu cầu trước khi bắt đầu
- Có kiến thức cơ bản về JavaScript, Node.js và Express.
- Máy tính đã cài đặt sẵn Node.js, Git và npm.
Các tính năng chính
- Nhận phản hồi với các trường: tên, email, nội dung và một hình ảnh.
- Kiểm tra tính hợp lệ của tất cả các trường, bao gồm định dạng email và độ dài thông điệp.
- Chỉ chấp nhận hình ảnh định dạng
.jpeg,.jpg,.pngvới dung lượng tối đa 10MB. - Lưu các tệp đã tải lên vào thư mục
/uploads. - Lưu phản hồi người dùng vào tệp
feedbacks.jsontrong máy.
Cấu trúc dự án
TC-Feedback-Collector/
├──controllers/ // Handles request logic
├──middleware/ // Custom middleware functions
├──model/
├──routes/ // API route definition
├──service/
├──utility/
├──app.js // main application file
├──.gitignore // gitignore file
├──package.json // Project dependencies
└──README.md //documentation file
Cài đặt dự án
Sao chép repository và điều hướng vào thư mục dự án
git clone https://github.com/Jerryemmanuel01/TC-Feedback-Collector.git
cd TC-Feedback-Collector
Khởi tạo dự án Node.js
npm init -y
Lệnh này sẽ tạo ra file package.json.
Cài đặt các dependencies
npm install express multer nodemon path
Trong đó:
express: Đơn giản hóa quá trình xây dựng server và API.multer: Cho phép người dùng tải tệp lên qua form (ví dụ hình ảnh, tài liệu).nodemon: Tự động khởi động lại ứng dụng khi có thay đổi file.path: Cung cấp các công cụ làm việc với đường dẫn tệp theo cách đa nền tảng.
1. Cấu hình Server
Tệp app.js là tệp chính của server. Nó khởi tạo server Express.js, phục vụ các tệp tĩnh (hình ảnh đã tải lên), định tuyến các yêu cầu phản hồi đến /feedback và phân tích dữ liệu JSON và form URL-encoded được gửi lên.
2. Cấu hình chức năng lưu phản hồi
Một hàm được định nghĩa để lưu phản hồi của người dùng vào tệp feedbacks.json trên server.
3. Cấu hình Middleware
Thư mục middleware chứa hai tệp:
fileUpload.js: Thiết lập xử lý tải lên tệp bằng middleware Multer. Tệp được lưu an toàn, đặt tên duy nhất và áp dụng giới hạn về loại tệp & kích thước.validateFeedback.js: Thực hiện kiểm tra tính hợp lệ phía server cho các trường phản hồi trước khi xử lý. Đảm bảo dữ liệu gửi lên đúng định dạng và tuân theo quy tắc yêu cầu.
4. Tạo route
Một route Express.js được tạo để xử lý yêu cầu gửi phản hồi. Điểm cuối POST / kiểm tra dữ liệu phản hồi và lưu vào tệp JSON.
5. Chạy ứng dụng
npm run start
6. Kiểm thử ứng dụng bằng Postman
Điểm cuối /feedback là nơi nhận phản hồi từ người dùng.
Các bước:
-
Mở Postman
-
Nhập URL:
http://localhost:5000/feedback -
Đặt loại body thành form-data
-
Thêm các cặp key-value sau:
-
Gửi yêu cầu. Nếu tất cả dữ liệu hợp lệ, bạn sẽ nhận phản hồi như sau:
{ "status": 201, "message": "Feedback saved successfully.", "error": false
}
Kết luận
Dự án này là một giải pháp đơn giản nhưng hiệu quả để thu thập phản hồi người dùng kèm theo hình ảnh. Nó thể hiện các kỹ thuật phát triển backend quan trọng như kiểm tra form, xử lý file với Multer và cấu trúc định tuyến rõ ràng với Express.js.