Ứng dụng Spring boot, Reactjs trong phát triển website quản lý cửa hàng bán linh kiện điện tử

MỤC TIÊU ĐỀ TÀI

● Xây dựng app mobile cho người dùng có thể mua linh kiện máy tính online. ● Vận dụng thành các công công nghệ mới, ngôn ngữ lập trình hiện đại vào để. ● Tìm hiểu và vận dụng thành công Spring, Spring boot, ReactJS và React Native vào đề tài.

PHƯƠNG PHÁP THỰC HIỆN

● Tìm hiểu và sử dụng Postman để thuận tiện cho việc code riêng biệt Frontend và Backen.

CƠ SỞ LÝ THUYẾT 1.1. Spring

• Spring boot
• JWT (JSON Web Token) 1. Khái niệm
• React JS 1. Giới thiệu
• React Native 1. Giới thiệu

Ngoài ra còn rất nhiều các tính năng tương tự khác của Spring Boot như: Developing web Applications, Working with SQL Technologies, Security, Messaging, Caching, Calling rest Services with RestTemplate/WebClient, Sending Email, Validation,…. Hy vọng với những thông tin chia sẻ ở trên, các bạn đã hiểu hơn về Spring Boot là gì, có nên sử dụng Spring Boot hay không và nên tìm hiểu những kiến thức gì để vận dụng Spring Boot được tốt nhất. JSON Web Token (JWT) là một tiêu chuẩn mở (RFC 7519) định nghĩa một phương thức nhỏ gọn và khép kín, là một phương tiện đại diện cho các yêu cầu chuyển giao giữa hai bên client - server dưới dạng một JSON.

Header sẽ chứa kiểu dữ liệu và thuật toán sửa dụng để mã hóa ra chuỗi JWT bao gồm 2 thành phần: loại token (mặc định là JWT) và thuật toán sử dụng để mã hóa như HMAC hoặc RSA. Registered claims: Một tập hợp các nội dung thông tin đã được quy định sẵn, chúng không bắt buộc nhưng tùy vào các ứng dụng thực hiện thì khuyến khích sử dụng để tạo ra các điều kiện bắt buộc đối với những thông tin cần thiết. Nếu thông tin đã bị ai đó cố ý thay đổi trong phần header hoặc payload và gửi mạo danh đến server (nơi tạo và ký token) thì quá trình xác nhận thông tin sẽ không hợp lệ.

ReactJS ra mắt vào năm 2013, là một mã nguồn mở được phát triển bởi Facebook, bản thân nó được biết đến là một thư viện Javascript dùng để xây dựng các giao diện người dùng hay UI một cách dễ dàng và tiện lợi. Dễtiếp cận đối với người đã kiến thức lập trình căn bản vềJavascript Do react native cung cấp môṭcấu trúc dựa trên component, tức là các component là những mảnh ghép được ghép laịthành môṭứng dụng.

KHẢO SÁT, PHÂN TÍCH, THIẾT KẾ

• Khảo sát một số phần mềm 1. GearVN

- Hiển thị đầy đủ, chi tiết hình ảnh và - UI/UX chưa được bắt mắt người thông số của các sản phẩm dùng cho lắm. - Có tính năng tích lũy điểm mua hàng - Quản lý địa chỉ còn hạn chế Mặt hàng đa dạng - Quản lý thông tin cá nhân còn đơn. Xây dựng ứng dụng để bán các linh kiện máy tính cho phép người dùng thực hiện lựa chọn, đặt hàng và thanh toán đơn hàng.

Bên cạnh đó là website để quản trị hệ thống bằng quyền Quản trị viên. - Quản lý giỏ hàng - Xem lịch sử mua hàng - Thanh toán đơn hàng - Đánh giá sản phẩm Quản trị viên. Danh sách yêu cầu chức năng hệ thống - Thống kê lượt mua của từng sản phẩm - Thêm, xóa, cập nhật sản phẩm.

Mễ HèNH HểA YấU CẦU 3.1. Lược đồ Usecase

THIẾT KẾ PHẦN MỀM 4.1. Lược đồ tuần tự

CÀI ĐẶT VÀ KIỂM THỬ ỨNG DỤNG 6.1. Cài đặt

• Kiểm thử ứng dụng

● Tiến hành tải và giải nén Source code Front-end của trang người dùng và trang quản trị Admin. ● Tiến hành mở source code Front-End bằng phần mềm Visual Studio Code bằng lệnh “Add Folder to Workspace…”, chọn thư mục chứa Source Code. ● Tiến hành mở source code Front-End bằng phần mềm Visual Studio Code bằng lệnh “Add Folder to Workspace…”, chọn thư mục chứa Source Code.

2 Thay đổi số lượng sản Số lượng sản phẩm trong giỏ hàng thay Pass phẩm trong giỏ hàng đổi tương ứng. 4 Duyệt đơn hàng Duyệt thành công, xuất hiện đơn hàng ở Pass trang danh sách đơn hàng của Shipper. 5 Người giao hàng nhận trang Danh sách đơn hàng đang giao ở Pass đơn hàng cả giao diện người dùng, admin và.

● Phát triển phần mềm bằng ReactJS để viết các thiết kế phía giao diện Front- end cho trang web. ● Học được thêm cách để triển khai server, web app lên các công cụ khác nhau để người dùng có thể sử dụng. ● Kỹ năng quản lý thời gian để thực hiện đúng tiến độ mà không bị ảnh hưởng bởi nhiều yếu tố khác nhau.

● Các hệ thống được triển khai giúp người dùng có thể dễ dàng sử dụng mà không cần phải cài đặt phức tạp. ● Hệ thống UI được viết bằng ReactJS, React Native hiện đang rất phổ biến, nhiều tài liệu tham khảo. ● Dễ dàng tiếp cận và phát triển phần mềm do Spring boot, ReactJS và React Native hiện tại đang rất phổ biến, thế nên dễ dàng có được nhiều nguồn tài liệu tham khảo phong phú.

● Việc tương tác với Facebook để tiến hành xác thực OAuth và tích hợp train model AI vào trong project. ● Kinh nghiệm và kỹ năng của nhóm còn nhiều thiếu sót và quá non trẻ cũng dẫn đến không ít khó khăn để giải quyết các vấn đề cũng như giải quyết có thể chưa đủ hợp lý. ● Bổ sung các chức năng vẫn chưa hoàn tất và phát triển các tiện ích để tăng trải nghiệm và hiệu suất cho người dùng.