Developing a website for selling cosmetics

MINISTRY OF EDUCATION AND TRAINING HO CHI MINH CITY UNIVERSITY OF TECHNOLOGY AND EDUCATION CAPSTONE PROJECT INFORMATION TECHNOLOGY DEVELOPING A WEBSITE FOR SELLING COSMETICS INSTRUCTOR: DR LÊ VĂN VINH STUDENT: NGUYEN HOANG DANH DO NGUYEN HOANG HAI S K L0 Ho Chi Minh City, July, 2021 HO CHI MINH UNIVERSITY OF TECHNOLOGY AND EDUCATION FACULTY FOR HIGH QUALITY TRAINING GRADUATE THESIS OF INFORMATION TECHNOLOGY ENGINEER DEVELOPING A WEBSITE FOR SELLING COSMETICS STUDENT NAME: NGUYỄN HOÀNG DANH STUDENT ID: 17110009 MAJOR: INFORMATION TECHNOLOGY SCHOOL YEAR: 2017-2021 STUDENT NAME: ĐỖ NGUYỄN HOÀNG HẢI STUDENT ID: 17110024 MAJOR: INFORMATION TECHNOLOGY SCHOOL YEAR: 2017-2021 ADVISOR: DR LÊ VĂN VINH Ho Chi Minh city, July 19th, 2021 i SOCIALIST REPUBLIC OF VIETNAM Independence – Freedom - Happiness *** PROJECT OF DUTY Name of student: Nguyễn Hoàng Danh Student ID: 17110009 Name of student: Đỗ Nguyễn Hoàng Hải Student ID: 17110024 Major: Information Technology Topic name: Developing a website for selling cosmetics Advisor: Dr Lê Văn Vinh Content: Theory: - Survey the current state of demand - Explore related systems as well as system operations Practice: Apply to develop a website for selling cosmetics Execution time from 02/03/2021 to 20/07/2021 Ho Chi Minh, July 19th 2021 HEAD OF INFORMATION TECHNOLOGY ADVISOR (Name and signature) (Name and signature) ii SOCIALIST REPUBLIC OF VIETNAM Independence – Freedom - Happiness *** COMMENTARY OF ADVISOR Student name: Đỗ Nguyễn Hoàng Hải Student ID: Nguyễn Hoàng Danh 17110024 17110009 Major: Information Technology Topic name: Developing a website for selling cosmetics Name of advisor: Dr Le Van Vinh COMMENTARY On content of topic & workload done: Advantage: Disadvantage: 10 Recommend for defense or not? 11 Rating type: 12 Mark: (By word: ) Ho Chi Minh, ……………………………… 2021 ADVISOR (Name and signature) iii SOCIALIST REPUBLIC OF VIETNAM Independence – Freedom - Happiness *** COMMENTARY OF REVIEWER Student name: Đỗ Nguyễn Hoàng Hải Student ID: Nguyễn Hoàng Danh 17110024 17110009 Major: Information Technology Topic name: Developing a website for selling cosmetics Name of reviewer: Ms Nguyễn Thị Minh Châu COMMENTARY 13 On content of topic & workload done: 14 Advantage: 15 Disadvantage: 16 Recommend for defense or not? 17 Rating type: 18 Mark: (By word: ) Ho Chi Minh, ……………………………… 2021 REVIEWER (Name and signature) iv THANK YOU The project team would like to express our sincere thanks to Mr Le Van Vinh - a teacher of Information Technology Faculty of Ho Chi Minh City University of Technical and Education, who helped us a lot in choosing topics and guiding, implement, comment, provide references in the process of implementing the topic Mobile music applications Due to limited time, knowledge is still limited so the project implementation certainly not avoid certain shortcomings Our team is looking forward to receiving the comments from teachers and students to improve the topic Sincerely thanks! Best regards! v TABLE OF CONTENT GRADUATE THESIS OF INFORMATION TECHNOLOGY ENGINEER i PROJECT OF DUTY ii COMMENTARY OF ADVISOR iii COMMENTARY OF REVIEWER iv THANK YOU v TABLE OF CONTENT vi IMAGE CATALOG ix TABLE CATALOG xii CHAPTER 1: 1.1 INTRODUCTION THE URGENCY AND OBJECTIVES OF PROJECT: 1.1.1 The urgency of project: 1.1.2 Project objectives: 1.2 OBJECTS, SCOPE AND METHODS OF RESEARCH: 1.2.1 Research objects: 1.2.2 Research scope: 1.3 EXPECTED RESULTS: 1.4 RELATED WORK: 1.4.1 DHC Vietnam 1.4.2 Lixibox CHAPTER 2: 2.1 USER REQUIREMENTS AND USED TECHNOLOGIES USER REQUIREMENTS: 2.1.1 Actor of system: 2.1.2 Main functions: 2.1.3 Document Management System: 2.1.4 Use case: 10 2.1.5 Scenarios: 12 2.1.6 Non-functional Requirement: 19 2.2 USED TECHNOLOGIES: 20 2.2.1 CHAPTER 3: 3.1 Overview of HTML, CSS, PHP: 20 SYSTEM DESIGN 23 ENTITY RELATIONSHIP DIAGRAM: 23 vi 3.2 SEQUENCE DIAGRAM: 24 3.2.1 User Login: 24 3.2.2 User Register: 25 3.2.3 Login with Google: 26 3.2.4 Login with Facebook: 27 3.2.5 View Product List: 28 3.2.6 Search Product: 29 3.2.7 Manage Cart: 30 3.2.8 Procced to Order: 31 3.2.9 User Comment: 32 3.2.10 Add Category: 33 3.2.11 Add Role 34 3.2.12 Delete Order: 35 3.2.13 Search Order: 36 3.2.14 Active Manager: 37 3.2.15 View product by Category: 38 3.3 DATABASE DESIGN: 39 3.3.1 Database diagram: 39 3.3.2 Integrity constraints: 39 3.3.3 Detailed description of data tables: 41 3.4 INTERFACE DESIGN: 45 3.4.1 CHAPTER 4: 4.1 Describe screen: 45 IMPLEMENTATION AND TESTING 75 INSTALLATION 75 4.1.1 Support tools: 75 4.1.2 The structure of the program and the implementation processes 75 4.1.3 The implementation processes 76 4.2 TESTING 104 4.2.1 Test scenarios: 104 4.2.2 Test result: 104 CHAPTER 5: CONCLUSION 124 5.1 RESULT: 124 5.2 STRENGTHS: 124 5.3 DRAWBACKS: 124 vii 5.4 FUTURE WORKS: 124 REFERENCES 125 viii IMAGE CATALOG Image 1.1: DHC Vietnam homepage Image 1.2: DHC Vietnam product list page Image 2.1: Client use case 10 Image 2.2: Admin use case .11 Image 3.1: Entity relationship diagram .23 Image 3.2: User login sequence diagram 24 Image 3.3: User register sequence diagram 25 Image 3.4: Login with Google sequence diagram 26 Image 3.5: Login with Facebook sequence diagram .27 Image 3.6: View product list sequence diagram .28 Image 3.7: Search product sequence diagram 29 Image 3.8: Manage cart sequence diagram .30 Image 3.9: Procced to order sequence diagram 31 Image 3.10: User comment sequence diagram 32 Image 3.11: Add category sequence diagram 33 Image 3.12: Add role sequence diagram 34 Image 3.13: Delete order sequence diagram .35 Image 3.14: Search order sequence diagram 36 Image 3.15: Active manager sequence diagram .37 Image 3.16: View product by category sequence diagram .38 Image 3.17: Database diagram 39 Image 3.18: Client login screen 45 Image 3.19: Client register screen .46 Image 3.20: Client home screen 47 Image 3.21: Client product screen 48 Image 3.22: Client product detail screen 49 Image 3.23: Client cart screen 50 Image 3.24: Client order screen 51 Image 3.25: Client return policy screen 52 Image 3.26: Client payment policy screen 53 Image 3.27: Client delivery policy screen 54 Image 3.28: Client contact screen .55 Image 3.29: Admin dashboard screen .56 Image 3.30: Admin login screen .58 Image 3.31: Admin order list screen 59 Image 3.32: Admin product list screen .60 Image 3.33: Admin image list screen 61 Image 3.34: Admin customer list screen 62 Image 3.35: Admin category list screen 63 ix 4.2.2.6 ID Test result of update product (Admin): Description Test steps Test data TC_AD_01 Test the response of website when admin updates product Click SKU: SKU1 “Sửa” button Input text Click “Lưu” button Expected result Selected product will be updated Actual Status result As Pass expected Table 4.7: Test result of update product (Admin) Image 4.43: Actual result of update product (TC_AD_01) 112 4.2.2.7 ID Test result of search product (Admin): Description Test steps Test data TC_AD_02 Test the Input text response of website when admin searches product TC_AD_03 Test the Input text response of website when admin searches product Input “Kem trắng da” Expected result text: Products will làm be displayed Actual Status result As Pass expected Input text: Products will As Pass “Nagoki” not be expected displayed Table 4.8: Test result of search product (Admin) Image 4.44: Actual result of search product (TC_AD_02) 113 Image 4.45: Actual result of search product (TC_AD_03) 4.2.2.8 ID Test result of search customer (Admin): Description Test steps Test data TC_AD_04 Test the Input text response of website when admin searches customer TC_AD_05 Test the Input text response of website when admin searches customer Input “Loc” Input “Lộc” Expected result text: Customers will be displayed Actual Status result As Pass expected text: Customers As Pass will not be expected displayed Table 4.9: Test result of search customer (Admin) 114 Image 4.46: Actual result of search customer (TC_AD_04) Image 4.47: Actual result of search customer (TC_AD_05) 115 4.2.2.9 ID Test result of add category (Admin): Description Test steps Test data TC_AD_06 Test the response of website when admin adds category Input text Click “Lưu” button Input “Sữa mặt” Expected result text: “Sữa rửa rửa mặt” will be displayed Actual Status result As Pass expected Table 4.10: Test result of add category (Admin) Image 4.48: Actual result of add category (TC_AD_06) 116 4.2.2.10 Test result of search category (Admin): ID Description Test steps Test data TC_AD_07 Test the Input text response of website when admin searches category TC_AD_08 Test the Input text response of website when admin searches category Expected result Input text: Products will “Kem Trị” be displayed Actual Status result As Pass expected Input text: Products will As Pass “Sữa bôi da” not be expected displayed Table 4.11: Test result of search category (Admin) Image 4.49: Actual result of search category (TC_AD_07) 117 Image 4.50: Actual result of search category (TC_AD_08) 118 4.2.2.11 Test result of add staff (Admin): ID Description Test Test data steps TC_AD_09 Test the Input Name: “Nguyen response of text Huu Loc” website Click Username: “aaa” when “Lưu” Password: “1234” admin adds button Email: staff “nguyentrangiabao 20161@gmail.com ” Phone: “032538468” Role: “Thành viên” Expected Actual Statu result result s Staff will be As Pass displayed expected Table 4.12: Test result of add staff (Admin) Image 4.51: Actual result of add staff (TC_AD_09) 119 4.2.2.12 Test result of active staff (Admin): ID Description Test steps Test data Expected Actual Status result result TC_AD_10 Test the Choose Staff: “Đào This staff is As Pass response of staff is Trọng Ngĩa” activated expected website disabled when admin Click activates “Kích staff hoạt” button Table 4.13: Test result of activate staff (Admin) Image 4.52: Actual result of activate staff (TC_AD_10) 120 4.2.2.13 Test result of disable staff (Admin): ID Description Test steps Test data Expected result TC_AD_11 Test the Choose Staff: “Đinh This staff response of staff is Trọng Thái” will be website actived disabled when admin Click “Vô disables hiệu” staff button Actual Status result As Pass expected Table 4.14: Test result of disable staff (Admin) Image 4.53: Actual result of disable staff (TC_AD_11) 121 4.2.2.14 Test result of search staff (Admin): ID Description Test steps Test data TC_AD_12 Test the Input text response of website when admin searches staff TC_AD_13 Test the Input text response of website when admin searches staff Expected Actual Status result result Input text: Staff will be As Pass “Danh” displayed expected Input text: Staff will not As Pass “Danh@” be displayed expected Table 4.15: Test result of search staff (Admin) Image 4.54: Actual result of search staff (TC_AD_12) 122 Image 4.55: Actual result of search staff (TC_AD_13) 123 CHAPTER 5: 5.1 CONCLUSION RESULT: Through the process of implementing the topic Developing a website for selling cosmetics, the group of students has completed all the main functions of the topic In addition, the group also accumulated other knowledge and experiences: - Design simple interface and easy to use - Know the process of building and designing website - Practice teamwork skills - Apply new services 5.2 STRENGTHS: The website of the implementation team has the following advantages: - 5.3 The website has a friendly and easy-to-use interface that makes it easy for customers to view products and buy products The website has full basic functions for customers to use stably The buttons have icons that make it easy for customers to identify the functions of the buttons on the website DRAWBACKS: The team has the following limitations: - Some functions operate as simple as: search, order, etc making the user less selective about the website features - Machine learning has not been applied to the best product recommendation feature and the most trending product today - There is no function to enter a discount code to reduce the price of products that customers order - The website interface is simple, not rich in content and style causing boredom for customers as well as less attractiveness to customers 5.4 FUTURE WORKS: The group has upcoming plans on the website: - Apply machine learning into website so that the website offers the best and trending products today - Develop some new features such as: game to accumulate point, hunt for discount codes, etc - Update website interface more beautiful, richer and suitable for customer - Create an AI Bot to message with customers to make it more convenient for the store to solve customer questions 124 REFERENCES Bootstrap (n.d.) Download https://getbootstrap.com/docs/3.3/ Bootstrap Retrieved MDN Web Docs (n.d.) Document Retrieved from https://developer.mozilla.org/en-US/docs/Web/API/Document from MDN Getbootstrap: Web Docs: PHP (2021) PHP Documentation Retrieved from PHP: https://www.php.net/docs.php phpMyAdmin (n.d.) Welcome to phpMyAdmin’s documentation! Retrieved from phpMyAdmin: https://docs.phpmyadmin.net/en/latest/ VNPAY (n.d.) Hướng dẫn tích hợp Cổng toán VNPAY Retrieved from VNPAY: https://sandbox.vnpayment.vn/apis/docs/huong-dan-tich-hop/ 125