Khóa luận tốt nghiệp xây dựng hệ thống so sánh giá giữa các trang thương mại điện tử , Khóa luận tốt nghiệp xây dựng hệ thống so sánh giá giữa các trang thương mại điện tử , Khóa luận tốt nghiệp xây dựng hệ thống so sánh giá giữa các trang thương mại điện tử
ĐẠ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 HỒNG ANH DŨNG KHĨA LUẬN TỐT NGHIỆP XÂY DỰNG HỆ THỐNG SO SÁNH GIÁ GIỮA CÁC TRANG THƯƠNG MẠI ĐIỆN TỬ PRICE COMPARING SYSTEM FROM E-COMMERCE KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM TP HỒ CHÍ MINH, THÁNG 01 NĂM 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 HỒNG ANH DŨNG – 14520192 KHĨA LUẬN TỐT NGHIỆP XÂY DỰNG HỆ THỐNG SO SÁNH GIÁ GIỮA CÁC TRANG THƯƠNG MẠI ĐIỆN TỬ PRICE COMPARING SYSTEM FROM E-COMMERCE KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM GIẢNG VIÊN HƯỚNG DẪN TS NGUYỄN HÀ GIANG THS NGUYỄN THỊ THANH TRÚC TP HỒ CHÍ MINH, THÁNG 01 NĂM 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 Khóa luận tốt nghiệp thành nghiên cứu học tập chúng em suốt khoảng thời gian học làm việc Trường Đại Học Công Nghệ Thông Tin Chúng em làm tốt khóa luận khơng có quan tâm, giúp đỡ tận tình quý Thầy Cô bạn bè Đầu tiên chúng em xin gửi lời cảm ơn chân thành đến quý Thầy Cô Trường Đại Học Công Nghệ Thông Tin – Đại Học Quốc Gia TP Hồ Chí Minh q Thầy Cơ Khoa Công Nghệ Phần Mềm tạo điều kiện thuận lợi giúp cho chúng em có kiến thức tảng để thực đề tài Đặc biệt, chúng em xin gửi lời cảm ơn sâu sắc long biết ơn đến giảng viên hướng dẫn – TS Nguyễn Hà Giang ThS Nguyễn Thị Thanh Trúc Cô trực tiếp hướng dẫn hỗ trợ tận tình, sữa chữa đóng góp nhiều ý kiến quý báu giúp chúng em hồn thành khóa luận tốt nghiệp Mặc dù q trình làm khóa luận cịn nhiều thiếu sót thầy hỗ trợ để chúng em thực xong đề tài, điều làm chúng em cảm thấy biết ơn cô nhiều Bên cạnh em gửi lời cảm ơn tới gia đình, người thân bạn bè hỗ trợ mặt tinh thần việc động viên khích lệ chúng em suốt khoảng thời gian ngồi ghế nhà trường khoảng thời gian thực khóa luận Trong q trình thực đề tài Chúng em sử dụng kiến thức tảng tích lũy từ việc học trường đồng thời kết hợp với trình học hỏi nghiên cứu kiến thưc nhằm hồn thành khóa luận tốt nghiệp cách tốt Tuy nhiên, trình thực em tránh khỏi thiếu sót Vì vậy, em mong nhận đóng góp q báu từ q Thầy Cơ nhằm hồn thiện kiến thức mà em học tập suốt năm đại học Đó hành trang để tác giả thực tiếp đề tài tương lai Xin chân thành cảm ơn quý Thầy Cô! TP Hồ Chí Minh, tháng năm 2021 Sinh viên thực ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM TRƯỜNG ĐẠI HỌC Độc Lập - Tự Do - Hạnh Phúc CÔNG NGHỆ THÔNG TIN ĐỀ CƯƠNG CHI TIẾT TÊN ĐỀ TÀI: XÂY DỰNG HỆ THỐNG SO SÁNH GIÁ GIỮA CÁC TRANG THƯƠNG MẠI ĐIỆN TỬ Tên tiếng anh: PRICE COMPARING SYSTEM FROM E-COMMERCE Cán hướng dẫn: TS Nguyễn Hà Giang, ThS Nguyễn Thị Thanh Trúc Thời gian thực hiện: Từ ngày 07/09/2020 – 02/01/2021 Sinh viên thực hiện: Hoàng Anh Dũng - 14520192 Nội dung đề tài: ● Mục tiêu: Do có lợi kinh phí dành cho khơng gian trưng bày sản phẩm nên giá thành sản phẩm trang thương mại điện tử thường rẻ bên ngồi thường xun có chương trình khuyến mãi, giảm giá đưa Để tận dụng hội đó, người mua sắm phải thường xuyên ghé vào trang thương mại để cập nhật chương trình giảm giá sản phẩm tìm xem sản phẩm cần có giảm giá hay khơng Cơng việc tiêu tốn nhiều thời gian cơng sức người mua sắm Vì vấn đề đặt làm để người dùng theo dõi biến động giá sản phẩm mà quan tâm để mua với giá thích hợp Nắm bắt nhu cầu em xây dựng website giúp người dùng theo dõi giá sản phẩm Để thực đề tài em tìm hiểu lập trình website tảng NodeJs, framework VueJS cách thức xây dựng hệ thống server nhằm phát triển ứng dụng PriceComparing cho người dùng tảng NodeJs Hiện có ứng dụng theo hướng thu thập phân tích số liệu sản phẩm ứng dụng có lợi mạnh riêng điểm bất lợi kèm Với Cronfy, ứng dụng hướng đến lâu dài cho phép người dùng thêm sản phẩm vào danh sách yêu thích để theo dõi nhận thơng báo có thay đổi Cịn với BeeCost, tiện ích tích hợp nên ứng dụng hướng đến tiện lợi nhanh chóng, cung cấp cho người dùng nhìn tăng giảm giá sản phẩm, phân tích số liệu cửa hàng từ đưa lời khuyên cho việc mua sắm Tuy nhiên, ứng dụng phụ thuộc nhiều vào trang thương mại điện tử Cronfy người dùng phải vào trang chi tiết sản phẩm để lấy đường dẫn sản phẩm để theo dõi, cịn với BeeCost ứng dụng phụ thuộc hồn tồn vào Shopee Từ đề tài em hướng đến giải vấn đề sau: - Cho phép người dùng thêm sản phẩm để theo dõi giá - Thông báo cho người dùng thơng qua Email có biến động giá - Hỗ trợ nhiều trang thương mại điện tử lớn - Cho phép người dùng tìm kiếm ứng dụng sản phẩm trang thương mại điện tử hỗ trợ - Ít phải phụ thuộc vào trang thương mại điện tử, đa số thao tác thực ứng dụng Nội dung đề tài chi tiết bao gồm: ● Khảo sát nhu cầu thực tế, trạng ứng dụng tương tự có đưa đánh giá, nhận xét ưu điểm để xây dựng ứng dụng PriceComparing tốt ● Tìm hiểu lập trình NodeJS, dịch vụ liên quan: ExpressJS Framework… ● Thiết kế hệ sở liệu từ xây dựng hệ thống server nhằm cung cấp RESTful API (Application Programming Interface) cho phía Client (Ứng dụng PriceComparing) ● Tìm hiểu thiết kế web công nghệ, kỹ thuật, thư viện cần thiết để xây dựng ứng dụng PriceComparing ● Xây dựng ứng dụng PriceComparing với chức sau: o Đăng ký, đăng nhập tài khoản người dùng o Gợi ý sản phẩm theo tiêu chí o Tìm kiếm sản phẩm để theo dõi o Tìm kiếm sản phẩm trang thương mại điện tử (Tiki, Shopee, Lazada, Sendo) o Thông báo thay đổi giá cho người theo dõi có thay đổi giá qua Email o Thống kê người dùng, sản phẩm o Log giá sản phẩm 10 ngày gần Kế hoạch thực hiện: ● Nhận đề tài, tìm hiểu lên ý tưởng ● Khảo sát ứng dụng tương tự, lên danh sách cơng việc, phân tích chức ● Lựa chọn tảng để xây dựng server, framework để xây dựng giao diện dịch vụ, công nghệ, kỹ thuật, thư viện để xây dựng ứng dụng ● Tìm hiểu cơng nghệ, kỹ thuật, thư viện chọn để xây dựng hệ thống ● Xây dựng trang ứng dụng demo thư viện tìm hiểu ● Thiết kế giao diện phía Client, thiết kế kiến trúc server ● Xây dựng giao diện, cấu hình server cài đặt hệ quản trị database ● Xây dựng chức năng: đăng ký tài khoản, đăng nhập, đăng nhập Google, đăng xuất ● Xây dựng chức thêm sản phẩm để theo dõi, tạo document cho thông tin shop ● Tạo cronjob tự động kiểm tra biến động giá thơng báo gmail có biến động, log giá sản phẩm ● Xây dựng trang admin: Thống kê sản phẩm, người dùng ● Tìm hiểu IBM cloud, đưa ứng dụng lên server ● Thêm phong phú sản phẩm để kiểm tra chức theo dõi log giá ● Thêm chức gợi ý sản phẩm có biến động giá nhiều ● Viết báo cáo khóa luận ● Chỉnh sửa lỗi ứng dụng phản hồi từ người dùng Hoàn thành báo cáo luận văn Xác nhận CBHD TP HCM, ngày… tháng …năm…… (Ký tên ghi rõ họ tên) Sinh viên (Ký tên ghi rõ họ tên) NHẬN XÉT CỦA GIẢNG VIÊN ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… ……………………………………………………………………………………… 10 (trường hợp 1) kiện phát sinh component lắng nghe component khác độc lập (trường hợp 2) ● Trường hợp 1: Component sử dụng hàm $emit(“eventName”, params) để phát sinh kiện ngồi component component cha lắng nghe kiện eventName thực công việc tương ứng ● Trường hợp 2: Sử dụng kỹ thuật EventBus EventBus thực thể Vue trung gian tạo import vào component khác Ở component muốn phát sinh kiện gọi hàm $emit EventBus (EventBus.$emit(“eventName”, params)) Ở component có nhu cầu xử lý event hook created gọi hàm $on EventBus để xử lý (EventBus.$on(“eventName”, function)) - Life-cycle hooks: Mỗi thực thể Vue khởi tạo trải qua loạt bước Tập hợp bước từ lúc khởi tạo lúc đối tượng bị hủy tạo thành vòng đời đối tượng Vue Dọc theo vòng đời đối tượng, ứng với bước đối tượng Vue thực thi hook (hàm) tương ứng, cho phép người lập trình thêm mã thời điểm cụ thể 4.2.3 Element UI 4.2.3.1 Yêu cầu toán Trong thiết kế giao diện có đơi lúc có phần tử sử dụng nhiều lần component nhiều component Viết viết viết lại phần tử khiến mã HTML trở nên cồng kềnh, hay mã CSS để xử lý hiệu ứng hay kiểm tra đắn phần tử 4.2.3.2 Giải Để giải vấn đề trên, em dùng thư viện Element UI dành cho VueJS chuyên để thiết kế giao diện với lượng component có sẵn phong phú đầy đủ với tất phần tử cần thiết để xây dựng nên website hồn chỉnh 62 4.3 Phía admin 4.3.1 Yêu cầu toán Đây phân hệ mở rộng ứng dụng yêu cầu phát triển nhanh phân hệ với chức cho phép theo dõi tình hình ứng dụng bao gồm thông tin về: sản phẩm, người dùng… Nhưng đảm bảo tính thẩm mỹ 4.3.2 Giải pháp Để xây dựng nhanh phân hệ cho Admin, em xử dụng template có sẵn Nuxt Material Admin Nuxt Material Admin xây dựng dựa tảng nguyên tắc với đặc điểm: - Nuxt.js: Là framework VueJS cung cấp nhiều tính cho phát triển phía Client Server liệu bất đồng bộ, middleware, layouts, hỗ trợ ES6/ES7, đóng gói giải nén file js css, viết file vue - Mẫu vue-material-admin: Mẫu Vue Material Admin mẫu Material Design Admin dựa Vue sử dụng Vuetifyjs làm framework sở cung cấp custom component giao diện dùng cho trang admin sử dụng Material Design ● Material Design: Là ngôn ngữ trực quan (visual language) tổng hợp nguyên tắc cổ điển thiết kế tốt với đổi khoa học công nghệ Thống trải nghiệm người dùng tảng, thiết bị phương thức nhập liệu dễ dàng mở rộng, tùy chỉnh ● Vuetifyjs: Là framework đầy đủ tính cung cấp thứ cần thiết để thực ý tưởng từ lúc hình thành đến lúc thành phẩm Vuetifyjs phát triển xác theo thơng số kỹ thuật Material Design Vì đặc điểm mà template Nuxt Material Admin đáp ứng yêu cầu giao diện component Giúp giảm thiểu thời gian xây dựng với viết dựa VueJS nên không tốn nhiều thời gian cho việc tùy chỉnh 63 KẾT QUẢ THỰC NGHIỆM VÀ DEMO SẢN PHẨM 5.1 Kết thực nghiệm 5.1.1 Danh sách chức ứng dụng Dưới danh sách chức ứng dụng mà em hoàn thành: - Đăng ký tải khoản người dùng - Đăng nhập tài khoản tên đăng nhập – mật khẩu, tài khoản Google - Đăng xuất tài khoản - Vào trang thông tin người dùng (bao gồm sản phẩm mà người dùng đăng ký theo dõi giá trước đó) - Xem chi tiết sản phẩm (tên sản phẩm, shop bán hàng, hình ảnh, biểu đồ biến động giá 10 ngày) - Tìm kiếm sản phẩm theo từ khóa - Thêm sản phẩm muốn theo dõi giá - Gợi ý sản phẩm nhiều người theo dõi, sản phẩm có biến động giá lớn - Cập nhật giá có thay đổi gởi email thơng báo đến người theo dõi sản phẩm 5.1.2 Kiểm thử ứng dụng Em phát triển thành công chức cho ứng dụng với phiên sau: - Phiên 1.0.0-beta: Phiên em phát hành ngày 28/1/2021 dụng phiên beta nhằm mục đích kiểm thử ứng dụng phát số lỗi liên quan đến việc số lần gửi request tối thiểu tới API, website, vấn đề database 64 Kết luận: Số lượng lỗi ứng dụng người dùng gặp phải tương đối nhiều nhiên đa phần lỗi gặp phải phiên 1.0.0-beta Phiên phiên phát hành đầu tiên, cịn q trình phát triển ứng dụng em khắc phục sửa lỗi phiên 5.1.3 So sánh ứng dụng tương tự BeeCost Ứng dụng hệ thống Theo dõi hầu hết Hiện áp dụng cho Theo dõi hầu hết trang trang thương mại điện tử Shopee thương mại điện tử lớn Cronfy lớn (Lazada, Shopee, (Lazada, Shopee, Tiki) Tiki…) Lưu thông tin log giá sản Lưu thông tin log giá sản Lưu thông tin giá phẩm lên đến năm phẩm lên đến tháng 10 ngày gần Cho phép theo dõi giá sản Chưa cho phép theo dõi Cho phép theo dõi giá sản phẩm phẩm Có thơng báo sản Khơng có thơng báo thay Có thơng báo sản phẩm theo dõi thay đổi đổi giá sản phẩm giá qua mail phẩm theo dõi thay đổi giá qua mail Kiểm tra tự động giá sản Chỉ hoạt động người phẩm 24/24 dùng vào trang chi tiết Kiểm tra tự động 24/24 sản phẩm Shopee Người dùng phải tự Người dùng sử dụng Người dùng tìm tìm sản phẩm trên trang Shopee kiếm ứng dụng sản phẩm shop trang thương mại điện tử hỗ trợ Bảng 7: So sánh ứng dụng tương đương 65 5.2 Chi tiết chức ứng dụng 5.2.1 Đăng ký Hình 5: Chức đăng ký 5.2.2 Đăng nhập Hình 6: Chức đăng nhập đăng xuất Người dùng sau đăng nhập đăng xuất cách nhấn vào nút Log out công cụ 5.2.3 Gợi ý sản phẩm nhiều người theo dõi 66 Hình 7: Chức gợi ý sản phẩm nhiều người theo dõi 67 5.2.4 Gợi ý sản phẩm có biến động giá cao Hình 8: Chức gợi ý sản phẩm có biến động giá cao 68 5.2.5 Các sản phẩm người dùng theo dõi Hình 9: Chức gợi ý sản phẩm người dùng theo dõi 69 5.2.6 Tìm kiếm sản phẩm theo từ khóa Hình 10: Chức tìm kiếm sản phẩm theo từ khóa 5.2.7 Sản phẩm tìm thấy shop bán hàng tiki Hình 11: Chức tìm kiếm sản phẩm 70 5.2.8 Thêm sản phẩm muốn theo dõi Hình 12: Chức thêm sản phẩm muốn theo dõi 5.2.9 Gửi e-mail cho người dùng sản phẩm thay đổi giá Hình 13: Chức gửi e-mail cho người dùng sản phẩm thay đổi giá 71 Hình 14: Chức gửi e-mail đăng ký theo dõi 5.2.10 Biểu đồ giá thay đổi Hình 15: Chức biểu đồ giá 72 5.3 Kết luận 5.3.1 Kết đạt Qua trình thực khố luận, em sử dụng kiến thức, kỹ dạy giảng đường đồng thời tự tìm hiểu cơng nghệ kỹ thuật xây dựng server, web client, deploy sản phẩm để giải khó khăn gặp phải Em phát triển thành công ứng dụng “Hệ thống so sánh giá trang thương mại điện tử” tảng Website, thoả mãn mục tiêu đề tài Chi tiết kết đạt sau: - Tìm hiểu, xây dựng server cho ứng dụng tảng NodeJS với web framework VueJS sở liệu CouchDB - Xây dựng thành công hệ thống server nhằm quản lý sở liệu cung cấp API cho ứng dụng phân hệ client - Tìm hiểu tảng, ngơn ngữ lập trình, framework web front end, kỹ thuật, thư viện cần thiết để xây dựng ứng dụng Website - Xây dựng thành công ứng dụng tảng Website nhằm cung cấp chức ứng dụng đến người dùng cuối, phát hành thành công ứng dụng lên IBMCloud Đánh giá ứng dụng: Ứng dụng phát triển cho tất thiết bị truy cập internet Với giao diện thân thiện, ứng dụng mang lại trải nghiệm tốt cho người dùng, dễ sử dụng… 5.3.2 Những điểm hạn chế Với hạn chế thời gian kiến thức em, ứng dụng không tránh khỏi hạn chế sau đây: - Giao diện chưa bắt mắt - Chỉ chạy thử nghiệm local 73 - Chưa có nhiều người dùng trải nghiệm 5.4 Hướng phát triển Một ứng dụng khơng thể hồn thiện đáp ứng hết mong muốn người dùng từ phát hành Từ hạn chế phân tích định hướng kinh doanh, em lên kế hoạch phát triển ứng dụng tương lai sau: - Mở rộng tìm kiếm sản phẩm website bán hàng trực tuyến khác (thegioididong.com, vienthonga.com, balotuixach.com…) - Cải thiện giao diện thân thiện, bắt mắt - Phát triển ứng dụng tảng mobile - Mở rộng phương thức thông báo đến người dùng (sms, zalo, messenger, ) 74 TÀI LIỆU THAM KHẢO "Express - Fast, unopinionated, minimalist web framework for Node.js," [Online] Available: http://expressjs.com/ [Accessed April 2018] C Buckler, "SQL vs NoSQL: The Differences," [Online] Available: https://www.sitepoint.com/sql-vs-nosql-differences/ [Accessed April 2018] Google, "Gmail API," p https://developers.google.com/gmail/api/guides/, 2018 R Posa, "Node JS Architecture – Single Threaded Event Loop," [Online] Available: http://www.journaldev.com/7462/node-js-architecture-single- threaded-event-loop [Accessed 2018] "React vs Angular vs Vue.js - What to choose in 2019 (Updated)," 16 2018 [Online] Available: https://medium.com/@TechMagic/reactjs-vs-angular5vs-vue-js-what-to-choose-in-2018-b91e028fa91d [Accessed 10 2019] A S Foundation, "Apache CouchDB," [Online] Available: http://couchdb.apache.org/ [Accessed 12 2019] "IBM Cloud Documentation," [Online] Available: https://cloud.ibm.com/docs [Accessed 12 06 2019] "Vue Guide," [Online] Available: https://vuejs.org/v2/guide/ [Accessed 12 2019] J Bemenderfer, "Using v-model for Two-Way Binding in Vue.js," 2017 [Online] Available: https://alligator.io/vuejs/v-model-two-way-binding/ [Accessed 12 06 2019] 75 10 "Instance Lifecycle Hooks," [Online] Available: https://vuejs.org/v2/guide/instance.html#Instance-Lifecycle-Hooks [Accessed 12 06 2019] 11 Moeddami, "Nuxt Material Admin," [Online] Available: https://github.com/moeddami/nuxt-material-admin [Accessed 12 05 2019] 76 ... MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM HỒNG ANH DŨNG – 14520192 KHĨA LUẬN TỐT NGHIỆP XÂY DỰNG HỆ THỐNG SO SÁNH GIÁ GIỮA CÁC TRANG THƯƠNG MẠI ĐIỆN TỬ PRICE COMPARING SYSTEM... triển thương mại điện tử 22 2.1.2 Phân biệt thương mai điện tử kinh doanh điện tử .23 2.1.3 Các hình thức thương mại điện tử 23 2.1.4 Lợi ích thương mại điện tử 25 2.2 Cách hoạt... động Thương mại điện tử 25 2.2.1 Định nghĩa Thương mại điện tử 25 2.2.2 Lợi ích thương mại điện tử doanh nghiệp 26 2.2.3 Xác định đối tượng tham gia hệ thống 29 2.3 Xây dựng hệ