Dự án này là một ứng dụng mua sắm trực tuyến được xây dựng bằng React. Nó bao gồm các chức năng sau:
-
Hiển thị danh sách sản phẩm: Các sản phẩm được lấy từ file data.json và hiển thị trong thành phần Product.
-
Thêm sản phẩm vào giỏ hàng: Khi người dùng nhấp vào nút thêm vào giỏ hàng trong mỗi sản phẩm, sản phẩm đó sẽ được thêm vào giỏ hàng. Chức năng này được xử lý bởi hàm handleAddToCart trong thành phần Shop.
-
Xem giỏ hàng: Giỏ hàng được hiển thị trong thành phần Cart. Nó hiển thị danh sách các sản phẩm đã được thêm vào giỏ hàng.
-
Xóa giỏ hàng: Người dùng có thể xóa tất cả các mục trong giỏ hàng bằng cách sử dụng hàm handleClearCart trong thành phần Shop.
-
Lưu trữ giỏ hàng: Giỏ hàng được lưu trữ trong localStorage để nó có thể được giữ nguyên ngay cả khi trang được tải lại. Các hàm liên quan đến việc lưu trữ giỏ hàng được định nghĩa trong file Utility.js.
Công nghệ chính được sử dụng trong dự án này là React, một thư viện JavaScript phổ biến để xây dựng giao diện người dùng.
XEM THÊM ==> Hướng dẫn cài đặt chi tiết
Nguồn: Sharecode.vn
Để cài đặt dự án này, bạn cần thực hiện các bước sau:
-
tải xuống mã nguồn.
-
Mở Terminal hoặc Command Prompt và di chuyển đến thư mục dự án.
-
Chạy lệnh sau để cài đặt các gói phụ thuộc:
-
npm install
-
Sau khi cài đặt xong, bạn có thể chạy dự án bằng cách sử dụng lệnh sau:
Lệnh trên sẽ khởi chạy dự án trong chế độ phát triển. Mở
http://localhost:3000 để xem nó trong trình duyệt của bạn.
Nếu bạn muốn xây dựng dự án cho môi trường sản xuất, hãy sử dụng lệnh sau:
Lệnh trên sẽ xây dựng ứng dụng cho sản xuất vào thư mục build. Nó sẽ đúng gói React trong chế độ sản xuất và tối ưu hóa build để có hiệu suất tốt nhất.