Mô tả

​

TechMart - Website Bán Điện Thoại

Website thương mại điện tử bán điện thoại xây dựng bằng React + TypeScript (Frontend) và Node.js + Express + TypeScript (Backend), áp dụng Clean Architecture.

Kiến Trúc

Backend - Clean Architecture

• Domain: entities, repository interfaces

• Application: use-cases, services, mappers

• Infrastructure: database, repository implementations

• Presentation: controllers, routes, middlewares

Frontend - Feature-Based Architecture

• Shared components

• Feature modules: products, cart, auth, orders, admin, payment, wallet

• Pages, services, store (Zustand), types

Công Nghệ Sử Dụng

Backend

• Node.js, Express, TypeScript

• MySQL 8

• JWT Authentication

• VNPay SDK

• Nodemailer

• Multer

• Bcrypt

Frontend

• React 18 + Vite + TypeScript

• Tailwind CSS

• Zustand

• React Router v6

• React Hook Form + Zod

• Chart.js

• Axios

Tính Năng Khách Hàng

Trang chủ

• Banner slider động

• Sản phẩm nổi bật, bán chạy, mới nhất, giảm giá

• Hiển thị danh mục và thương hiệu nổi bật

Mua sắm

• Tìm kiếm và lọc đa tiêu chí

• Sắp xếp, phân trang

• Chi tiết sản phẩm: gallery, thông số, giá giảm

• Chọn biến thể màu/dung lượng, kiểm tra tồn kho

• Thêm giỏ hàng / mua ngay

Giỏ hàng

• Quản lý theo từng biến thể

• Chọn/bỏ chọn sản phẩm

• Cập nhật số lượng theo tồn kho

• Tính tổng tiền, phí ship

• Lưu localStorage

Thanh toán

• Quản lý địa chỉ giao hàng

• Áp mã giảm giá

• Hỗ trợ COD, Ví TechMart, VNPay

• Trang kết quả thanh toán VNPay

Đơn hàng

• Theo dõi trạng thái đơn

• Xem chi tiết và timeline

• Hủy đơn, xác nhận nhận hàng

• Yêu cầu hoàn trả

• Thanh toán lại đơn VNPay

Đánh giá & Hoàn trả

• Tạo yêu cầu hoàn trả kèm ảnh

• Theo dõi tiến trình hoàn trả

• Đánh giá sản phẩm có ảnh và badge “đã mua hàng”

Tài khoản

• Đăng ký/đăng nhập JWT

• Quên mật khẩu bằng OTP

• Cập nhật hồ sơ, avatar, banner

• Quản lý sổ địa chỉ

• Chọn địa chỉ qua API Việt Nam

• Hiển thị hạng thành viên

Ví TechMart

• Xem số dư

• Nạp tiền qua VNPay

• Lịch sử giao dịch

Trang nội dung

• Giới thiệu, FAQ, chính sách, liên hệ

Tính Năng Quản Trị

Dashboard

• KPI đơn hàng, doanh thu, người dùng

• Biểu đồ thống kê

• Theo dõi tồn kho, đơn gần đây, top sản phẩm

Quản lý sản phẩm

• CRUD sản phẩm

• Quản lý giá, tồn kho, specs

• Upload nhiều ảnh

• Quản lý biến thể

• SEO và cờ nổi bật

Danh mục & Thương hiệu

• Danh mục cây cha-con

• Soft delete, restore

• CRUD thương hiệu

• Thuộc tính động theo danh mục

Đơn hàng & Hoàn trả

• Cập nhật trạng thái đơn

• Quản lý hoàn trả và hoàn tiền ví

• Cập nhật thanh toán

Marketing & Nội dung

• Voucher/coupon

• Banner quảng cáo

Quản lý người dùng & đánh giá

• Duyệt/xóa đánh giá

• Phân quyền user

• Khóa tài khoản, reset mật khẩu

Quản lý ví

• Theo dõi giao dịch nạp/rút

• Thống kê tổng nạp

Luồng Nghiệp Vụ

Đơn hàng

pending → confirmed → shipping → delivered → completed

Ngoại lệ

• Hủy trước khi giao

• Hoàn trả trong 7 ngày

Tự động hóa

• Scheduler cập nhật trạng thái đơn

• Đơn VNPay/Ví xác nhận nhanh

• Tự động completed sau thời gian quy định

• Hoàn tiền về Ví TechMart

Phân Quyền

• customer: mua hàng, quản lý tài khoản

• admin: toàn quyền hệ thống

• staff: quản lý nội dung, đánh giá, hoàn trả

• warehouse: quản lý sản phẩm, tồn kho, trạng thái đơn