(Đồ án tốt nghiệp) xây dựng website bán hàng thời trang sử dụng công nghệ ASP net core

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH ĐỒ ÁN TỐT NGHIỆP NGÀNH CÔNG NGHỆ THÔNG TIN XÂY DỰNG WEBSITE BÁN HÀNG THỜI TRANG SỬ DỤNG CÔNG NGHỆ ASP.NET CORE GVHD:NGUYỄN MINH ĐẠO SVTH:NGÔ VĂN TÚ MSSV:16110255 SVTH:PHẠM XUÂN KHIÊM MSSV:16110120 SKL007075 Tp Hồ Chí Minh, tháng 07/2020 TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH KHOA ĐÀO TẠO CHẤT LƯỢNG CAO  ĐỒ ÁN TỐT NGHIỆP XÂY DỰNG WEBSITE BÁN HÀNG THỜI TRANG SỬ DỤNG CÔNG NGHỆ ASP.NET CORE SVTH : NGÔ VĂN TÚ MSSV : 16110255 SVTH : PHẠM XUÂN KHIÊM MSSV : 16110120 Khóa : 2016 Ngành : CƠNG NGHỆ THƠNG TIN GVHD : THS NGUYỄN MINH ĐẠO Tp Hồ Chí Minh, tháng năm 2020 CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tự – Hạnh phúc *** -Tp Hồ Chí Minh, ngày 01 tháng 07 năm 2020 NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP Họ tên sinh viên: Ngô Văn Tú Họ tên sinh viên: Phạm Xuân Khiêm Ngành: Công Nghệ Thông Tin Giảng viên hướng dẫn: Nguyễn Minh Đạo Ngày nhận đề tài: 16/02/2020 MSSV: 16110255 MSSV: 16110120 Lớp: 16110CLST2 16110CLST4 ĐT: 090 398 2082 Ngày nộp đề tài: 01/07/2020 Tên đề tài: Xây dựng website bán hàng thời trang sử dụng công nghệ ASP.NET Core Các số liệu, tài liệu ban đầu: sách link trang web phần tài liệu tham khảo Nội dung thực đề tài: - Phát triển thêm tính cần thiết khác cho hệ thống website - Nghiên cứu nghiệp vụ để thống kê số liệu (Dashboard) - Tìm hiểu cách tích hợp tốn trực tuyến Paypal - Tìm hiểu cơng nghệ ASP.NET SignalR để xây dựng tính chat (real-time) - Tìm hiểu Recommendation System để tích hợp vào hệ thống website Sản phẩm: website bán hàng thời trang TRƯỞNG NGÀNH GIẢNG VIÊN HƯỚNG DẪN Nguyễn Đăng Quang Nguyễn Minh Đạo i CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tư – Hạnh phúc ******* PHIẾU NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN MSSV: 16110255 Họ tên Sinh viên: Ngô Văn Tú MSSV: 16110120 Họ tên Sinh viên: Phạm Xuân Khiêm Ngành: Công nghệ thông tin Tên đề tài: Xây dựng website bán hàng thời trang sử dụng công nghệ ASP.NET Core Họ tên Giảng viên hướng dẫn: Nguyễn Minh Đạo NHẬN XÉT Về nội dung đề tài & khối lượng thưc hiện: Ưu điểm: Khuyết điểm: Đề nghị cho bảo vệ hay không? ………………………………………………………………………………………… Đánh giá loại: Điểm: (Bằng chữ: ) Tp Hồ Chí Minh, ngày 01 tháng 07 năm 2020 Giảng viên hướng dẫn (Ký & ghi rõ họ tên) ii CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập – Tư – Hạnh phúc ******* PHIẾU NHẬN XÉT CỦA GIẢNG VIÊN PHẢN BIỆN MSSV: 16110255 Họ tên Sinh viên: Ngô Văn Tú MSSV: 16110120 Họ tên Sinh viên: Phạm Xuân Khiêm Ngành:Công nghệ thông tin Tên đề tài: Xây dựng website bán hàng thời trang sử dụng công nghệ ASP.NET Core Họ tên Giảng viên phản biện: Lương Vĩ Minh NHẬN XÉT Về nội dung đề tài & khối lượng thưc hiện: Ưu điểm: Khuyết điểm: Đề nghị cho bảo vệ hay không? ………………………………………………………………………………………… Đánh giá loại: Điểm: (Bằng chữ: ) Tp Hồ Chí Minh, ngày 01 tháng 07 năm 2020 Giảng viên phản biện (Ký & ghi rõ họ tên) iii LỜI CẢM ƠN Đầu tiên, nhóm chúng em học kỳ gửi lời cảm ơn chân thành đến Khoa Đào tạo Chất lượng cao Khoa tạo điều kiện tốt để bạn sinh viên hoàn thành đồ án tốt nghiệp, đặc biệt học kỳ này, sinh viên toàn trường khoảng thời gian dài khoảng ba tháng để nghỉ dịch COVID-19 Do đó, việc lên lịch thời gian cho kế hoạch trước vấn đề khó khăn khoa khoa có điều chỉnh hợp lý, tạo thời gian tốt để bạn sinh viên hoàn thành kịp tiến độ đồ án cách tốt Chúng em xin cảm ơn khoa nhiều Và chúng em gửi lời cảm ơn thầy cô môn Trong suốt năm học qua, thầy cô truyền đạt nhiều kiến thức hay, bổ ích, giúp nhóm vận dụng nhiều đồ án tốt nghiệp đặc biệt hành trang bước vào đời trường Cuối cùng, chúng em xin gửi lời cảm ơn sâu sắc đển thầy Nguyễn Minh Đạo Trước hết, cảm ơn thầy nhận hướng dẫn nhóm đồ án tốt nghiệp Lúc nhóm nhận đề tài từ thầy lúc mà đất nước chống dịch COVID-19, việc gặp gỡ trao đổi trực tiếp gần khơng thể, thay vào nhóm thầy phải trao đổi qua mạng, làm việc online, sau có thơng báo đến trường lại nhóm thầy gặp nhiều Nhóm biết thầy bận, ngồi việc dạy, thầy cịn làm việc cho trung tâm phần mềm trường lần chúng em có khó khăn, thắc mắc q trình thực đồ án cần liên hệ với thầy, thầy sẵn sàng gặp gỡ trao đổi Thầy giải đáp thắc mắc tận tình, đưa hướng giải hợp lý, đề xuất phương án, tính cho đồ án phù hợp với nhu cầu người dùng thực tế Những đóng góp ý kiến, sự hướng dẫn thầy giúp nhóm cải thiện chất lượng đồ án, đảm bảo tiến độ hoàn thành đồ án tốt Một lần nữa, chúng em cảm ơn thầy nhiều chúc thầy mạnh khỏe, giữ vững lửa nhiệt huyết, truyền đạt kiến thức mới, hay bổ ích đến cho bạn sinh viên Sự thiếu sót đồ án điều khó tránh khỏi, mong nhận đóng góp ý kiến, phản hồi từ thầy bạn Chúng em xin chân thành cảm ơn Nhóm sinh viên Ngô Văn Tú - Phạm Xuân Khiêm iv LỜI MỞ ĐẦU Đây đề tài phát triển từ tiểu luận chuyên ngành nhóm Các vấn đề nghiên cứu, khảo sát trạng từ trang web lớn hoạt động nhiều kỳ khóa luận nhóm giải Việc khảo sát trạng trang web lớn giúp nhóm bắt kịp xu hướng thiết kế giao diện, từ gam màu chức Mục tiêu phát triển đề tài hồn thiện trang web mức nâng cao, chưa hoàn thiện để sử dụng thị trường Củng cố lại chức làm, chức đăng nhập, đăng ký, thêm vào giỏ, tốn bắt buộc phải có cho trang web thương mại cần phát triển thêm tính nâng cao tính Chat trực tuyến, toán trực tuyến quan trọng hệ thống gợi ý (recommendation systems) giúp tăng trải nghiệm cho người dùng Xây dựng module quản lý tiện lợi, nhanh chóng chi tiết rõ ràng Kết đạt nhóm tốt, hồn thành tương đối mục tiêu đề ra, có tính chưa hoàn thiện hết mức 95% Ứng dụng triển khai môi trường thực tế với kết 93% so với chạy môi trường local v MỤC LỤC NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP i PHIẾU NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN ii PHIẾU NHẬN XÉT CỦA GIẢNG VIÊN PHẢN BIỆN .iii LỜI CẢM ƠN iv LỜI MỞ ĐẦU v MỤC LỤC vi DANH SÁCH HÌNH ẢNH xi DANH SÁCH BẢNG BIỂU .xiv Chương 1: TỔNG QUAN 1.1 Khảo sát trạng 1.2 Giới thiệu đề tài 1.3 Mục tiêu đề tài Chương 2: CƠ SỞ LÝ THUYẾT 2.1 Công nghệ ASP.NET Core 2.1.1 Công nghệ ASP.NET Core gì? 2.1.2 So sánh sự khác công nghệ ASP.NET ASP.NET Core 2.1.3 Ưu, nhược điểm công nghệ ASP.NET Core 2.2 Công nghệ ASP.NET Core SignalR 2.3 Mơ hình MVC 2.4 Hệ thống gợi ý (Recommendation Systems) 2.4.1 Hệ thống gợi ý dựa nội dung sản phẩm (Content-based Recommender Systems) 2.4.2 Hệ thống gợi ý dựa người dùng – lọc cộng tác (Collaborative filtering recommender system) 11 Chương 3: XÁC ĐỊNH YÊU CẦU 16 3.1 Yêu cầu người dùng 16 3.2 Yêu cầu hệ thống 17 3.2.1 Các tác nhân 17 vi 3.2.2 Lược đồ chức 3.2.2.1.1 Thanh toán 3.2.2.1.2 Trò chuyện trực tuyến 3.2.2.1.3 Quản lý đơn hàng 3.2.2.1.4 Trình quản lý hội thoại Chương 4: THIẾT KẾ HỆ THỐNG 4.1 Kiến trúc hệ thống 4.2 Lược đồ lớp 4.2.1 Database 4.2.2 DB Context 4.2.3 Repository 4.2.4 Services 4.2.5 Presentation 4.3 Lược đồ tuần tự 4.3.1 Lược đồ tuần tự chức đánh giá sản phẩm 4.3.2 Lược đồ tuần tự chức thêm sản phẩm yêu thích 4.3.3 Lược đồ tuần tự c vii 4.3.4 Lược đồ tuần tự chức lấy sản phẩm từ hệ thống gợi ý sản phẩm 39 4.4 Thiết kế sở liệu 40 4.4.1 Mơ hình quan hệ thực thể (ERD) 40 4.4.2 Mơ hình vật lý 41 4.5 Thiết kế giao diện 42 4.5.1 Kiến trúc tổng quan giao diện 42 4.5.1.1 Luồng đường hình phía khách (chưa đăng nhập) 42 4.5.1.2 Luồng đường hình phía người dùng (đã đăng nhập) 45 4.5.1.3 Luồng đường hình phía quản trị viên/nhân viên 47 4.5.2 Đặc tả chi tiết giao diện hình 49 4.5.2.1 Màn hình trang chủ 49 4.5.2.2 Màn hình đặt lại mật 52 4.5.2.3 Màn hình cập nhật mật 53 4.5.2.4 Màn hình chi tiết sản phẩm 54 4.5.2.5 Màn hình toán 58 4.5.2.6 Màn hình liên hệ 60 4.5.2.7 Màn hình giới thiệu 61 4.5.2.8 Màn hình thơng tin tài khoản 62 4.5.2.9 Màn hình đổi mật 64 4.5.2.10 Màn hình lịch sử đơn hàng 65 4.5.2.11 Màn hình chi tiết đơn hàng 66 4.5.2.12 Màn hình sản phẩm yêu thích 67 4.5.2.13 Màn hình sản phẩm xem 69 4.5.2.14 Modal hội thoại trực tuyến chưa đăng nhập 71 4.5.2.15 Modal hội thoại trực tuyến đăng nhập 72 4.5.2.16 Modal quản lý tài khoản cá nhân 73 4.5.2.17 Màn hình Dashboard 74 4.5.2.18 Màn hình quản lý đánh giá 75 4.5.2.19 Màn hình trình quản lý hội thoại trực tuyến 76 viii Báo cáo đồ án tốt nghiệp RV04 Để phần đề giá RV05 Thực đánh với số mặc định Chương 6: Kết so sánh, thực nghiệm, tổng hợp Báo cáo đồ án tốt nghiệp RV06 Thực đánh giá để rổng thông (trừ tiêu đề) RV07 Thực đánh chọn nhiều hình ảnh Chương 6: Kết so sánh, thực nghiệm, tổng hợp Báo cáo đồ án tốt nghiệp [4]: Chọn số đánh giá, điền tiêu đề, nội dung chọn nhiều hình ảnh [5]: Nhấn nút “REVIEW” 6.1.2 Trường hợp thử nghiệm chức Sản phẩm xem Bảng 2: Trường hợp thử nghiệm chức sản phẩm xem Mã Tiêu đề VL01 Đưa sản phầm vào sách xem Cách xếp sản phẩm vào sách xem VL02 6.1.3 Trường hợp thử nghiệm chức Thêm sản phẩm yêu thích Bảng 3: Trường hợp thử nghiệm chức Thêm sản phẩm yêu thích Mã Tiêu đề AW01 Thêm sản phẩm yêu tích từ mặt hàng sản phẩm Chương 6: Kết so sánh, thực nghiệm, tổng hợp Báo cáo đồ án tốt nghiệp AW02 Thêm sản phẩm thích phần tiết phẩm 6.1.4 Trường hợp thử nghiệm chức Hội thoại trưc tuyến Bảng 4: Trường hợp thử nghiệm chức Hội thoại trực tuyến Mã Tiêu đề CO01 Gửi nhắn rỗng Chương 6: Kết so sánh, thực nghiệm, tổng hợp Báo cáo đồ án tốt nghiệp CO02 Gửi nhắn thường CO03 Nhận nhắntừ khách hàng Chương 6: Kết so sánh, thực nghiệm, tổng hợp Báo cáo đồ án tốt nghiệp CO04 Trả nhắn rỗng CO05 Trả lời tin nhắn thường Chương 6: Kết so sánh, thực nghiệm, tổng hợp Báo cáo đồ án tốt nghiệp 6.1.5 Trường hợp thử nghiệm chức Thanh toán Bảng 5: Trường hợp thử nghiệm chức Thanh toán Mã Tiêu đề CK01 Thanh toán COD CK02 Thanh toán PayPal Chương 6: Kết so sánh, thực nghiệm, tổng hợp Báo cáo đồ án tốt nghiệp CK03 Thiếu thông cá tốn COD CK04 Thanh tốn COD khơng chọn phương thức COD 6.2 Kết thưc nghiệm ứng dụng mơi trường thưc tế Hình 1: URL ứng dụng deploy Kết đạt - URL website: https://atomstorevn.site/ Kết deploy ứng dụng so với chạy localhost 95% chức Website cài đặt chứng SSL Chương 6: Kết so sánh, thực nghiệm, tổng hợp Báo cáo đồ án tốt nghiệp Hình 2: Chất lượng SSL website Chương 6: Kết so sánh, thực nghiệm, tổng hợp Báo cáo đồ án tốt nghiệp Chương 7: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 7.1 Kết Vận dụng công nghệ ASP.NET Core Nắm nghiệp vụ quản lý từ trang web hoạt động Nắm vận dụng công nghệ ASP.NET SignalR việc xây dựng tính real-time, tính Chat trực tuyến Biết cách tích hợp phương thức tốn trực tuyến PayPal vào ứng dụng Hồn thành mục tiêu chức Áp dụng machine learning vào dự án, xây dựng hệ thống gợi ý quan trọng ứng dụng Xây dựng chức thêm sản phẩm yêu thích, sản phẩm xem, tương đối quan trọng trải nghiệm người dùng ứng dụng Triển khai ứng dụng lên môi trường thực tế - Ưu điểm Giao diện tương đối bắt mắt, thân thiện, gam màu phù hợp với xu hướng website thương mại giới Thao tác đơn giản, dễ dàng sử dụng Dễ bảo trì Chạy nhiều trình duyệt Chạy đa tảng - Nhược điểm Tuy giao diện thân thiện, bắt mắt có số lỗi nhỏ vài chỗ, ảnh hưởng không tốt đến trải nghiệm người dùng Responesive số chỗ chưa tốt, gây lỗi chạy ứng dụng di động, phần quản trị - 7.2 Khó khăn Cịn hạn chế kiến thức vận dụng cơng nghệ Ứng dụng áp dụng cho cửa hàng nhỏ, không yêu cầu chức phức tạp đầy đủ chức cần thiết Triển khai ứng dụng môi trường thực tế bị lỗi bảo mật việc xác nhận email đăng ký đăng nhập facebook 7.3 Hướng phát triển Học hỏi kiến thức, quy tắc Front-end để thiết kế giao diện hoàn chỉnh, đạt chuẩn hơn, chạy tốt nhiều thiết bị Xây dựng tính cách tốt hơn, tạo trải nghiệm tốt cho người dùng Chương 7: Kết luận hướng phát triển Báo cáo đồ án tốt nghiệp Chạy tốt nhiều trình duyệt, đặc biệt trình duyệt cũ Thêm đa ngôn ngữ cho ứng dụng Ứng dụng real-time nhiều Áp dụng nhiều cơng nghệ khác, thay dùng chung quanh thư viện Microsoft Áp dụng công nghệ Xamarin xây dựng ứng dụng di dộng 7.4 Mã nguồn https://github.com/khiempham1010/KLTN_FStore Chương 7: Kết luận hướng phát triển Báo cáo đồ án tốt nghiệp TÀI LIỆU THAM KHẢO Tiếng Việt TOPDev, ASP.NET Core gì?, https://topdev.vn/blog/asp-net-core-la-gi/, truy cập ngày 13-10-2019 [1] TechBlog, Hệ thống gợi ý hướng tiếp cận, https://techblog.vn/he-thonggoi-y-va-cac-huong-tiep-can, truy cập ngày 19-5-2020 [2] Tiếng Anh Microsoft, NET Core Guide, https://docs.microsoft.com/en-us/dotnet/core/, truy cập ngày 06-11-2019 [3] Microsoft, Facebook external login setup in ASP.NET Core, https://docs.microsoft.com/en-us/aspnet/core/security/authentication/social/facebooklogins?view=aspnetcore-3.1, truy cập ngày 06-11-2019 [4] Microsoft, Google external login setup in ASP.NET Core, https://docs.microsoft.com/en-us/aspnet/core/security/authentication/social/googlelogins?view=aspnetcore-3.1, truy cập ngày 13-11-2019 [5] [6] Microsoft, Using a CAPTCHA to Prevent Bots from Using Your ASP.NET Web Pages (Razor) Site, https://docs.microsoft.com/en-us/aspnet/webpages/overview/security/using-a-catpcha-to-prevent-automated-programs-bots-fromusing-your-aspnet-web-site, truy cập ngày 20-11-2019 Microsoft, Checkout and Payment with PayPal, https://docs.microsoft.com/enus/aspnet/web-forms/overview/getting-started/getting-started-with-aspnet-45-webforms/checkout-and-payment-with-paypal, truy cập ngày 2-4-2020 [7] Microsoft, Introduction to ASP.NET Core SignalR, https://docs.microsoft.com/en-us/aspnet/core/signalr/introduction?view=aspnetcore3.1, truy cập ngày 1-5-2020 [8] Microsoft, Tutorial: Get started with ASP.NET Core SignalR, https://docs.microsoft.com/en-us/aspnet/core/tutorials/signalr?view=aspnetcore3.1&tabs=visualstudio&fbclid=IwAR3DzpVeWgS8iKW9VleegU87n_43j1T2oAomEjmmgNdJPGNM RHa-IGm7nSg, truy cập ngày 2-5-2020 [9] Scott Clayton, CODE PROJECT, Building a Recommendation Engine in C#, https://www.codeproject.com/Articles/1232150/Building-a-Recommendation-Enginein[10] Tài liệu tham khảo Báo cáo đồ án tốt nghiệp Csharp?fbclid=IwAR0p2DJYVe2VNi0vZ22KhyKmN8o2TU99k9Jg5vkhMsNOtHYJq _LsIcVJwgE, truy cập ngày 20-5-2020 Dot NET, Chat Application using ASP.NET Core SignalR with User Identity, https://www.youtube.com/watch?v=RUZLIh4Vo20, truy cập ngày 2-5-2020 [11] Learning Programming, PayPal Payment with ASP.NET Core MVC, https://www.youtube.com/watch?v=BuA8Cq2mWOI, truy cập ngày 2-4-2020 [12] Tài liệu tham khảo ... 2.1 Công nghệ ASP. NET Core 2.1.1 Công nghệ ASP. NET Core gì? 2.1.2 So sánh sự khác công nghệ ASP. NET ASP. NET Core 2.1.3 Ưu, nhược điểm công nghệ ASP. NET Core 2.2 Công nghệ. .. đồ án tốt nghiệp b) Vận dụng tốt công nghệ ASP. NET Core ASP. NET Core công nghệ áp dụng việc xây dựng hệ thống Cơng nghệ ASP. NET Core tìm hiểu lần thực tiểu luận chuyên ngành áp dụng để xây. .. Code sử dụng C# F# Hiệu tốt ASP. NET 4.x Chạy NET Core NET Framework Nhỏ, nhẹ module hóa Sử dụng NET Core runtime 2.1.3 Ưu, nhược điểm công nghệ ASP. NET Core Ưu điểm Những tảng cải tiến từ ASP. NET