MINISTRY OF EDUCATION AND TRAINING HO CHI MINH CITY UNIVERSITY OF TECHNOLOGY AND EDUCATION GRADUATION THESIS INFORMATION TECHNOLOGY BUILDING AN E-COMMERCE SYSTEM FOR FASHION STORES INSTRUCTOR: MSc. NGUYEN TRAN THI VAN STUDENT: PHAM HOANG PHUC SKL013490 Ho Chi Minh City, June 2020 i HO CHI MINH UNIVERSITY OF TECHNOLOGY AND EDUCATION FACULTY OF INTERNATIONAL EDUCATION ------------- --------------- CAPSTONE PROJECT BUILDING AN E-COMMERCE SYSTEM FOR FASHION STORES Students: Phạm Hoàng Phúc 19110147 Instructor: Nguyễn Trần Thi Văn, MSc. Ho Chi Minh City, June 20 SOCIALIST REPUBLIC OF VIETNAM Independence - Freedom – Happiness ******* Ho Chi Minh City, February 27th, 2024 CAPSTONE PROJECT OBJECTIVES Student’s name: 1. Phạm Hoàng Phúc ID: 19110147 Class: 19110CLA1 Major: Information technology Instructor: Nguyễn Trần Thi Văn, MSc.
Date of assignment: February 25,2024 Date of submission: June 17,2024 1- Project title: building an e-commerce system for fashion stores 2- Initial materials provided by supervisor: None 3- Contents of the project: Theory: - Reactjs - Java Spring Boot - Flutter - Bootstrap - MySQL Practice: Building an e-commerce website and a mobile app for selling clothes combined with a recommender system are the main features: - Enable website admins to oversee accounts, orders, products, and categories efficiently. - Empower website admins to perform CRUD operations on product and category information. - Enable website admins to review and modify order statuses for new orders. - Provide customers with the ability to search and view product details.
- Allow customers to comment, rate products, select color/size/quantity, manage their cart, and complete orders with payment options (pay later and online). - Notify users about orders to help customers keep in track of their order process and to help the admin know customer's actions on order 4- Final products: An e-commerce website and a mobile app for selling clothing products. HEAD OF INFORMATION TECHNOLOGY INSTRUCTOR PROGRAM (Sign with full name) (Sign with full name) Nguyễn Trần Thi Văn SOCIALIST REPUBLIC OF VIETNAM Independence - Freedom – Happiness ******* INSTRUCTOR’S EVALUATION SHEET Student’s name: 1. Phạm Hoàng Phúc ID: 19110147 Class: 19110CLA1 Major: Information technology Project title: building an e-commerce system for fashion stores Instructor: Nguyễn Trần Thi Văn, MSc.
Content of project:. Approval for oral defense? (Approved or denied) .) Ho Chi Minh City, June, 2024 INSTRUCTOR (Sign with full name) SOCIALIST REPUBLIC OF VIETNAM Independence - Freedom – Happiness ******* REVIEWER’S EVALUATION SHEET Student’s name: 1. Phạm Hoàng Phúc ID: 19110147 Class: 19110CLA1 Major: Information technology Project title: building an e-commerce system for fashion stores Reviewer: Lê Vĩnh Thịnh, PhD. Content and workload of the project:.
Approval for oral defense? (Approved or denied) .) Ho Chi Minh City, June, 2024 REVIEWER (Sign with full name) ACKNOWLEDGEMENTS We would want to express our appreciation to the instructor, MSc Nguyen Tran Thi Van, who worked closely with us to develop a project that enabled us to successfully finish our report. Throughout this course, you have constantly assisted us with our difficulties in the study process as well as provided us with excellent feedback and recommendations to help us grow as developers in the future. As a result, you have become our inspiration for this final project, and we would like to express our gratitude for the opportunity to learn from you in this course. Everyone on our team has various talents, and we have discovered our shortcomings in each other over this final assignment, but we've all managed to face this challenge as a team.
As a result, everyone on our team is really grateful for the opportunity to collaborate. We now have all we need to learn about this subject and do well in it. Additionally, we want to thank our classmates for supplying us with a plethora of knowledge and pertinent facts that helped us to strengthen our thesis. We finished the subject and report in a short measure of time, with restricted information and numerous different limitations regarding philosophies and skill with programming execution.
As a consequence of this, there will undoubtedly be flaws in the process of creating the topic; consequently, we eagerly await your significant feedback so that we can increase the number of our experts and perform better the following time. This capstone project is the result of our tireless efforts throughout the semester. Because we are still novices, we are aware that our design has numerous shortcomings. We welcome any feedback as well as suggestions for improving our project.
We appreciate it. Sincerely! Ho Chi Minh City, June 2024 Phạm Hoàng Phúc 19110147 VIII TABLE OF CONTENTS CHAPTER 1: INTRODUCTION. Reason for choosing the topic. Purpose of project.
2 CHAPTER 02: THEORETICAL BASIS. Java spring boot. Client-Server model. Client-Server model.
21 CHAPTER 03: SYSTEM REQUIREMENTS CAPTURING AND MODELLING 3. Surveys on consumer demand. Surveys on e-commerce websites. Non-Functional requirements.
Specifications of main usecases. 35 CHAPTER 04: SYSTEM DESIGN. Filter cart items. Add or edit product.
Add third-party delivery order (GHN). Manage customer account. Database table details. User interface design.
106 CHAPTER 05: IMPLEMENTATION AND TESTING. Project file structure. Knowledge and skills. Strengths and drawbacks.
129 XI LIST OF FIGURES Figure 1.10 Figure 5: Spring boot. 11 Figure 6: Client-Server model. 18 Figure 8: Client-Server model. 20 Figure 10: Machine Learning.
21 Figure 11: Block Diagram of flow 1 .23 Figure 12: Block Diagram of flow 2 .23 Figure 13: Block Diagram of flow 3 .23 Figure 14: ResNet50 Model Architecture. 24 Figure 8: Vietnam B2C e-commerce revenue in 2017-2022 .25 Figure 9: Shopee website. 26 Figure 10: Lazada website. 26 Figure 11: Amazon website .27 Figure 12: Tiktok shop .28 Figure 13: Fashion Store System Usecase Diagram.
32 Figure 14: Guest Usecase Diagram .33 Figure 15: Admin Usecase Diagram .34 Figure 16: Customer Usecase Diagram .35 Figure 17: Login sequence. 47 Figure 18: Register sequence. 47 Figure 23: Filter cart items sequence .48 Figure 25: Checkout sequence diagrams. 48 Figure 27: Search product sequence .49 XII Figure 30: Comment product sequence .49 Figure 31: Add or edit product .50 Figure 32: Accept/Decline order (admin) sequence.
50 Figure 33: Add third-party delivery order (GHN) sequence diagram. 51 Figure 34: Manage customer account sequence diagram .52 Figure 36: Website interface. 65 Figure 37: Mobile app interface. 66 Figure 38: Register Page.
67 Figure 39: Register mobile interface .68 Figure 40: Reset password page. 69 Figure 41: Login Page. 70 Figure 42: Login mobile interface .71 Figure 43: Customer's homepage .72 Figure 44: Customer’s homepage mobile interface. 74 Figure 45: Product homepage interface .75 Figure 46: Translate language interface .76 Figure 47: Product Detail Page.
77 Figure 48: Product Detail Page mobile interface. 79 Figure 49: Rating product interface .80 Figure 50: User comment interface .82 Figure 52: Related products interface .84 Figure 53: Clothing page. 85 Figure 54: Clothing page mobile interface. 87 Figure 55: Filter interface .88 Figure 56: Cart page.
89 Figure 57: Cart page mobile interface .91 Figure 58: Location selects interface .92 Figure 59: Location selects mobile interface .93 Figure 60: Place order interface. 95 Figure 61: Place order mobile interface.96 XIII Figure 62: Profile details page. 99 Figure 63: Edit profile page. 100 Figure 64: Purchase history page.
101 Figure 65: Purchase history mobile interface. 103 Figure 66: Purchase detail interface. 104 Figure 67: Purchase detail mobile interface. 105 Figure 68: Admin login page.
106 Figure 69: Customer management page. 107 Figure 70: Information detail page. 108 Figure 71: Customer product page. 110 Figure 72: Add product page.
111 Figure 73: Product detail page. 112 Figure 74: Invoice page. 113 Figure 75: Invoice detail page. 115 Figure 76: MySQL Database.
116 Figure 77: Code Environment. 117 Figure 79: Spring boot. 117 Figure 81: Back-end file structure. 118 Figure 82: Mobile file structure.
119 Figure 83: Recommendation system file structure. 119 Figure 84: Front-end file structure. 121 Figure 86: Add to cart successful. 121 Figure 87: Filter product.
122 Figure 88: Product detail and add to cart. 122 Figure 89: Cart page and choose product for checkout. 122 Figure 90: Check out. 123 Figure 92: Product detail and add to cart.
123 Figure 93: Check out and choose method. 124 XIV XV LIST OF TABLES Table 1.6 Table 3: Advantages and Disadvantages of Shopee and Lazada. 27 Table 4: Advantages and Disadvantages of Amazon .29 Table 6: System's Operations. 30 Table 7: Modeling requirement.
31 Table 8: Login usecase specification .36 Table 9: Register usecase specification .37 Table 14: Filter cart item usecase specification. 38 Table 16: Choose from cart to buy usecase specification .39 Table 18: Search product usecase specification. 40 Table 20: Comment product usecase specification. 41 Table 21: Add product usecase specification.
42 Table 22: Accept/Decline order (admin) usecase specification. 44 Table 23: Manage customer account usecase specification .45 Table 24: Create new shipping order specification. 46 Table 25: login_accounts table. 53 Table 26: staffs table.
54 Table 27: notification table. 55 Table 28: device_fcm_token table.55 Table 29: product_import_manager table. 56 Table 30: product_management table.57 Table 31: cart table. 57 Table 32: customers table.
58 Table 33: invoice table .59 Table 34: delivery table .60 Table 35: online_payment_accounts table. 60 Table 36: invoice_with_product table .61 XVI Table 37: comments table. 62 Table 38: comment_like table .62 Table 39: products table. 63 Table 40: product_images_management table.
63 Table 41: catalogs_with_products table .64 Table 42: catalog table. Register Page Object. 68 Table 44: Register mobile interface object. 69 Table 45: Reset password page object .70 Table 46: Login page object.
71 Table 47: Login mobile interface object .72 Table 48: Customer's homepage Object .73 Table 49: Customer’s homepage mobile interface object .75 Table 50: Product homepage interface object. 76 Table 51: Translate language interface object. 77 Table 52: Product Detail Page Object .78 Table 53: Product Detail Page mobile interface object .80 Table 54: Rating product interface object. 81 Table 55: User comment interface object.
83 Table 56: User comment mobile interface object. 84 Table 57: Related products interface object. 85 Table 58: Clothing page object. 86 Table 59: Clothing page mobile interface object.
88 Table 60: Filter interface object. 89 Table 61: Cart page object .90 Table 62: Cart page mobile interface object .92 Table 63: Location selects interface object. 93 Table 64: Location selects mobile interface object. 94 Table 65: Place order interface object .96 Table 66: Place order mobile interface object.
97 Table 67: Confirm payment interface object. 98 XVII Table 68: Confirm payment mobile interface object. 98 Table 69: Profile details page object .99 Table 70: Edit profile page object. 101 Table 71: Purchase history page object.
102 Table 72: Purchase history mobile interface object. 104 Table 73: Purchase detail interface object. 105 Table 74: Purchase detail mobile interface object. 106 Table 75: Admin login page object.
107 Table 76: Customer management page object. 108 Table 77: Information detail page object. 109 Table 78: Customer product page object. 110 Table 79: Add product page object.
112 Table 80: Product detail page object. 113 Table 81: Invoice page object. 114 Table 82: Invoice detail page object. 120 XVIII CHAPTER 01: INTRODUCTION CHAPTER 01: INTRODUCTION 1.
Reason for choosing the topic In today's digital age, the online fashion industry has seen remarkable growth due to the expansion of digital channels, greater mobile access, and ongoing technological advancements.