Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống
1
/ 104 trang
THÔNG TIN TÀI LIỆU
Thông tin cơ bản
Định dạng
Số trang
104
Dung lượng
2,39 MB
Nội dung
ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM ĐẶNG VĨNH SIÊU LƯU SỸ HỒNG KHĨA LUẬN TỐT NGHIỆP XÂY DỰNG HỆ THỐNG BÁN VÀ TƯ VẤN MỸ PHẨM Building cosmetic sales and consulting system KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM TP HỒ CHÍ MINH, 2021 ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CƠNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM ĐẶNG VĨNH SIÊU – 17520982 LƯU SỸ HỒNG – 17520511 KHĨA LUẬN TỐT NGHIỆP XÂY DỰNG HỆ THỐNG BÁN VÀ TƯ VẤN MỸ PHẨM Building cosmetic sales and consulting system KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM GIẢNG VIÊN HƯỚNG DẪN THS.HUỲNH HỒ THỊ MỘNG TRINH TP HỒ CHÍ MINH, 2021 THƠNG TIN HỘI ĐỒNG CHẤM KHÓA LUẬN TỐT NGHIỆP Hội đồng chấm khóa luận tốt nghiệp, thành lập theo Quyết định số ……………… ngày Hiệu trưởng Trường Đại học Công nghệ Thông tin - Chủ tịch - Thư ký - Ủy viên - Ủy viên LỜI CẢM ƠN Sau năm học tập rèn luyện Trường Đại học Công nghệ Thông tin, tận tình giảng dạy, giúp đỡ, hỗ trợ thầy cô, đặc biệt quý thầy cô khoa Công nghệ Phần mềm, chúng em gặt hái nhiều kiến thức tảng bổ ích, áp dụng vào luận văn áp dụng chặng đường sau Chúng em xin chân thành cảm ơn quý thầy cô trường Đại học Cơng nghệ Thơng tin nói chung, q thầy khoa Cơng nghệ Phần mềm nói riêng, đặc biệt cô Huỳnh Hồ Thị Mộng Trinh tận tình hướng dẫn đóng góp ý kiến để chúng em hồn thành khóa luận cách tốt Bên cạnh đó, nhóm em xin gửi lời cảm ơn chân thành đến gia đình bạn bè lời góp ý, động viên để nhóm có thêm động lực thực khóa luận khoảng thời gian khó khăn Trong suốt q trình chúng em tìm hiểu thực khóa luận, đề tài sử dụng cơng nghệ cịn mới, thời gian khả có giới hạn nên chúng em cịn nhiều thiếu sót Do đó, nhóm chúng em mong nhận thông cảm ý kiến đóng góp chân thành từ q thầy bạn Một lần nữa, nhóm chúng em xin chân thành cảm ơn người nhiều Thành phố Hồ Chí Minh, tháng 07 năm 2021 Đặng Vĩnh Siêu Lưu Sỹ Hồng MỤC LỤC TĨM TẮT KHĨA LUẬN Chương 1: TỔNG QUAN ĐỀ TÀI 1.1 Giới thiệu đề tài 1.2 Mục tiêu 1.3 Phạm vi: 1.4 Phương pháp thực 1.5 Ý nghĩa thực tiễn 1.6 Kết dự kiến: Chương 2: TÌM HIỂU CƠNG NGHỆ CẦN THIẾT 2.1 Tổng quan 2.2 PostgreSQL 10 2.2.1 PostgreSQL gì? 10 2.2.2 Tại nên sử dụng PostgreSQL? 11 2.2.3 Khi nên sử dụng PostgreSQL? 11 2.2.4 Khi không nên sử dụng PostgreSQL? 12 2.2.5 Ưu điểm? 12 2.2.6 Nhược điểm? 13 2.3 NodeJS 14 2.3.1 NodeJS gì? 14 2.3.2 Ưu điểm 15 2.3.3 Nhược điểm 16 2.4 NestJS 18 2.4.1 NestJS gì? 18 2.4.2 Cấu trúc thư mục NestJS? 19 2.5 ReactJS: 20 2.5.1 ReactJS gì? 20 2.5.2 Tại phải sử dụng ReactJS? 21 2.5.3 Nhược điểm: 22 2.5.4 Phân biệt ReactJS React Native 23 2.6 React Native 24 2.6.1 React Native gì? 24 2.6.2 Tại phải sử dụng React Native? 24 2.6.3 Nhược điểm: 25 2.7 Redux 26 2.7.1 Redux gì? 26 2.7.2 Tại phải sử dụng Redux? 26 2.7.3 Cách hoạt động Redux 27 Chương 3: PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG 28 3.1 Cơ sở lý thuyết 28 3.1.1 Tìm hiểu mỹ phẩm dưỡng da 28 3.1.2 Các thông tin loại da 28 3.1.3 Khảo sát thành phần 29 3.1.4 Độ tuổi nên bắt đầu dưỡng da 32 3.1.5 Bốn giai đoạn dưỡng da cho độ tuổi khác 33 3.1.6 Định nghĩa routine chăm sóc da 34 3.1.7 Thông tin người dùng cần thiết cho việc xây dựng CSDL gợi ý 35 3.2 Danh sách Use-case 36 3.3 Một số sơ đồ cần ý 55 3.4 Thiết kế sở liệu 62 3.5 Thiết kế kiến trúc hệ thống 80 3.5.1 Kiến trúc tổng quát 80 3.5.2 Kiến trúc ứng dụng web 81 3.5.3 Kiến trúc ứng dụng di động 82 3.6 Triển khai hệ thống 84 Chương 4: KẾT LUẬN 85 4.1 Kết đạt 85 4.2 Ưu điểm nhược điểm 90 4.2.1 Ưu điểm 90 4.2.2 Nhược điểm 90 4.3 Thuận lợi khó khăn 90 4.3.1 Thuận lợi 90 4.3.2 Khó khăn 90 4.4 Hướng phát triển 91 TÀI LIỆU THAM KHẢO 92 DANH MỤC HÌNH VẼ Hình 1.1: Thống kê tần suất chăm sóc da người dân Việt Nam 2020 Hình 1.2: Thống kê số tiền dành cho mỹ phẩm chăm sóc da tháng 2020 Hình 2.1: Tech stack Hình 2.2: PostgreSQL 10 Hình 2.3: NodeJS 14 Hình 2.4: Chỉ số ổn định stability index 17 Hình 2.5: NestJS 18 Hình 2.6: Cấu trúc thư mục NestJS 18 Hình 2.7: ReactJS 20 Hình 2.8: React Native 24 Hình 2.9: Mơ hình túy React 26 Hình 2.10: Mơ hình sử dụng Redux 26 Hình 2.11: Nguyên tắc vận hành Redux 26 Hình 3.1: Sơ đồ Use-case tổng quát 36 Hình 3.2: Sơ đồ Use-case người quản trị 37 Hình 3.3: Sơ đồ Use-case người dùng 46 Hình 3.4: Sơ đồ “Đăng nhập” 55 Hình 3.5: Sơ đồ “Đăng ký” 56 Hình 3.6: Sơ đồ “Quản lý routine” 57 Hình 3.7: Sơ đồ “Mua hàng” 59 Hình 3.8: Sơ đồ “Quản lý sản phẩm” 60 Hình 3.9: Sơ đồ “Xem tình trạng da” 61 Hình 3.10: Sơ đồ sở liệu tổng quát 62 Hình 3.11: Sơ đồ kiến trúc tổng quát 80 Hình 3.12: Sơ đồ kiến trúc web application 81 Hình 3.13: Sơ đồ kiến trúc mobile application 82 Hình 3.14: Sơ đồ triển khai hệ thống 84 Hình 4.1: Hình giao diện trang chủ website 84 Hình 4.2: Hình trang chi tiết sản phẩm 84 Hình 4.3: Hình hình ứng dụng 84 Hình 4.3: Hình hình ứng dụng 84 Hình 4.4: Hình hình routine cá nhân 84 Hình 4.5: Hình hình xem tình trạng da 84 DANH MỤC BẢNG Bảng 1.1: Bảng so sánh hệ thống mỹ phẩm khác Bảng 3.1: Danh sách Actor 36 Bảng 3.2: Use case người quản trị 38 Bảng 3.3: Use case đăng nhập 39 Bảng 3.4: Use case quản lý user 40 Bảng 3.5: Use case quản lý đơn hàng 41 Bảng 3.6: Use case quản lý sản phẩm 42 Bảng 3.7: Use case quản lý hãng 43 Bảng 3.8: Use case quản lý danh mục sản phẩm 44 Bảng 3.9: Use case quản lý routine người dùng 45 Bảng 3.10: Use case người dùng 47 Bảng 3.11: Use case đăng ký 48 Bảng 3.12: Use case đăng nhập 49 Bảng 3.13: Use case mua hàng 50 Bảng 3.14: Use case xác nhận đơn hàng 51 Bảng 3.15: Use case hủy đơn hàng 52 Bảng 3.16: Use case quản lý danh sách sản phẩm sử dụng 53 Bảng 3.17: Use case quản lý routine cá nhân 54 Bảng 3.18: Bảng PRODUCT 62 Bảng 3.19: Bảng PRODUCT_INGREDIENTS 64 Bảng 3.20: Bảng PRODUCT_STOCK 65 Bảng 3.21: Bảng BRAND 65 Bảng 3.22: Bảng BRAND_PRODUCT_LINES 66 Bảng 3.23: Bảng IMPORT_DETAIL 66 Bảng 3.24: Bảng CART_DETAIL 67 Bảng 3.25: Bảng BILL 68 Bảng 3.26: Bảng BILL_DETAIL 69 Bảng 3.27: Bảng BILL_SHIPMENT 70 Bảng 3.28: Bảng BILL_PAYMENT 71 Bảng 3.29: Bảng COSMETIC_INGREDIENTS 72 Bảng 3.30: Bảng CATEGORY_DISCOUNT 73 Bảng USER_LIST_USING Bảng 3.38: Bảng USER_LIST_USING S T T Tên Kiểu liệu Ràng buộc Ý nghĩa varchar Tên sản phẩm PRODUCT_NAME PRODUCT_NAME_VIETS UB varchar Tên sản phẩm tiếng Việt IMAGE_DISPLAY varchar Hình sản phẩm MANUFACTURE_DATE timesta mptz required Ngày sản xuất varchar required Tên sản phẩm LOT_NUMBER EXPIRED_MONTH_UNOP EN int4 required Ngày hết hạn chưa mở nắp EXPIRED_MONTH_OPEN int4 DATE_OPEN DATE_EXPIRED_UNOPE N 10 DATE_EXPIRED_OPEN timesta mptz timesta mptz timesta mptz 11 USER_ID uuid Mã user 12 BEYU_VERIFY bool Của cửa hàng 13 id 14 created_at uuid timesta mptz 15 created_by 16 modified_at uuid timesta mptz 17 modified_by uuid Người chỉnh sửa 18 bILLId uuid Mã đơn 19 PRODUCT_ID uuid Mã sản phẩm 20 IDENTIFY_QR_CODE varchar 21 CATEGORY_ID uuid Mã danh mục 22 IS_DONE bool Sử dụng xong 78 Ngày hết hạn mở nắp required Ngày mở nắp required Hạn sử dụng chưa mở nắp Hạn sử dụng mở nắp Mã sản phẩm sử dụng required Tạo vào lúc required Người thêm required Thời gian chỉnh sửa Mã QR Bảng USER_WISHLIST Bảng 3.39: Bảng USER_WISHLIST S T T Tên Kiểu liệu OLD_PRICE numeric id uuid created_at timestamptz created_by modified_at modified_by uuid uSERId uuid pRODUCTId uuid uuid Ràng buộc Ý nghĩa Giá cũ Mã wishlist Tạo vào lúc required timestamptz R required required R required Tạo Chỉnh sửa vào lúc Chỉnh sửa Mã user Mã sản phẩm Bảng STAFF Bảng 3.40: Bảng STAFF S T T Tên Kiểu liệu STAFF_PID STAFF_FIRST_NAME varchar varchar Mã PID nhân viên Tên STAFF_LAST_NAME varchar Họ STAFF_EMAIL varchar required Email STAFF_PASSWORD varchar required Mật STAFF_PHONE_NUMBER varchar required Số điện thoại 10 11 12 13 STAFF_DOB timestamptz SEX varchar id uuid created_at timestamptz created_by uuid modified_at timestamptz modified_by uuid 79 Ràng buộc Ý nghĩa Mã user required Giới tính Mã nhân viên Tạo vào lúc Tạo Chỉnh sửa vào lúc Chỉnh sửa 3.5 Thiết kế kiến trúc hệ thống 3.4.1 Kiến trúc tổng quát Hình 3.11: Sơ đồ kiến trúc tổng quát Web Application: Sử dụng ReactJS framework Redux để quản lý, sử dụng, kiểm soát liệu (state) component ReactJS Mobile Application: Sử dụng React Native framework, viết ngôn ngữ Javascript Sử dụng Redux để quản lý kiểm sốt state Database: Sử dụng PostgreSQL khơng q u cầu cơng tác bảo trì tính ổn định cao, phát triển nhiều ứng dụng khác đặc biệt mã nguồn mở miễn phí 80 3.4.2 Kiến trúc ứng dụng web Hình 3.12: Sơ đồ kiến trúc tổng thể web application Bảng 3.41: Bảng kiến trúc web application STT Tên thành phần Tên module Miêu tả Chứa thành phần giao diện Component sử dụng nhiều hình Định nghĩa loại điều hướng, màu sắc, ReactJS thành phần hiển thị biến sử dụng nhiều Constant hình ứng dụng Assets Chứa hình ảnh icon ứng dụng Chứa hình tồn ứng dụng Container điêu hướng chúng Chứa action Action đối tượng mang thơng tin xảy ứng Redux - thành phần quản lý Action Store dụng gửi đến store Định nghĩa strore – nơi quản lý state Chứa reducer Reducer nơi xử state Reducer lý liệu để trả state khác ứng với loại action 81 3.4.3 Kiến trúc ứng dụng di động Hình 3.13: Sơ đồ kiến trúc tổng thể mobile application 82 Bảng 3.42: Bảng kiến trúc mobile application STT Tên thành phần Miêu tả Tên module Screen Chứa hình ứng dụng Chứa thành phần giao diện có Component Định nghĩa loại điều hướng, màu React Native thành phần thể sử dụng nhiều sắc, biến sử dụng nhiều Constant hiển thị hình ứng dụng Chứa hình ảnh icon ứng Assets dụng Chứa hình tồn ứng Container dụng điều hướng chúng Chứa action Action đối tượng Action mang thơng tin xảy Redux - thành ứng dụng gửi đến store phần quản lý Store state Định nghĩa strore – nơi quản lý state Reducer Chứa reducer Reducer nơi xử lý liệu để trả state khác ứng với loại action 83 3.6 Triển khai hệ thống Sau xây dựng hệ thống, nhóm triển khai website sử dụng tảng Azure Microsoft cho back-end front-end Database PostgreSQL triển khai Heroku Hình 3.14: Sơ đồ triển khai hệ thống Sau triển khai cấu hình số thơng tin cho tên miền, ứng dụng truy cập sử dụng cách truy cập vào đường dẫn sau đây: http://beyu.xyz/ 84 Chương 4: KẾT LUẬN 4.1 Kết đạt Về mặt kỹ thuật cơng nghệ, nhóm đạt kết sau: - Tìm hiểu chế hoạt động công nghệ bật việc phát triển web như: NodeJS, NestJS, PostgreSQL, ReactJS, React Native - Tìm hiểu nghiệp vụ bán hàng thành phần hóa học, kiến thức loại da quy trình tạo routine chăm sóc da mặt - Nâng cao kỹ lập trình nhiều khía cạnh hệ thống Tăng cường kỹ làm việc nhóm thơng qua phân công công việc JIRA Về mặt sản phẩm, nhóm đạt kết sau: - Ứng dụng web: xây dựng website thương mại điện tử buôn bán mỹ phẩm website quản trị cho hệ thống Triển khai tự động website lên tảng cloud Azure Microsoft Azure CI/CD - Ứng dụng di động: xây dựng ứng dụng di động hỗ trợ việc quản lý tài khoản cá nhân người dùng, quản lý routine gợi ý thiết kế routine tự động theo chức mà thân mong muốn 85 Màn hình số chức chính: ▪ Trang chủ website: Hình 4.1: Hình giao diện trang chủ website ▪ Trang chi tiết sản phẩm: Hình 4.2: Màn hình chi tiết sản phẩm 86 ▪ Màn hình ứng dụng: Hình 4.3: Màn hình ứng dụng mobile 87 ▪ Màn hình routine cá nhân Hình 4.4: Màn hình xem routine cá nhân 88 ▪ Màn hình xem tình trạng da Hình 4.5: Màn hình xem tình trạng da 89 4.2 Ưu điểm nhược điểm 4.2.1 Ưu điểm - Hệ thống website đẹp mắt dễ sử dụng - Có lưu lại danh sách địa tiện dụng cho người dùng - Bảo hành qua hình thức mở nắp giúp người dùng an tâm việc theo dõi hạn sử dụng sản phẩm - Ứng dụng mobile giúp người dùng quản lý routine cá nhân tự động đề xuất theo nhu cầu da 4.2.2 Nhược điểm - Hệ thống website chưa tối ưu việc gợi ý sản phẩm - Chưa tích hợp chức booking với phịng khám da - Giới hạn độ chịu tải 4.3 Thuận lợi khó khăn 4.3.1 Thuận lợi - Có kiến thức tảng JavaScript nên việc thực tính gặp trở ngại - Kiến thức web mobile app tư môn học năm học trường - Có hiểu biết lĩnh vực chăm sóc da qua trang mạng xã hội kênh youtube - Sự hỗ trợ ý kiến đóng góp nhiệt tình từ bạn bè giáo viên hướng dẫn Động lực từ mục tiêu cá nhân sử dụng hệ thống vào lĩnh vực kinh doanh sau 4.3.2 Khó khăn - Vì để phát triển tích hợp đầy đủ dịch vụ tư vấn khác cần hiểu biết thời gian để đầu tư vào nghiên cứu nhiều cơng nghệ - Vì khóa luận hệ thống phát triển trình hai thành viên vừa phải thực tập vừa phát triển xây dựng hệ thống nên quỹ thời gian hạn hẹp khơng tránh khỏi thiếu sót - Tình hình dịch bệnh trở nên căng thẳng nên đa số phải làm việc online có hội gặp mặt trao đổi, cụ thể việc phát triển hệ thống 90 4.4 Hướng phát triển - Khắc phục nhược điểm có - Tối ưu UI/UX tăng thêm độ thẩm mỹ cho hệ thống - Xây dựng cộng đồng người yêu thích chăm sóc da Từ tăng tính đóng góp cho hệ thống hỗ trợ đưa định người dùng Phát triển tính chia sẻ routine người dùng với cho phép nhiều người đánh giá review routine chia sẻ - Tìm hiểu, nghiên cứu thêm phương pháp chăm sóc da, loại mỹ phẩm quy trình routine tốt để giới thiệu đến người dùng - Tích hợp thêm bên thứ ba y, bác sĩ, chuyên gia da nói riêng làm đẹp nói chung để người dùng kết nối tư vấn cách bảo đảm toàn diện - Tối ưu hệ thống, tăng tốc độ độ chịu tải 91 TÀI LIỆU THAM KHẢO Tài liệu tiếng Việt [1] React hoạt động https://www.hostinger.vn/huong-dan/react-la-gi-va-no-hoat-dong-nhu-thenao [2] React Native Là Gì? Tổng Quan Về React Native https://baladken.com/react- native-la-gi-tong-quan-ve-react-native [3] React native - Những khái niệm cần biết bắt đầu https:// viblo.asia/p/react-native-nhung-khai-niem-co-ban-can-biet-khi-batdau- 4dbZNq1mKYM [4] Giới thiệu Redux Reactjs https://viblo.asia/p/redux-trong-reactjs-4P8563gOKY3 [5] NestJS –Nodejs Framework tuyệt vời thay ExpressJS https://vntalking.com/nestjs-nodejs-framework-tuyet-voi-thay-theexpressjs.html [6] Kiến thức loại da https://www.eucerin.vn/chuyen-sau-ve-da/kien-thuc-da-co-ban/cac-loai-da [7] giai đoạn dưỡng da cho độ tuổi https://www.eucerin.vn/chuyen-sau-ve-da/kien-thuc-da-co-ban/cac-loai-da Tài liệu tiếng Anh [1] ReactJS Home Page https://reactjs.org/ [2] React Native Home Page https://reactnative.dev/ 92 ... chọn đề tài Khóa luận Tốt nghiệp ? ?Xây dựng hệ thống bán tư vấn mỹ phẩm? ?? – Một hệ thống giúp cho việc mua hàng mỹ phẩm chăm sóc da trở nên đơn giản hiệu 1.2 Mục tiêu - Tìm hiểu nghiệp vụ bán hàng,... MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM ĐẶNG VĨNH SIÊU – 17520982 LƯU SỸ HOÀNG – 17520511 KHÓA LUẬN TỐT NGHIỆP XÂY DỰNG HỆ THỐNG BÁN VÀ TƯ VẤN MỸ PHẨM Building cosmetic sales... hệ thống mỹ phẩm khác Chức Năng Bán hàng mỹ phẩm Đánh giá sản phẩm Hasaki Reviewty SkinFood Beyu Có Có Cá nhân đăng ký Có bán hàng Đánh giá Có Đánh giá sản sản phẩm đánh phẩm bán cá nhân hệ thống