Building a booking event website applying to reactjs and spring boot

MINISTRY OF EDUCATION AND TRAINING HO CHI MINH CITY UNIVERSITY OF TECHNOLOGY AND EDUCATION FACULTY FOR HIGH QUALITY TRAINING GRADUATION THESIS INFORMATION TECHNOLOGY BUILDING A BOOKING EVENT WEBSITE APPLYING TO REACTJS AND SPRING BOOT ADVISOR : Ph.D LÊ VĂN VINH STUDENTS: NGUYỄN QUỐC LONG CHU NGUYỄN ANH TUẤN SKL010271 Ho Chi Minh City, June 2023 Ministry of Education and Training HO CHI MINH UNIVERSITY OF TECHNOLOGY AND EDUCATION FACULTY FOR HIGH QUALITY TRAINING GRADUATE THESIS ON BUILDING A BOOKING EVENT WEBSITE APPLYING TO REACTJS AND SPRING BOOT Lê Văn Vinh, Ph.D Advisor : Student name : Nguyễn Quốc Long : 18110150 Chu Nguyễn Anh Tuấn : 19110308 TP Hồ Chí Minh – 06/2023 HO CHI MINH UNIVERSITY OF TECHNOLOGY AND EDUCATION FACULTY FOR HIGH QUALITY TRAINING SUMMARY OF GRADUATE THESIS Student Name 1: Nguyễn Quốc Long Student ID 1: 18110150 Student Name 2: Chu Nguyễn Anh Tuấn Student ID 2: 19110308 The research was conducted from February 20, 2023, to May 28, 2023 Major: Software Engineer Topic name: Building a booking event website applying to ReactJS, Spring Boot Name of advisor: PhD Lê Văn Vinh MISSION OF GRADUATE THESIS Theory - Research technologies such as ReactJS, Spring Boot, JSON Web Token and Redux - Research payment methods such as VNPay, Paypal Practice - Applying Spring Boot to build Back-end aspects Implement API for modules of the system - Applying JSON Web Token to encode data and authentication - Applying Mongodb to store data - Applying ReactJS to design interface for Front-end aspect ĐH SƯ PHẠM KỸ THUẬT TP.HCM KHOA ĐÀO TẠO CLC SOCIALIST REPUBLIC OF VIETNAM Independence - Freedom - Happiness ****** ****** COMMENTARY OF INSTRUCTOR Student Name 1: Nguyễn Quốc Long Student ID 1: 18110150 Student Name 2: Chu Nguyễn Anh Tuấn Student ID 2: 19110308 Major: Software Engineer Topic name: Building a booking event website applying to ReactJS, Spring Boot Name of instructor: PhD Lê Văn Vinh COMMENTARY Content of Topic and workload done Advantages: Disadvantages: Recommend for upholding a thesis or not ? Rating type Mark Hồ Chí Minh, ngày tháng năm 2023 INSTRUCTOR (Name and signature) ĐH SƯ PHẠM KỸ THUẬT TP.HCM KHOA ĐÀO TẠO CLC ****** SOCIALIST REPUBLIC OF VIETNAM Independence - Freedom - Happiness ****** COMMENTARY OF CRITICAL LECTURER Student Name 1: Nguyễn Quốc Long Student ID 1: 18110150 Student Name 2: Chu Nguyễn Anh Tuấn Student ID 2: 19110308 Major: Software Engineer Topic name: Building a booking event website applying to ReactJS, Spring Boot Name of Critical lecturer: Lê Thị Minh Châu COMMENTARY Content of Topic and workload done Advantages: Disadvantages: Recommend for upholding a thesis or not ? Rating type Mark Tp Hồ Chí Minh, ngày tháng năm 2023 CRITICAL LECTURER (Name and signature) ACKNOWLEDGEMENT First of all, We would like to send our sincere thanks to the Faculty of High-Quality Training - Ho Chi Minh City University of Technology and Education for creating conditions for our group to cultivate and develop a solid knowledge understanding to carry out this topic On top of that, we would like to thank Mr Le Van Vinh for the most sincere appreciation He dedicated to enthusiastically instructing and giving valuable suggestions to our group throughout the process from the beginning to the end of this thesis Thanks to a solid foundation of specialized knowledge in addition to practical experiences and requirements in the hands-on projects through studying at school and doing internships in companies The collective of teachers of the Faculty of CLC Training and especially Mr Le Van Vinh have brought us a huge amount of knowledge and experience in the technical field and future work Especially, this helped and motivated us to complete the thesis This will absolutely be a huge benefit for us for technical expertise On the one hand, due to the time limit, we did our utmost to finish on time and complete with targets which are as much as possible with our knowledge However, mistakes are inevitable We hope to receive your enthusiastic comments in order to ameliorate our project better, learn experience and improve our products in the best way possible We sincerely thank you! Nhóm thực Nguyễn Quốc Long – 18110150 Chu Nguyễn Anh Tuấn - 19110308 Graduate Thesis TABLE OF CONTENT LIST OF FIGURES .6 LIST OF TABLES INTRODUCTION 11 The urgency of project 11 Research objects 11 Research scope 12 Project objectives 12 Delimitations 12 CHAPTER 1: FUNDAMENTALS .13 1.1 Front-end side 13 1.1.1 React 13 1.1.2 Redux 16 1.1.3 React-Query .19 1.1.4 Other supporting Front-end libraries 21 1.2 Back-end side 22 1.2.1 Spring boot 22 1.2.2 JSON Web Token 24 1.2.3 Mongodb .26 CHAPTER 2: SURVEY AND USER REQUIREMENTS 30 2.1 Survey 30 2.2 Determine requirements 33 2.2.1 Functional requirements .33 2.2.2 Nonfunctional requirements .34 Graduate Thesis 2.3 Requirement modeling 35 2.3.1 Use case diagram .35 2.3.2 Use Case Specification 36 2.3.3 User requirement 60 CHAPTER 3: SYSTEM DESIGN .64 3.1 Class diagram 64 3.2 Database design 65 3.3 Sequence diagram 75 3.3.1 Login 75 3.3.2 Login with google account 76 3.3.3 Search Event 77 3.3.4 Search Event by filter 78 3.3.5 View detailed event 79 3.3.6 Register 80 3.3.7 Register for organizer 81 3.3.8 Log out 82 3.3.9 View Order History .83 3.3.10 Check - out 84 3.3.11 Change password .85 3.3.12 Forgot password .86 3.3.13 Update Avatar 87 3.3.14 Update Profile 88 3.3.15 Add favourite event 89 3.3.16 Delete a favourite event .90 3.3.17 Delete all favourite events 91 3.3.18 View favourite event list 92 Graduate Thesis 3.3.19 View Customer Account 93 3.3.20 Update Organizer Profile 94 3.3.21 View Category 95 3.3.22 View Customer list by order .96 3.3.23 View Customer list by Account 97 3.3.24 Create event 98 3.3.25 Delete event 99 3.3.26 View created event 100 3.3.27 Update Event 101 3.3.28 View Organizer Account 102 3.3.29 Refuse pending form 103 3.3.30 Approve Pending form 104 3.3.31 View all feedback .105 3.3.32 Post feedback 105 3.3.33 Delete feedback 106 3.3.34 Follow organizer 107 3.3.35 Export orders to Excel 108 3.3.36 Export events to Excel .109 3.3.37 Export accounts to Excel 110 3.3.38 View Statistics for organizer 111 3.3.39 View Statistics for admin 112 3.4 User Interface design 113 3.4.1 User Interface for Guest .113 3.4.2 User Interface for Customer 129 3.4.3 User Interface for Organizer 136 3.4.4 User Interface for Admin .148 Graduate Thesis CHAPTER 4: IMPLEMENTATION AND TESTING .153 4.1 Implementation 153 4.2 Testing 154 4.2.1 Testing scope 154 4.2.2 Testing process 155 4.2.3 Testing result 156 CHAPTER 5: CONCLUSION 160 5.1 Expected Results .160 5.1.1 Theories 160 5.1.2 Practices 160 5.2 Strengths 161 5.3 Drawbacks .161 5.4 Future works 161 REFERENCE .162