Xây dựng web bán hàng sử dụng net core và reactjs

MỤC LỤC PHẦN 1: MỞ ĐẦU 1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI MỤC ĐÍCH CỦA ĐỀ TÀI ĐỐI TƯỢNG VÀ PHẠM VI NGHIÊN CỨU 3.1 Đối tượng nghiên cứu 3.2 Phạm vi nghiên cứu KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC PHẦN 2: NỘI DUNG CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 1.1 Tìm hiểu NET core 1.1.1 Khái niệm [1] 1.1.2 Lịch sử phát triển [2] 1.1.3 Đặc điểm NET Core [3] 1.1.4 Ưu điểm NET Core [4] 1.2 Tìm hiểu ReactJS 1.2.1 Khái niệm [5] 1.2.2 Lịch sử phát triển [5] 1.2.3 Đặc điểm ReactJS [6] 1.2.4 Ưu điểm ReactJS [7] CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG 2.1 Khảo sát trạng 2.2 Khảo sát website liên quan 2.2.1 Khảo sát trang https://shopee.vn/ 2.2.2 Khảo sát trang https://www.nguyenkim.com/ 2.2.3 Khảo sát trang https://www.bachhoaxanh.com/ 10 2.2.4 Khảo sát trang https://tiki.vn/ 11 2.2.5 Khảo sát trang https://www.sendo.vn/ 12 CHƯƠNG 3: XÁC ĐỊNH U CẦU – MƠ HÌNH HĨA YÊU CẦU 14 3.1 Xác định yêu cầu 14 3.1.1 Yêu cầu chức 14 3.1.2 Yêu cầu phi chức 14 3.1.3 Yêu cầu hệ thống 15 3.2 Mơ hình hóa yêu cầu 15 3.2.1 Usecase Diagram 15 3.2.2 Đặc tả 16 CHƯƠNG 4: THIẾT KẾ PHẦN MỀM 27 4.1 Thiết kế lược đồ lớp 27 4.2 Thiết kế sở liệu 28 4.2.1 Lược đồ sở liệu 28 4.2.2 Mô tả chi tiết 28 4.2.3 Ràng buộc toàn vẹn 36 4.3 Thiết kế xử lý 40 4.3.1 Chức xem trang chủ 40 4.3.2 Chức đăng ký 41 4.3.3 Chức đăng nhập 42 4.3.4 Chức đổi mật 43 4.3.5 Chức tìm kiếm sản phẩm 44 4.3.6 Chức xem giỏ hàng 45 4.3.7 Chức quản lý đơn hàng 46 4.3.8 Chức thống kê 47 4.3.9 Chức thêm sản phẩm 48 4.3.10 Chức sửa sản phẩm 49 4.3.11 Chức xóa sản phẩm 50 4.4 Thiết kế giao diện 51 4.4.1 Màn hình “Trang chủ” 51 4.4.2 Màn hình “Đăng ký” 53 4.4.3 Màn hình “Đăng nhập” 54 4.4.5 Màn hình “Quên mật khẩu” 55 4.4.6 Màn hình “Các sản phẩm trang chủ” 56 4.4.7 Màn hình “Chi tiết sản phẩm” 58 4.4.8 Màn hình “Giỏ hàng” 60 4.4.9 Màn hình “Giao diện đăng nhập trang admin” 62 4.4.10 Màn hình “Trang chủ admin” 63 4.4.11 Màn hình “Quản lý user” 64 4.4.12 Màn hình “Quản lý danh mục” 66 4.4.13 Màn hình “Quản lý nguồn cung” 70 4.4.14 Màn hình “Quản lý sản phẩm” 73 4.4.15 Màn hình “Quản lý thống kê” 78 4.4.16 Màn hình “Quản lý đơn hàng” 79 4.4.17.Màn hình “Quản lý đánh giá” 82 CHƯƠNG 5: CÀI ĐẶT KIỂM THỬ 85 5.1 Cài đặt 85 5.2 Kiểm thử 86 5.2.1 Kiểm thử phía khách hàng 86 5.2.2 Kiểm thử phía quản trị viên 89 PHẦN 3: KẾT LUẬN 93 KẾT QUẢ ĐẠT ĐƯỢC 93 ƯU ĐIỂM 93 NHƯỢC ĐIỂM 93 HƯỚNG PHÁT TRIỂN 94 TÀI LIỆU THAM KHẢO 95 DANH MỤC HÌNH ẢNH Hình Hình ảnh minh họa website shopee.vn Hình Hình ảnh minh họa website nguyenkim.com Hình Hình ảnh minh họa website bachhoaxanh.com 10 Hình Hình ảnh minh họa website tiki.vn 11 Hình Hình ảnh minh họa website semndo.vn 12 Hình Sơ đồ usecase 15 Hình Hình vẽ lược đồ lớp 27 Hình Hình ảnh database 28 Hình Lược đồ chức xem trang chủ 40 Hình 10 Lược đồ chức đăng ký 41 Hình 11 Lược đồ chức đăng nhập 42 Hình 12 Lược đồ chức đổi mật 43 Hình 13 Lược đồ chức tìm kiếm sản phẩm 44 Hình 14 Lược đồ chức tìm xem giỏ hàng 45 Hình 15 Lược đồ chức quản lý đơn hàng 46 Hình 16 Lược đồ chức thống kê 47 Hình 17 Lược đồ chức thêm sản phẩm 48 Hình 18 Lược đồ chức sửa sản phẩm 49 Hình 19 Lược đồ chức xóa sản phẩm 50 Hình 20 Màn hình trang chủ 51 Hình 21 Màn hình đăng ký 53 Hình 22 Màn hình đăng nhập 54 Hình 23 Màn hình quên mật 55 Hình 24 Màn hình sản phẩm trang chủ 56 Hình 25 Màn hình chi tiết sản phẩm 58 Hình 26 Màn hình giỏ hàng 60 Hình 27 Màn hình tốn 61 Hình 28 Màn hình giao diện đăng nhập trang admin 62 Hình 29.Màn hình trang chủ admin 63 Hình 30 Màn hình quản lý user 64 Hình 31 Màn hình khóa tài khoản 65 Hình 32 Màn hình mở tài khoản 66 Hình 33 Màn hình quản lý danh mục 66 Hình 34 Màn hình thêm danh mục 67 Hình 35 Màn hình chỉnh sửa danh mục 68 Hình 36 Màn hình xóa danh mục 69 Hình 37 Màn hình quản lý nguồn cung 70 Hình 38 Màn hình thêm nhà cung cấp 71 Hình 39 Màn hình cập nhật nhà cung cấp 72 Hình 40 Màn hình xóa nhà cung cấp 72 Hình 41 Màn hình quản lý sản phẩm 73 Hình 42 Màn hình thêm sản phẩm 74 Hình 43 Màn hình cập nhật sản phẩm 75 Hình 44 Màn hình xóa sản phẩm 77 Hình 45 Màn hình thống kê doanh thu 78 Hình 46 Màn hình xem chi tiết doanh thu 79 Hình 47 Màn hình quản lý đơn hàng 79 Hình 48 Màn hình xem chi tiết đơn hàng 80 Hình 49 Màn hình xác nhận đơn hàng 81 Hình 50 Màn hình hủy đơn hàng 82 Hình 51 Màn hình quản lý đánh giá 82 Hình 52 Màn hình xem chi tiết đánh giá 83 Hình 53 Màn hình duyệt đánh giá 84 DANH MỤC BẢNG Bảng Đặc tả usecase đăng ký 16 Bảng Đặc tả usecase đăng nhập 16 Bảng Đặc tả usecase xem sản phẩm 16 Bảng Đặc tả usecase xem theo danh mục 17 Bảng Đặc tả usecase xem sản phẩm 17 Bảng Đặc tả usecase thêm vào giỏ hàng 17 Bảng Đặc tả usecase tìm kiếm sản phẩm 18 Bảng Đặc tả usecase quản lý giỏ hàng 18 Bảng Đặc tả usecase toán 18 Bảng 10 Đặc tả usecase đăng xuất 19 Bảng 11 Đặc tả usecase bình luận sản phẩm 19 Bảng 12 Đặc tả usecase trả lời bình luận 19 Bảng 13 Đặc tả usecase đổi mật 20 Bảng 14 Đặc tả usecase quản lý thông tin cá nhân 20 Bảng 15 Đặc tả usecase quản lý user 20 Bảng 16 Đặc tả usecase khóa tài khoản 21 Bảng 17 Đặc tả usecase mở tài khoản 21 Bảng 18 Đặc tả usecase thống kê doanh thu 21 Bảng 19 Đặc tả usecase quản lý sản phẩm 22 Bảng 20 Đặc tả usecase thêm sản phẩm 22 Bảng 21 Đặc tả usecase sửa sản phẩm 22 Bảng 22 Đặc tả usecase xóa sản phẩm 23 Bảng 23 Đặc tả usecase quản lý danh mục 23 Bảng 24 Đặc tả usecase quản lý danh mục 23 Bảng 25 Đặc tả usecase quản lý đánh giá 24 Bảng 26 Đặc tả usecase xem đánh giá 24 Bảng 27 Đặc tả usecase duyệt đánh giá 24 Bảng 28 Đặc tả usecase xóa đánh giá 25 Bảng 29 Đặc tả usecase quản lý đơn hàng 25 Bảng 30 Đặc tả usecase xem đơn hàng 25 Bảng 31 Đặc tả usecase xác nhận đơn hàng 26 Bảng 32 Đặc tả usecase xóa đơn hàng 26 Bảng 33 Chi tiết bảng liệu AppUserRoles 28 Bảng 34 Chi tiết bảng liệu Roles 29 Bảng 35 Chi tiết bảng liệu replies 29 Bảng 36 Chi tiết bảng liệu Evaluations 30 Bảng 37 Chi tiết bảng liệu Users 31 Bảng 38 Chi tiết bảng liệu order 32 Bảng 39 Chi tiết bảng liệu OrderDetail 33 Bảng 40 Chi tiết bảng liệu providers 33 Bảng 41.Chi tiết bảng liệu products 34 Bảng 42 Chi tiết bảng liệu images 35 Bảng 43 Chi tiết bảng liệu Category 35 Bảng 44 Ràng buộc tất collections 36 Bảng 45.Ràng buộc phân quyền 36 Bảng 46 Ràng buộc sản phẩm loại sản phẩm 37 Bảng 47 Ràng buộc user đánh giá 37 Bảng 48 Ràng buộc trả lời bình luận đánh giá 37 Bảng 49 Ràng buộc đánh giá sản phẩm 38 Bảng 50 Ràng buộc đơn hàng, chi tiết đơn hàng 38 Bảng 51 Ràng buộc chi tiết hóa đơn 38 Bảng 52 Ràng buộc mua hàng 39 Bảng 53 Mơ tả hình trang chủ 52 Bảng 54 Mơ tả hình đăng ký 54 Bảng 55 Mơ tả hình đăng nhập 55 Bảng 56 Mô tả hình quên mật 56 Bảng 57 Mô tả hình sản phẩm trang chủ 57 Bảng 58 Mô tả hình chi tiết sản phẩm 59 Bảng 59 Mô tả hình giỏ hàng 60 Bảng 60 Mô tả hình tốn 62 Bảng 61 Mơ tả hình đăng nhập trang admin 63 Bảng 62 Mơ tả hình trang chủ admin 64 Bảng 63 Mơ tả hình quản lý user 65 Bảng 64 Mơ tả hình khố tài khoản 65 Bảng 65 Mơ tả hình mở tài khoản 66 Bảng 66 Mơ tả hình quản lý danh mục 67 Bảng 67 Mơ tả hình thêm danh mục 68 Bảng 68 Mơ tả hình chỉnh sửa danh mục 68 Bảng 69 Mô tả hình xóa danh mục 69 Bảng 70 Mô tả hình quản lý nguồn cung 70 Bảng 71 Mô tả hình xóa danh mục 71 Bảng 72 Mô tả hình cập nhật nhà cung cấp 72 Bảng 73 Mô tả hình xóa nhà cung cấp 73 Bảng 74 Mơ tả hình quản lý sản phẩm 74 Bảng 75 Mơ tả hình thêm sản phẩm 75 Bảng 76 Mơ tả hình cập nhật sản phẩm 76 Bảng 77 Mơ tả hình xóa sản phẩm 77 Bảng 78 Mơ tả hình thống kê doanh thu 78 Bảng 79 Mơ tả hình xem chi tiết doanh thu 79 Bảng 80 Mơ tả hình quản lý đơn hàng 80 Bảng 81 Mơ tả hình xem chi tiết đơn hàng 81 Bảng 82 Mơ tả hình xác nhận đơn hàng 81 Bảng 83 Mô tả hình hủy đơn hàng 82 Bảng 84 Mô tả hình quản lý đánh giá 83 Bảng 85 Mô tả hình xem chi tiết đánh giá 84 Bảng 86 Mô tả hình duyệt đánh giá 84 Bảng 87.Bảng kiểm thử phía khách hàng 88 Bảng 88 Bảng kiểm thử phía quản trị viên 92 PHẦN 1: MỞ ĐẦU TÍNH CẤP THIẾT CỦA ĐỀ TÀI Xã hội ngày phát triển, sống người lúc cải thiện nhu cầu sống, làm việc giải trí người ngày tăng cao Để đáp ứng nhu cầu xã hội, nhiều công nghệ tiên tiến đời, người áp dụng sống cách hiệu Nói đến cơng nghệ thơng tin nói đến tiện lợi nhanh chóng mà đem lại cho người Nó trở thành phần thiếu sống Công nghệ thay ta làm việc mà người chưa làm giúp giải vấn đề đau đầu tính tốn số lớn lưu liệu khổng lồ cách dễ dàng Trong thời buổi kinh tế đất nước ngày phát triển ngày Nhu cầu mua sắm hàng hóa người ngày tăng, mà số lượng cửa hàng liên tục xuất rộng rãi Trên thực tế cửa hàng áp dụng hình thức cách thủ công mà chưa áp dụng CNTT vào công việc Khi khách hàng mua hàng phải đến tận nơi để mua hàng Việc gây nhiều khó khăn cho khách hàng lẫn số lượng doanh thu bán hàng cửa hàng dẫn đến việc số lượng hàng hóa tồn kho nhiều Với dự án “Xây dựng website bán hàng sử dụng NET Core ReactJS” đáp ứng phần nhu cầu mua hàng cách nhanh chóng tiện lợi cho khách hàng Khách hàng mua sản phẩm nơi xa, vận chuyển tới tận nơi không cần phải đến cửa hàng bán sản phẩm để mua hàng Sản phẩm cửa hàng bán nhiều hạn chế việc sản phẩm tồn kho MỤC ĐÍCH CỦA ĐỀ TÀI - Tìm hiểu cơng nghệ NET Core ReactJS - Ứng dụng công nghệ xây dựng website bán hàng - Viết báo cáo khoa học ĐỐI TƯỢNG VÀ PHẠM VI NGHIÊN CỨU 3.1 Đối tượng nghiên cứu - Công nghệ NET Core, ReactJS - Lĩnh vực phát triển: website bán hàng 3.2 Phạm vi nghiên cứu - Tìm hiểu cơng nghệ sử dụng đề tài: NET Core, ReactJS - Tìm hiểu nghiệp vụ website bán hàng - Tìm hiểu nghiệp vụ liên quan đến phát triển website hồn chỉnh, có tính khả thi cao KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC - Hiểu cách lập trình sử dụng công nghệ NET Core, ReactJS - Hiểu nghiệp vụ website bán hàng - Xây dựng website bán hàng với tính giúp: + Khách hàng: Tìm kiếm sản phẩm, bình luận đánh giá sản phẩm, thêm sản phẩm vào giỏ hàng tiến hành đặt hàng + Quản lý: Xác nhận đơn hàng, quản lý tất sản phẩm thống kê doanh thu Mô tả : Giao diện giao diện xem chi tiết đơn hàng Danh sách đối tượng: STT Loại đối tượng Mô tả Lable Hiển thị tên khách hàng Lable Hiển thị tổng giá tiền Textbox Hiển thị ghi khách hàng Table Hiển thị thông tin sản phẩm đơn hàng Thanh điều hướng phân trang Điều hướng phân trang sản phẩm đơn hàng nhiều hiển thị giao diện Bảng 81 Mơ tả hình xem chi tiết đơn hàng Hình 49 Màn hình xác nhận đơn hàng Mô tả : Giao diện giao diện xác nhận đơn hàng Danh sách đối tượng: STT Loại đối tượng Mô tả Lable Hiển thị thông báo duyệt đơn hàng Button Button hủy trình Button Button xác nhận Bảng 82 Mơ tả hình xác nhận đơn hàng 81 Hình 50 Màn hình hủy đơn hàng Mơ tả : Giao diện giao diện hủy đơn hàng Danh sách đối tượng: STT Loại đối tượng Mô tả Input Nơi nhập nguyên nhân hủy đơn hàng Button Button hủy trình Button Button xác nhận Bảng 83 Mơ tả hình hủy đơn hàng 4.4.17.Màn hình “Quản lý đánh giá” Hình 51 Màn hình quản lý đánh giá 82 Mô tả : Giao diện giao diện quản lý đánh giá Danh sách đối tượng: STT Loại đối tượng Mô tả Table Hiển thị danh sách đánh giá Button Button hiển thị chi tiết đánh giá Button Button duyệt đánh giá Button Button xóa đánh giá Thanh điều hướng chuyển trang Điều hướng phân trang đánh giá nhiều hiển thị giao diện Bảng 84 Mô tả hình quản lý đánh giá Hình 52 Màn hình xem chi tiết đánh giá 83 Mơ tả : Giao diện giao diện quản lý xem chi tiết đánh giá Danh sách đối tượng: STT Loại đối tượng Mô tả Image Hiển thị ảnh đại diện khách hàng Lable Hiển thị tên khách hàng Thẻ SVG Hiển thị icon đánh giá sản phẩm Textbox Hiển thị tiêu đề đánh giá Textbox Hiển thị nội dung đánh giá Bảng 85 Mô tả hình xem chi tiết đánh giá Hình 53 Màn hình duyệt đánh giá Mô tả : Giao diện giao diện duyệt đánh giá Danh sách đối tượng: STT Loại đối tượng Mô tả Lable Hiển thị thông báo chấp nhận đánh giá Button Button hủy trình Button Button xác nhận duyệt đánh giá Bảng 86 Mô tả hình duyệt đánh giá 84 CHƯƠNG 5: CÀI ĐẶT KIỂM THỬ 5.1 Cài đặt Việc lựa chọn công nghệ cho phù hợp với ứng dụng muốn phát triển điều quan trọng Với phát triển công nghệ thông tin nay, nhiều công nghệ đời, xuất nhiều ngôn ngữ để đáp ứng cho nhiều nhu cầu khác thuộc lĩnh vực khác Đề tài “Xây dựng website bán hàng sử dụng NET Core ReactJS” xây dựng dựa vào kiến thức nghiệp vụ kết hợp với cơng nghệ có ngơn ngữ C# Các phần mềm yêu cầu phải cài đặt như:  Visual Studio 2019 Visual Studio môi trường phát triển tích hợp (IDE) từ Microsoft, cơng cụ hỗ trợ lập trình chun nghiệp Nó sử dụng để phát triển chương trình máy tính cho Microsoft Windows, trang web, ứng dụng web dịch vụ web Version sử dụng: 16.5.4  SQL Server 2017 SQL ngôn ngữ phi thủ tục, không yêu cầu cách thức truy cập sở liệu Tất thông báo SQL dễ dàng sử dụng mắc lỗi SQL cung cấp tập lệnh phong phú cho công việc hỏi đáp liệu như: + Chèn, xóa cập nhật hàng quan hệ + Thêm, xóa sửa đổi đối tượng sở liệu + Điều khiển việc truy cấp tới sở liệu đối tượng sở liệu để đảm bảo tính bảo mật, tính quán ràng buộc sở liệu Version sử dụng: 15.0.18206.0  Visual Studio Code Visual Studio Code trình biên tập mã phát triển Microsoft dành cho Windows, Linux macOS Nó hỗ trợ chức debug, kèm với Git, có syntax highlighting, tự hồn thành mã thơng minh, snippets, cải tiến mã nguồn Nó cho phép tùy chỉnh, đó, người dùng thay đổi theme, phím tắt, cá tùy chọn khác 85 Trên Visual Studio Code cài đặt thêm gói mở rộng để tiện lợi cho việc code ngôn ngữ khác có ReactJS Version sử dụng: 1.46.1 5.2 Kiểm thử 5.2.1 Kiểm thử phía khách hàng STT Test name Kiểm tra màu sắc độ nét thành phần giao diện Test description Mở website thay đổi độ sáng hình từ 100% > 25% Output Nội dung chữ, hình ảnh nhìn rõ Result Pass Mở trang web, nhấn Kiểm tra chuyển chuyển trang thông qua Các trang load nhanh button , đường link chóng, địa trang Pass có website Mở website , đăng nhập Kiểm tra đăng nhập website với tài khoản user Thử đăng nhập sai tên đăng nhập mật Đăng nhập thành công, báo lỗi đăng nhập sai Pass Mở website , chuyển đến trang đăng ký tài Đăng ký tài khoản thành công khoản , nhập thông tin Kiểm tra đăng ký nhấn button đăng ký Nhập thông tin sai với yêu cầu không kiểu liệu 86 Pass Thông báo cung cấp thông tin sai sai kiểu liệu Kiểm tra chức xem thông tin cá nhân Nhấn vào nút thông tin Thông tin cá nhân hiển thị đầy đủ cá nhân Pass Kiểm tra chức Nhập thông tin cần cập Thông tin lưu lại cập nhật thông tin nhật nhấn nút xác hiển thị trang thông tin cá nhân nhận cá nhân Kiểm tra chức Nhập email nhấn xác đổi mật Pass nhận Liên kết đổi mật gửi email xuất Pass thông báo hình Kiểm tra chức Nhấn vào nút danh mục Sản phẩm thuộc danh mục xem sản phẩm theo sản phẩm chọn danh thị danh mục Kiểm tra xem chi tiết sản phẩm mục cần xem Pass hình Nhấn vào tên hình Màn hình chuyển trang ảnh sản thị thơng tin Pass chi tiết sản phẩm phẩm Hệ thống kiểm tra tên, tên trùng với phần tên 10 Kiểm tra chức tìm kiếm sản phẩm Nhập nội dung tìm kiếm sản phẩm nhấn vào nút tìm sản phẩm thị ra, kiếm Pass khơng trùng xuất thơng báo khơng tìm sản phẩm Kiểm tra chức Chọn sản phẩm 11 thêm sản phẩm vào nhân nút thêm vào giỏ giỏ hàng 12 Kiểm tra chức xem giỏ hàng hàng Sản phẩm thêm vào giỏ hàng số lượng mặt hàng nút giỏ hàng tăng Pass lên Các sản phẩm Nhấn nút giỏ hàng thêm vào thị có tổng số tiền 87 Pass Kiểm tra chức Trên giao diện giỏ hàng, 13 chỉnh sửa sản phẩm thay đổi số lượng giỏ hàng xóa sản phẩm Các sản phẩm tăng giảm số lượng xóa khỏi đơn hàng tổng số Pass tiền cập nhật liên tục Nếu tài khoản chưa đăng nhập chuyển tới trang đăng nhập Nếu tài khoản 14 Kiểm tra chức Nhập nội dung bình luận đăng nhập nội dung bình luận nhấn nút xác nhận bình luận lưu xuống Pass sở liệu giao diện load lại hiển thị nội dung bình luận Nếu nội dung chưa đầy đủ 15 Kiểm tra chức tốn Nhập thơng tin trang tốn nhấn nút xác nhận thị thơng báo Nếu nội dung đầy đủ hợp lệ đơn hàng lưu Pass mặt hàng giỏ hàng bị xóa 16 Kiểm thử chức đăng xuất Nhấn vào nút đăng xuất Tài khoản đăng xuất khỏi hệ thống Bảng 87.Bảng kiểm thử phía khách hàng 88 Pass 5.2.2 Kiểm thử phía quản trị viên STT Test name Kiểm tra màu sắc độ nét thành phần giao diện Kiểm tra chuyển trang Kiểm Test description Mở website thay đổi độ sáng hình từ 100% > 25% Result Nội dung chữ, hình ảnh nhìn rõ Trên trang quản lý, nhấn Các trang Pass chức Nhấn vào tab sản phẩm Trang web quản lý danh chọn quản lý danh chuyển trang danh mục Pass load chuyển trang thơng qua nhanh chóng, địa button tra Output mục Pass mục thị lên Trang thêm danh mục hiển thị Nhấn vào nút tạo danh Nếu thông tin không hợp Kiểm tra chức lệ thông báo thất bại, mục thêm danh Nhập thông tin mục nhấn nút xác nhận hợp lệ lưu, Pass xuất thông báo thành công hiển thị danh mục trang quản lý danh mục Trang chỉnh sửa danh Kiểm tra Nhấn vào nút chỉnh sửa mục thị với thông chức danh mục tin danh mục chỉnh sửa Nhập nội dung chỉnh Nếu nội dung không hợp danh mục sửa nhấn nút xác lệ thông báo thất bại, nhận hợp lệ nội dung lưu, xuất thông báo 89 Pass trang quản lý danh mục load lại Nếu thất bại xuất thơng Kiểm tra chức xóa danh mục báo thất bại, thành Nhấn vào nút xóa cơng danh mục sản phẩm xóa logic, ẩn Pass xuất thông báo thành công Kiểm tra chức Nhấn vào tab sản phẩm Trang web quản lý sản chọn quản lý sản chuyển trang sản phẩm Pass phẩm thị phẩm Trang thêm sản phẩm hiển thị Nhấn vào nút tạo sản Nếu thông tin không hợp Kiểm tra chức thêm sản lệ thông báo thất bại, phẩm Nhập thông tin phẩm nhấn nút xác nhận hợp lệ lưu, Pass xuất thông báo thành công hiển thị sản phẩm trang quản lý danh mục Trang chỉnh sửa sản phẩm thị với thông tin Nhấn vào nút chỉnh sửa sản phẩm Kiểm tra chức sản phẩm Nếu nội dung khơng hợp chỉnh sửa Nhập nội dung chỉnh lệ thông báo thất bại, sản phẩm sửa nhấn nút xác hợp lệ nội dung lưu, xuất thông báo nhận trang quản lý sản phẩm load lại 90 Pass Nếu thất bại xuất thơng 10 Kiểm tra xóa báo thất bại, thành chức sản Chọn sản phẩm cần xóa phẩm cơng sản phẩm xóa logic, ẩn Pass xuất thông báo thành công Kiểm 11 tra chức xem chi tiết sản phẩm 12 Kiểm tra thống 13 tra kê chức Trên trang thống kê, thống kê doanh chọn thời gian nhấn 15 16 nút thống kê tra chức quản lý user Kiểm tra chức khóa user liệu lên bảng Mở tab người dùng Trang web chuyển chọn quản lý người trang thị tài dùng Chọn tài khoản cần khóa Tài khoản chuyển từ nhấn nút khóa tài trạng thái sử dụng khóa phục nhấn nút mở từ trạng thái khóa hàng Pass thành khóa khoản mở Pass thành sử dụng khóa quản lý đơn Pass khoản user chức Pass biểu đồ cột chức Chọn tài khoản cần khôi Tài khoản chuyển tra Pass Trên trang thống kê, tra user 17 diện chi tiết sản phẩm Kiểm Kiểm Pass thống kê hình thức chọn hình thức thống kê, Kiểm phẩm thị giao kê chọn biểu đồ thông trang thị giao diện thu 14 tiết sản phẩm Thơng tin chi tiết sản chức Nhấn vào tab thông kê Trang web chuyển doanh thu Kiểm Nhấn vào nút xem chi Trang web Mở tab đơn hàng chuyển trang đến trang chọn quản lý đơn hàng quản lý đơn hàng, đơn hàng hiển thị 91 Pass Trang web chuyển trang đến trang đơn hàng chưa duyệt, 18 Xác hàng nhận đơn Mở tab đơn hàng, chọn xác nhận đơn hàng đơn hàng chưa duyệt đơn hàng lưu vào nhấn nút xác nhận trang quản lý đơn hàng xóa đơn hàng khỏi trang đơn hàng chưa duyệt Bảng 88 Bảng kiểm thử phía quản trị viên 92 PHẦN 3: KẾT LUẬN KẾT QUẢ ĐẠT ĐƯỢC “Xây dựng website bán hàng sử dụng NET Core ReactJS” thuận tiện cho việc mua sản phẩm diễn cách nhanh chóng xác Trong đề tài này, vận dụng kiến thức học Visual Studio 2017, SQL Server 2017 nghiệp vụ việc xây dựng website bán hàng đáp ứng yêu cầu bản:  Khách hàng: Tìm kiếm sản phẩm, bình luận sản phẩm, thêm sản phẩm vào giỏ hàng, đặt hàng  Quản lý: Quản lý sản phẩm, quản lý khách hàng, quản lý đơn hàng, quản lý đánh giá, quản lý danh mục  Thống kê: Doanh thu theo tháng tháng năm  Hệ thống: Đăng ký, đăng nhập, đổi mật khẩu, đăng xuất ƯU ĐIỂM Ứng dụng có ưu điểm sau: - Đáp ứng chức cần thiết cho trang web bán hàng - Giúp quản lý sản phẩm, người dùng dễ dàng hiệu - Giúp quản lý việc đặt hàng cách khoa học hiệu quả, giảm rủi ro đơn hàng ảo, từ giúp chăm sóc khách hàng tốt - Giao diện đẹp, dễ sử dụng NHƯỢC ĐIỂM - Chưa sâu vào vấn đề bảo mật - Do thời gian có hạn nên cịn chức chưa hồn thiện: + Thơng báo + Nhắn tin trực tuyến + Thanh toán online 93 HƯỚNG PHÁT TRIỂN Trong thời gian tới, chúng em cố gắng khắc phục hạn chế mở rộng thêm tính chương trình như:  Thông báo  Nhắn tin trực tuyến  Thanh toán online 94 TÀI LIỆU THAM KHẢO [1] Introduction to NET Core - Microsoft https://docs.microsoft.com/vi-vn/dotnet/core/introduction [2] NET Core - Wikipedia https://en.wikipedia.org/wiki/.NET_Core [3] NET Core overview - Microsoft https://docs.microsoft.com/vi-vn/dotnet/core/about [4] ADVANTAGES OF NET CORE - FORTECH https://www.fortech.ro/top-advantages-net-core/ [5] React (web framework) - Wikipedia https://en.wikipedia.org/wiki/React_(web_framework) [6] JavaTpoint - Trang web học lập trình https://www.javatpoint.com/react-features [7] ADVANTAGES OF USING REACT.JS – DA14 https://da-14.com/blog/its-high-time-reactjs-ten-reasons-give-it-try 95 ... mua hàng Việc gây nhiều khó khăn cho khách hàng lẫn số lượng doanh thu bán hàng cửa hàng dẫn đến việc số lượng hàng hóa tồn kho nhiều Với dự án ? ?Xây dựng website bán hàng sử dụng NET Core ReactJS? ??... trình sử dụng cơng nghệ NET Core, ReactJS - Hiểu nghiệp vụ website bán hàng - Xây dựng website bán hàng với tính giúp: + Khách hàng: Tìm kiếm sản phẩm, bình luận đánh giá sản phẩm, thêm sản phẩm vào... mật với NET Core - NET Core cho phép hiệu suất ứng dụng hàng đầu - NET Core cho phép linh hoạt - NET Core có hiệu chi phi - NET Core có cộng đồng lớn - NET Core tạo Microsoft 1.2 Tìm hiểu ReactJS