Tất cả dự án
Full-stack · Thương mại điện tử
Digital E
Cửa hàng điện tử và bảng điều khiển vận hành, kết nối tìm kiếm, thanh toán và quản lý đơn hàng.
Trọng tâmKhám phá, thanh toán & vận hành
Loại dự ánDự án cá nhân · 06/2024 - Hiện tại
Công nghệ
React
NestJS
MySQL
TypeScript
Prisma
Firebase
Tailwind CSS
Docker
Vercel
Cloudflare Workers
ReactNestJSMySQLTypeScriptPrismaFirebaseTailwind CSSDockerVercelCloudflare WorkersGiao diện sản phẩm
Chọn màn hình, sau đó mở ảnh để xem rõ hơn.Đóng góp cá nhân
Phần việc tôi phụ trách
Phát triển full-stack · Dự án cá nhân
- 01
Trải nghiệm sản phẩm
Xây dựng cửa hàng điện tử và trải nghiệm quản trị cho tìm kiếm sản phẩm, thanh toán, theo dõi đơn và vận hành.
- 02
API & dữ liệu
Phát triển API NestJS trên Express với MySQL làm cơ sở dữ liệu chính khi ứng dụng chạy, Prisma cho mô hình dữ liệu và migration; Zod kiểm tra dữ liệu đầu vào khi ghi.
- 03
Thanh toán & phân quyền
Tích hợp thanh toán qua PayOS và khi nhận hàng, xác thực Firebase, phiên làm việc bằng cookie và trang quản trị phân quyền theo vai trò.
- 04
Chất lượng & triển khai
Kiểm tra giao diện và API bằng Vitest, Testing Library, kiểm thử tích hợp cơ sở dữ liệu, k6 và quy trình CI theo từng gói; triển khai giao diện và máy chủ riêng.
01
Tổng quan
Digital-E kết hợp cửa hàng React và bảng điều khiển vận hành với API NestJS. MySQL là kho dữ liệu chính khi ứng dụng chạy; Prisma cung cấp mô hình dữ liệu có kiểu và các bản migration cho một phần cấu trúc cơ sở dữ liệu.
02
Bài toán
Tìm kiếm, giỏ hàng, tồn kho, thanh toán và theo dõi đơn cần nhất quán giữa giao diện và API. Luồng thanh toán dành cho khách cần cho phép xem đơn an toàn mà không buộc tạo tài khoản; webhook và việc giữ tồn kho phải được xác minh ở máy chủ.
03
Giải pháp kỹ thuật
Để máy chủ kiểm soát quy trình thanh toán
Vì sao chọn cách này
Máy chủ tạo báo giá từ sản phẩm, tồn kho, ưu đãi và dữ liệu đặt hàng hiện tại; trang quay về trình duyệt không thể tự đánh dấu đơn đã thanh toán.
Đánh đổi
Tăng xử lý ở API và cơ sở dữ liệu trên luồng chính, đổi lại hệ thống không phải tin trạng thái tồn kho hay thanh toán đã cũ ở giao diện.
Ghi nhận sự kiện thanh toán trước khi xác nhận
Vì sao chọn cách này
Xác minh chữ ký PayOS và lưu bền vững sự kiện từ nhà cung cấp trước khi xác nhận thay đổi nghiệp vụ.
Đánh đổi
Khôi phục và xử lý sự kiện trùng làm tăng logic trạng thái/lưu trữ, nhưng giúp retry khi lỗi tạm thời và an toàn khi gửi lại.
Đặt SQL và giao dịch sau ranh giới kho mã nguồn
Vì sao chọn cách này
Câu lệnh SQL giữ chỗ thanh toán và thao tác lưu trữ gắn với giao dịch nằm sau lớp truy cập dữ liệu; các mô-đun NestJS điều phối nghiệp vụ.
Đánh đổi
Ranh giới kiểm thử và phân công trách nhiệm rõ hơn, nhưng cần duy trì thêm giao diện kho dữ liệu và bước ánh xạ dữ liệu.
04
Tính năng sản phẩm
Tìm kiếm, bộ lọc & so sánh sản phẩm
Giỏ hàng khách/thành viên và theo dõi đơn
PayOS, thanh toán khi nhận hàng & Stripe tuỳ chọn
Quản trị tồn kho, đơn hàng và khuyến mãi
05
Tổng quan hệ thống
Kiến trúc đối chiếu mã nguồnDigital E
Cấu trúc theo mã nguồnKho mã nguồn ↗Giao diện React độc lập gọi API NestJS dạng mô-đun; MySQL là nơi lưu trữ chính khi ứng dụng chạy.
Cửa hàng trực tuyến & trang quản trị React
REST / JSON
NestJS API · Express adapter
Giao dịch SQL
MySQL
Định danh & thanh toán
Firebase Authentication
Thanh toán & webhook PayOS
Dựa trên tài liệu kiến trúc hiện tại cùng mã nguồn xử lý thanh toán và xác thực.
06
Bằng chứng & kiểm chứng
Kho mã nguồn ghi nhận Vitest, Testing Library, bộ kiểm thử tích hợp cơ sở dữ liệu, k6 và quy trình CI theo từng gói.
Tài liệu kiến trúc thể hiện ranh giới giữa giao diện, API, cơ sở dữ liệu MySQL, xác thực và thanh toán.
07
Những điểm cần cân nhắc
Kho mã nguồn dùng MySQL làm cơ sở dữ liệu chính khi ứng dụng chạy, đồng thời tách giao diện React và API NestJS thành các gói có thể triển khai riêng. Vitest, Testing Library, k6, quy trình CI theo từng gói và OpenTelemetry (tuỳ chọn) kiểm tra các khâu khác nhau trước khi phát hành.
gRPC
PostgreSQL
Kafka