Công nghệ:
React: Là thư viện JavaScript để xây dựng giao diện người dùng, dự án sử dụng React cho việc phát triển các thành phần giao diện.
React Router: Được sử dụng để xử lý định tuyến trong ứng dụng SPA (Single Page Application).
Styled Components: Thư viện cho phép viết CSS trong JavaScript, được sử dụng để tạo ra các thành phần có style độc lập.
Font Awesome: Thư viện icon được sử dụng để thêm các biểu tượng đẹp mắt vào giao diện người dùng.
Vite: Công cụ build hiện đại giúp tăng tốc độ phát triển ứng dụng.
Chức năng:
Trang chủ (HomePage): Hiển thị danh sách sản phẩm và thanh tìm kiếm lookahead.
Trang sản phẩm (ProductPage): Hiển thị thông tin chi tiết của một sản phẩm, lấy từ API.
Giỏ hàng (CartPage): Cho phép người dùng thêm sản phẩm vào giỏ hàng và xem các sản phẩm đã thêm.
Trang thanh toán (CheckoutPage) và Trang thành công (CheckoutSuccessPage): Quy trình thanh toán và hiển thị thông báo thành công sau khi hoàn tất.
Trang liên hệ (ContactPage): Có form liên hệ với validation đúng đắn.
Biểu tượng giỏ hàng: Hiển thị số lượng sản phẩm trong giỏ hàng.
Nhanh
XEM THÊM ==> Hướng dẫn cài đặt chi tiết
Nguồn: Sharecode.vn
Cài đặt các dependencies: Mở terminal hoặc command prompt, di chuyển đến thư mục gốc của dự án, sau đó chạy lệnh sau để cài đặt các dependencies được liệt kê trong file package.json:
npm install
Chạy dự án: Sau khi các dependencies đã được cài đặt, bạn có thể chạy dự án trên môi trường phát triển bằng cách sử dụng lệnh:
npm run dev
Lệnh này sẽ khởi động một máy chủ phát triển và mở dự án trong trình duyệt mặc định của bạn.
Xây dựng dự án cho môi trường sản xuất: Khi bạn đã sẵn sàng để triển khai dự án, bạn có thể xây dựng một phiên bản tối ưu hóa cho môi trường sản xuất bằng cách chạy lệnh: