Tìm hiểu spring boot, reactjs xây dựng website quản lý cửa hàng bán linh kiện điện tử

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH ĐỒ ÁN TỐT NGHIỆP NGÀNH CƠNG NGHỆ THƠNG TIN TÌM HIỂU SPRING BOOT, REACTJS XÂY DỰNG WEBSITE QUẢN LÝ CỬA HÀNG BÁN LINH KIỆN ĐIỆN TỬ GVHD: ThS NGUYỄN HỮU TRUNG SVTH : LƯƠNG BÍCH LONG NGUYỄN HỒNG QUÂN SKL011479 Tp Hồ Chí Minh, tháng 07/2023 TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP HỒ CHÍ MINH KHOA CƠNG NGHỆ THƠNG TIN BỘ MƠN CƠNG NGHỆ PHẦN MỀM LƯƠNG BÍCH LONG - 19110391 NGUYỄN HỒNG QUÂN – 19110444 TÌM HIỂU SPRING BOOT, REACTJS XÂY DỰNG WEBSITE QUẢN LÝ CỬA HÀNG BÁN LINH KIỆN ĐIỆN TỬ KHÓA LUẬN TỐT NGHIỆP KỸ SƯ CNTT GIÁO VIÊN HƯỚNG DẪN ThS NGUYỄN HỮU TRUNG KHÓA 2019 - 2023 TP Hồ Chí Minh, tháng năm 2023 ĐH SƯ PHẠM KỸ THUẬT TP.HCM CỘNG HÒA XHCN VIỆT NAM KHOA CÔNG NGHỆ THÔNG TIN Độc lập – Tự – Hạnh phúc ****** ****** PHIẾU NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN Họ tên Sinh viên 1: Lương Bích Long MSSV 1: 19110391 Họ tên Sinh viên 2: Nguyễn Hồng Quân MSSV 2: 19110444 Chuyên ngành: Cơng nghệ phần mềm Tên đề tài: Tìm hiểu Spring boot, ReactJS xây dựng website quản lý cửa hàng bán linh kiện điện tử Họ tên giảng viên hướng dẫn: ThS Nguyễn Hữu Trung NHẬN XÉT Về nội dung đề tài khối lượng thực hiện: Ưu điể m: Khuyết điểm: Đề nghị cho bảo vệ hay không? Đánh giá loại: Điểm: TP Hồ Chí Minh, tháng năm 2023 Giảng viên hướng dẫn (Ký & ghi rõ họ tên) ĐH SƯ PHẠM KỸ THUẬT TP.HCM CỘNG HÒA XHCN VIỆT NAM KHOA CÔNG NGHỆ THÔNG TIN Độc lập – Tự – Hạnh phúc ****** ****** PHIẾU NHẬN XÉT CỦA GIẢNG VIÊN PHẢN BIỆN Họ tên Sinh viên 1: Lương Bích Long MSSV 1: 19110391 Họ tên Sinh viên 2: Nguyễn Hồng Quân MSSV 2: 19110444 Chuyên ngành: Cơng nghệ phần mềm Tên đề tài: Tìm hiểu Spring boot, ReactJS xây dựng website quản lý cửa hàng bán linh kiện điện tử Họ tên giảng viên phản biện: ThS Nguyễn Minh Đạo NHẬN XÉT Về nội dung đề tài khối lượng thực hiện: Ưu điể m: Khuyết điểm: Đề nghị cho bảo vệ hay không? Đánh giá loại: Điểm: TP Hồ Chí Minh, tháng năm 2023 Giảng viên phản biện (Ký & ghi rõ họ tên) LỜI CẢM ƠN LỜI CẢM ƠN Lời mở đầu, nhóm chúng em xin phép gửi lời cảm ơn đến với Khoa Công Nghệ Thông Tin – Trường Đại Học Sư Phạm Kỹ Thuật Thành Phố Hồ Chí Minh tạo điều kiện cho nhóm chúng em học tập, phát triển tảng kiến thức thực đề tài lần Kế đến nhóm chúng em xin gửi đến thầy Nguyễn Hữu Trung lời cảm ơn sâu sắc thầy giúp đỡ nhận lời hướng dẫn nhóm chúng em thực luận Nhận đào tạo từ thầy cô Khoa Công Nghệ Thông Tin từ trước đến giúp cho chúng em tiếp thu thêm nhiều kiến thức, kinh nghiệm để thực luận văn tốt nghiệp, giúp ích nhiều cho công việc học vấn tương lai Đây hành trang vô lớn chúng em trước bước sống Tuy nhiên với khả chun mơn cịn nhiều hạn chế so với lượng kiến thức vơ tận, chúng em ln cố gắng để hồn thành cách tốt Vì việc xảy thiếu sót chúng em điều khó tránh khỏi trình học hỏi thực luận Chúng em hi vọng nhận thơng cảm góp ý tận tình, q báu q thầy (cơ) Thơng qua chúng em rút học kinh nghiệm, song với hồn thiện nâng cấp lại sản phẩm tốt Một lần chúng em xin gửi lời cảm ơn sâu sắc đến với thầy Nguyễn Hữu Trung tập thể quý thầy, cô Khoa Công Nghệ Thông Tin – Trường Đại Học Sư Phạm Kỹ Thuật Thành Phố Hồ Chí Minh tất điều thầy gửi gắm dạy chúng em Nhóm xin kính chúc thầy ln có sức khỏe thật tốt thành công sống ĐH SƯ PHẠM KỸ THUẬT TP.HCM CỘNG HÒA XHCN VIỆT NAM KHOA CÔNG NGHỆ THÔNG TIN Độc lập – Tự – Hạnh phúc ****** ****** ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP Họ tên sinh viên 1: Lương Bích Long Mã số sinh viên: 19110391 Họ tên sinh viên 2: Nguyễn Hồng Quân Mã số sinh viên: 19110444 Thời gian làm luận văn tốt nghiệp: Từ ngày 14/02/2023 đến ngày 10/7/2023 Chuyên ngành: Công nghệ phần mềm Tên đề tài: Tìm hiểu Spring boot, ReactJS xây dựng website quản lý cửa hàng bán linh kiện điện tử Giáo viên hướng dẫn: Th.S Nguyễn Hữu Trung Nhiệm vụ khóa luận tốt nghiệp: Lý thuyết: ● Spring, Spring boot, Spring Data JPA, Spring Security, REST API, ReactJS, React Native Thực hành: ● Sử dụng Spring Security JWT, Oauth2(Google) để xác thực người dùng ● Sử dụng Spring, Spring boot để cung cấp API ● Sử dụng Google Firebase để lưu trữ file ảnh user, sản phẩm ● Xây dựng sản phẩm đề tài theo kiến trúc RESTful Web Service ● Sử dụng MySQL lưu trữ database Spring Data JPA để tương tác với CSDL ● Xây dựng chức sau cho sản phẩm: o User Website, Mobile Application: ▪ Đăng nhập, đăng ký, đăng xuất tài khoản ▪ Quản lý tài khoản người dùng ▪ Kiểm tra tình trạng đơn hàng ▪ Tìm kiếm sản phẩm ▪ Hiển thị sản phẩm theo danh mục ▪ Cung cấp lịch sử mua hàng người dùng ▪ Cung cấp tính đánh giá sản phẩm cho người dùng ▪ Tích điểm để tăng cấp độ tài khoản người dùng o Administrator Website: ▪ Quản lý người dùng ▪ Quản lý đơn hàng, sản phẩm, … ▪ Thống kê lượng mua hàng sản phẩm Đề cương luận văn tốt nghiệp PHẦN MỞ ĐẦU Tính cấp thiết đề tài Mục đích đề tài Cách tiếp cận phương pháp nghiên cứu ● Đối tượng nghiên cứu ● Phạm vi nghiên cứu Phân tích cơng trình có liên quan Kết dự kiến đạt PHẦN NỘI DUNG Chương Cơ sở lý thuyết Chương Khảo sát, phân tích, thiết kế Chương Mơ hình hóa u cầu Chương Thiết kế phần mềm Chương Thiết kế giao diện xử lý Chương Cài đặt kiểm thử ứng dụng PHẦN KẾT LUẬN Những kết đạt Ưu điểm Nhược điểm Hướng phát triển TÀI LIỆU THAM KHẢO KẾ HOẠCH THỰC HIỆN STT Thời gian Công việc 14/02/2023– - Chỉnh sửa, mơ hình hố lại u cầu, thiết kế chỉnh 25/02/2023 26/02/2023– 12/03/2023 13/03/2023– 26/04/2023 27/04/2023 – Ghi sửa lại CSDL - Tìm hiểu thư viện React Native Javacript - Tìm hiểu Oauth2 để ứng dụng vào xác thực, VNPAY integration để toán - Tiến hành phát triển API dựa kiến thức tìm hiểu - Tiến hành xây dựng UI người dùng mobile - Thiết kế lại UI Admin 23/05/2023 24/05/2023– 05/06/2023 06/06/2023– - Xây dựng tính voucher giảm giá - Kết hợp phần xây dựng lại với : Giao diện, API - Sửa lỗi, hoàn thiện hệ thống Kiểm thử hệ thống 29/06/2023 30/06/2023– Hoàn thành luận 11/07/2023 Ý kiến giáo viên hướng dẫn Ngày tháng năm 2023 Người viết đề cương MỤC LỤC MỤC LỤC LỜI CẢM ƠN ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP DANH SÁCH HÌNH 13 DANH SÁCH BẢNG 16 PHẦN MỞ ĐẦU 18 TÍNH CẤP THIẾT CỦA ĐỀ TÀI 18 MỤC TIÊU ĐỀ TÀI 18 PHƯƠNG PHÁP THỰC HIỆN 18 PHẦN NỘI DUNG 20 CHƯƠNG CƠ SỞ LÝ THUYẾT 20 1.1 Spring 20 1.2 Spring boot 21 1.3 JWT (JSON Web Token) 22 1.4 React JS 24 1.5 React Native 25 CHƯƠNG KHẢO SÁT, PHÂN TÍCH, THIẾT KẾ 26 2.1 Phân tích trạng 26 2.2 Khảo sát số phần mềm 26 2.3 Phân tích yêu cầu dự án 38 2.4 Danh sách yêu cầu chức nghiệp vụ 38 2.5 Danh sách yêu cầu chức hệ thống 39 2.6 Danh sách yêu cầu phi chức 39 CHƯƠNG MÔ HÌNH HĨA U CẦU 40 MỤC LỤC 3.1 Lược đồ Usecase 40 CHƯƠNG THIẾT KẾ PHẦN MỀM 62 4.1 Lược đồ 62 4.2 Lược đồ ERD 74 CHƯƠNG THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ 75 5.1 Trang chủ (App Mobile) 75 5.2 Đăng nhập 78 5.3 Đăng ký 80 5.4 Sidebar 82 5.5 Màn hình mua sắm 84 5.6 Lọc sản phẩm 87 5.7 Chi tiết sản phẩm 89 5.8 Đánh giá sản phẩm 93 5.9 Giỏ hàng 95 5.10 Thông tin tài khoản 97 5.11 Địa 99 5.12 Thêm địa 101 5.13 Chỉnh sửa địa 103 5.14 Voucher 105 5.15 Voucher 107 5.16 Đơn hàng 109 5.17 Chi tiết đơn hàng 111 5.18 Tạo đơn hàng 113 5.19 Home (Website) 115 5.20 Đăng nhập (Website) 118 10