Công nghệ:
React: Một thư viện JavaScript để xây dựng giao diện người dùng. Dự án sử dụng React (react) và ReactDOM (react-dom) để xây dựng các thành phần giao diện.
Redux: Một thư viện JavaScript dùng để quản lý trạng thái ứng dụng. Dự án sử dụng Redux (redux) và React-Redux (react-redux) để quản lý trạng thái toàn cục.
React Router: Dùng để xử lý định tuyến trong ứng dụng React. Dự án sử dụng React Router (react-router-dom) để quản lý định tuyến.
Slick Carousel: Một thư viện jQuery dùng để tạo carousel. Dự án sử dụng React Slick (react-slick) để tạo các carousel hiển thị sản phẩm.
Tailwind CSS: Một framework CSS dùng để xây dựng giao diện nhanh chóng và linh hoạt. Dự án sử dụng Tailwind CSS (tailwindcss) để thiết kế giao diện.
Chức năng:
Hiển thị sản phẩm: Dự án có chức năng hiển thị các sản phẩm, bao gồm cả sản phẩm phổ biến thông qua thành phần Popular.
Quản lý giỏ hàng: Thành phần AddToChart cho phép người dùng thêm sản phẩm vào giỏ hàng.
Định tuyến và điều hướng: Sử dụng React Router (BrowserRouter) để quản lý định tuyến và điều hướng trong ứng dụng.
Quản lý trạng thái ứng dụng: Sử dụng Redux để quản lý trạng thái toàn cục của ứng dụng, bao gồm trạng thái của giỏ hàng và sản phẩm.
Responsive Design: Sử dụng Tailwind CSS để thiết kế giao diện phản hồi, tương thích với nhiều kích thước màn hình và thiết bị.
XEM THÊM ==> Hướng dẫn cài đặt chi tiết
HƯỚNG DẪN CÀI ĐẶT
Để cài đặt dự án này, bạn cần thực hiện các bước sau trong terminal hoặc command prompt:
Đảm bảo bạn đã cài đặt Node.js và npm. Bạn có thể kiểm tra bằng cách chạy node -v và npm -v trong terminal để xem phiên bản đã cài đặt.
Mở terminal hoặc command prompt và di chuyển đến thư mục dự án bằng lệnh cd
npm install
Sau khi hoàn tất, bạn đã sẵn sàng để phát triển dự án. Để bắt đầu máy chủ phát triển và xem dự án trong trình duyệt, bạn có thể sử dụng lệnh:
npm start
Nguồn: Topcode.vn