Các sàn thương mại điện tử lớn hiện nay không chỉ đáp ứng nhu cầu của ngườimua, mà còn là nơi để những người bán đăng bán sản phẩm của họ, mô hình này đượcbiết đến theo tên gọi C2C custo
Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN
1 Mô hình hóa yêu cầu
3 Thiết kế cơ sở dữ liệu
4 Hướng phát triển Tài liệu tham khảo.
Tuần Ngày Nhiệm vụ (Công việc dự kiến) Sản phẩm Ghi chú
- Khảo sát hiện trạng - Hiện trạng 5
- Thiết kế use case và mô hình hóa trang web
- Thiết kế sơ đồ lớp điện tử, sơ đồ use case và sơ đồ lớp
- Tìm hiểu về React JS - Tài liệu về
4 3/4 – 9/4 - Tìm hiểu về ASP.NET Core React JS và
- Tìm hiểu về Entity Framework - Tài liệu về
5 10/4 – 16/4 - Tìm hiểu về Redux Framework
- Tiến hành triển khai phía máy chủ - Các trang giao dựa trên các lược đồ use case và diện cho từng
6+7+8+9+10 17/4 – 21/5 yêu cầu chức năng có
- Tiến hành xây dựng giao diện theo thể tương tác yêu cầu với máy chủ.
- Tích hợp dần giao diện và API
- Tích hợp hoàn thiện giao diện và - Ứng dụng
13 6/6 – 12/6 - Tìm hiểu, sửa đổi, tối ưu hệ thống - Ứng dụng được sửa
- Kiểm thử chương trình và tiến - Ứng dụng đã
14 13/6 – 19/6 hành sửa lỗi được kiểm thử
- Chỉnh sửa tổng hợp báo cáo và sửa lỗi.
15 20/6 – 26/6 - Hoàn tất chương trình hoàn chỉnh để in và nộp.
Giáo viên hướng dẫn Tp Hồ Chí Minh, ngày tháng năm
(Ký và ghi rõ họ tên) Người viết đề cương
(Ký và ghi rõ họ tên)
LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2
1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI 13
2 MỤC ĐÍCH CỦA ĐỀ TÀI 13
3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU 14
4 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 14
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 16
1.1 Giới thiệu về ASP.NET Core 16
1.3 Xây dựng web api với ASP.NET Core 16
2.1 Giới thiệu về React JS 17
3.1 Giới thiệu Entity Framework Core 19
CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 21
2.2 Yêu cầu phi chức năng 26
CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 28
1 MÔ HÌNH HÓA YÊU CẦU 28
3 THIẾT KẾ CƠ SỞ DỮ LIỆU 57
3.1 Lược đồ cơ sở dữ liệu 57
3.2 Chi tiết bảng dữ liệu 58
4.3 Giao diện người quản trị 78
CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 86
1.1 Các công cụ sử dụng 86
1.2 Các công nghệ sử dụng 86
4 HƯỚNG PHÁT TRIỂN 96 TÀI LIỆU THAM KHẢO 98
Bảng 1: Use case Đăng ký 29
Bảng 2: Use case tìm kiếm sản phẩm 30
Bảng 3: Use case xem chi tiết sản phẩm 31
Bảng 4: Use case đăng nhập 32
Bảng 5: Use case đổi mật khẩu 33
Bảng 6: Use case thay đổi thông tin cá nhân 34
Bảng 7: Use case thêm sản phẩm vào giỏ hàng 34
Bảng 8: Use case đặt hàng 35
Bảng 9: Usecase hủy đơn hàng 36
Bảng 10: Use case đánh giá sản phẩm 36
Bảng 11: Use case thêm sản phẩm mới 37
Bảng 12: Use case xem sản phẩm của shop 38
Bảng 13: Use case chuẩn bị hàng 38
Bảng 14: Use case xem danh sách đơn hàng 39
Bảng 15: Use case thống kê giao dịch của shop 39
Bảng 16: Use case rút tiền từ ví của shop 40
Bảng 18: Use case giao hàng 41
Bảng 19: Use case hủy đơn hàng của shipper 41
Bảng 20: Use case xác nhận đơn hàng 42
Bảng 21: Use case quản lý shippers 43
Bảng 22: Use case quản lý danh mục sản phẩm 43
Bảng 23: Use case quản lý thuộc tính sản phẩm 44
Bảng 24: Use case xem đơn hàng dành cho admin 45
Bảng 25: Use case từ chối đơn hàng chờ xác nhận 45
Bảng 26: Use case xem thống kê doanh thu 46
Bảng 27: Use case quản lý mã giảm giá của hệ thống 46
Bảng 28: Use case xem thống kê giao dịch 47
Bảng 29: Chi tiết dữ liệu bảng Address 58
Bảng 30: Chi tiết dữ liệu bảng AspNetUser 59
Bảng 31: Chi tiết dữ liệu bảng CancelledOrderInfo 60
Bảng 32: Chi tiết dữ liệu bảng Cart 60
Bảng 33: Chi tiết dữ liệu bảng Category 61
Bảng 34: Chi tiết dữ liệu bảng CategorySelectProperty 61
Bảng 35: Chi tiết dữ liệu bảng CategoryTypingProperty 61
Bảng 36: Chi tiết dữ liệu bảng Customer 61
Bảng 37: Chi tiết dữ liệu bảng Order 62
Bảng 38: Chi tiết dữ liệu bảng OrderItems 62
Bảng 39: Chi tiết dữ liệu bảng OrderStatusTrackings 63
Bảng 40: Chi tiết dữ liệu bảng Product 63
Bảng 41: Chi tiết dữ liệu bảng ProductImage 63
Bảng 42: Chi tiết dữ liệu bảng ProductSelectValue 64
Bảng 43: Chi tiết dữ liệu bảng ProductTypingValue 64
Bảng 44: Chi tiết dữ liệu bảng ProductVariant 64
Bảng 45: Chi tiết dữ liệu bảng ProductVariantCombination 64
Bảng 46: Chi tiết dữ liệu bảng ProductVariantOption 65
Bảng 47: Chi tiết dữ liệu bảng ProductViewingTrackings 65
Bảng 48: Chi tiết dữ liệu bảng SelectProperty 65
Bảng 49: Chi tiết dữ liệu bảng SelectValue 66
Bảng 50: Chi tiết dữ liệu bảng Shipper 66
Bảng 51: Chi tiết dữ liệu bảng TypingProperty 66
Bảng 52: Chi tiết dữ liệu bảng Transaction 66
Bảng 53: Chi tiết dữ liệu bảng AdminDiscount 67
Bảng 54: Mô tả giao diện trang chủ 68
Bảng 55: Mô tả giao diện lọc sản phẩm 69
Bảng 56: Mô tả giao diện giỏ hàng 70
Bảng 57: Mô tả giao diện trang checkout (nửa trên) 70
Bảng 58: Mô tả giao diện chi tiết sản phẩm (nửa trên) 71
Bảng 59: Mô tả giao diện chi tiết sản phẩm (nửa dưới) 72
Bảng 60: Mô tả giao diện chọn mã giảm giá 73
Bảng 61: Mô tả giao diện form tạo mới địa chỉ 74
Bảng 62: Mô tả giao diện quản lý đơn hàng 75
Bảng 63: Mô tả giao diện quản lý sản phẩm 75
Bảng 64: Mô tả giao diện thêm sản phẩm (thông tin cơ bản) 76
Bảng 65: Mô tả giao diện thêm sản phẩm (thông tin bán hàng) 77
Bảng 66: Mô tả giao diện thêm sản phẩm (thông tin vận chuyển) 78
Bảng 67: Mô tả giao diện quản lý đơn hàng (người bán) 78
Bảng 68: Mô tả giao diện quản lý danh mục sản phẩm 79
Bảng 69: Mô tả giao diện quản lý thuộc tính sản phẩm 80
Bảng 70: Mô tả giao diện quản lý mã giảm giá 81
Bảng 71: Mô tả giao diện tạo mã giảm giá 82
Bảng 72: Mô tả giao diện quản lý các giao dịch 83
Bảng 73: Mô tả giao diện lấy đơn hàng 84
Bảng 74: Mô tả giao diện giao hàng 85
Bảng 75: Kịch bản kiểm thử 88
Bảng 76: Kết quả kiểm thử của chức năng xác nhận đơn hàng 89
Bảng 77: Kết quả kiểm thử của chức năng chuẩn bị hàng 90
Bảng 78: Kết quả kiểm thử chức năng đặt hàng với hình thức thanh toán paypal 92
Hình 6: Use case cho người dùng 28
Hình 7: Use case cho người quản trị 29
Hình 8: Lược đồ tuần tự chức năng đăng nhập 48
Hình 9: Lược đồ tuần tự chức năng đăng ký 49
Hình 10: Lược đồ tuần tự chức năng thêm sản phẩm 50
Hình 11: Lược đồ tuần tự chức năng thêm vào giỏ hàng 50
Hình 12: Lược đồ tuần tự chức năng đặt hàng 51
Hình 13: Lược đồ tuần tự chức năng xác nhận đơn hàng 51
Hình 14: Lược đồ tuần tự chức năng chuẩn bị hàng 52
Hình 15: Lược đồ tuần tự chức năng lấy hàng 52
Hình 16: Lược đồ tuần tự chức năng giao hàng 53
Hình 17: Lược đồ tuần tự chức năng tạo mới danh mục 53
Hình 18: Lược đồ tuần tự chức năng tạo thuộc tính 54
Hình 19: Lược đồ tuần tự chức năng hủy đơn hàng của người mua 54
Hình 20: Lược đồ tuần tự chức năng tạo mới tài khoản shipper 55
Hình 21: Lược đồ lớp thực thể 56
Hình 22: Lược đồ lớp điều khiển và dịch vụ 57
Hình 23: Lược đồ cơ sở dữ liệu 58
Hình 24: Giao diện trang chủ 68
Hình 25: Giao diện lọc sản phẩm 69
Hình 26: Giao diện giỏ hàng 69
Hình 27: Giao diện trang checkout (nửa trên) 70
Hình 28: Giao diện trang checkout (nửa dưới) 71
Hình 29: Giao diện chi tiết sản phẩm (nửa trên) 71
Hình 30: Giao diện chi tiết sản phẩm (nửa dưới) 72
Hình 31: Giao diện chọn mã giảm giá 73
Hình 32: Giao diện form tạo mới địa chỉ 74
Hình 33: Giao diện quản lý đơn hàng 74
Hình 34: Giao diện quản lý sản phẩm 75
Hình 35: Giao diện thêm sản phẩm (thông tin cơ bản) 76
Hình 36: Giao diện thêm sản phẩm (thông tin thuộc tính) 76
Hình 37: Giao diện thêm sản phẩm (thông tin bán hàng) 77
Hình 38: Giao diện thêm sản phẩm ( thông tin vận chuyển) 77
Hình 39: Giao diện quản lý đơn hàng (người bán) 78
Hình 40: Giao diện quản lý danh mục sản phẩm 79
Hình 41: Giao diện quản lý thuộc tính sản phẩm 80
Hình 42: Giao diện quản lý mã giảm giá 81
Hình 43: Giao diện tạo mã giảm giá 82
Hình 44: Giao diện quản lý các giao dịch 83
Hình 45: Giao diện lấy đơn hàng 84
Hình 46: Giao diện giao hàng 84
Hình 47: Kết quả mong đợi và thực tế của test case TC_AD_01 90
Hình 48: Kết quả mong đợi và thực tế của test case TC_AD_02 90
Hình 49: Kết quả mong đợi và thực tế của test case TC_SE_01 92
Hình 50: Kết quả mong đợi và thực tế của testcase TC_SE_02 92 Hình 51: Kết quả mong đợi và thực tế của test case TC_CS_01 94 Hình 52: Kết quả mong đợi và thực tế của test case TC_CS_02 95
1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI
Ngày nay với sự phát triển của ngành công nghệ thông tin, mọi lĩnh vực trong xã hội đều được thúc đẩy phát triển mạnh mẽ, đặc biệt là với lĩnh vực thương mại, với sự ra đời của các hình thức mua sắm trực tuyến, nhu cầu về mua sắm của người tiêu dùng càng tăng nhanh chóng bởi sự tiện lợi của nó Thương mại điện đang dần trở thành xu hướng tất yếu, là tác nhân cốt lõi thúc đẩy nền kinh tế toàn cầu phát triển.
Các sàn thương mại điện tử lớn hiện nay không chỉ đáp ứng nhu cầu của người mua, mà còn là nơi để những người bán đăng bán sản phẩm của họ, mô hình này được biết đến theo tên gọi C2C (customer to customer), được đánh giá là mô hình tiềm năng phát triển lớn với sự tham gia của những “ông lớn” trong lĩnh vực bán hàng như Tiki, Shoppe, Lazada Theo đó mô hình C2C tối ưu chi phí cho cả người bán lẫn người mua, người bán không phải chịu tác động từ phía doanh nghiệp sản xuất, còn người mua sẽ mua được những sản phẩm với mức giá hợp lý do tính cạnh tranh của mô hình.
Nắm bắt được xu thế mua sắm hiện nay và tiềm năng của mô hình C2C, nhóm chúng tôi đã chọn đề tài “Xây dựng website thương mại điện tử sử dụng ASP.NET Core và React JS” để xây dựng một môi trường giúp mọi người có thể trao đổi mua bán với chi phí tiết kiệm.
2 MỤC ĐÍCH CỦA ĐỀ TÀI
Mục đích của đề tài bao gồm:
- Hiểu và có khả năng ứng dụng ASP.NET Core, React JS và các công nghệ liên quan để xây dựng ứng dụng web.
- Áp dụng các kỹ thuật, công cụ vào quá trình phát triển phần mềm để phát triển một trang web thương mại điện tử dựa theo mô hình C2C với chức năng như một nơi trung gian giúp người mua và người bán trao đổi sản phẩm thuộc nhiều danh mục.
- Sản phẩm là 3 trang web bao gồm: Trang dành cho người quản trị, trang dành cho người bán và trang dành cho người mua.
- Bên cạnh các chức năng chính, hệ thống phải đáp ứng được các yêu cầu phi chức năng như tính bảo mật: Các api endpoint phải được xác thực, mật khẩu của người dùng phải được mã hóa, hệ thống phải được thiết lập cơ chế phân quyền Hiệu suất của hệ thống như: Các câu truy vấn dữ liệu từ cơ sở dữ liệu phải được tối ưu, các ngoại lệ phải được xử lý.
3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU Đối tượng nghiên cứu của đề tài:
Có 2 đối tượng chính mà đề tài nhắm đến: Công nghệ phát triển ứng dụng web và kiến thức về nghiệp vụ, quy trình hoạt động của một trang web thương mại điện tử.
Về đối tượng thứ nhất: Các công nghệ ASP.NET Core để phát triền phía máy chủ cho ứng dụng web Công nghệ React JS để triển khai phía người dùng cho ứng dụng web Ngoài ra còn có các công nghệ, thư viện khác bổ trợ trong quá trình phát triển ứng dụng web như Entity Framework Core, Redux, Json Web Token.
Về đối tượng thứ hai: Các kiến thức về phương thức hoạt động của trang web thương mại điện tử, các giai đoạn đăng ký gian hàng, thêm sản phẩm vào gian hàng của người bán, giai đoạn đặt hàng, theo dõi đơn hàng, xử lý đơn hàng cho đến cách thức thanh toán và quản lý doanh thu của người sở hữu web và người bán.
Phạm vi nghiên cứu của đề tài:
Phạm vi của đề tài tập trung tìm hiểu về các nghiệp vụ, tính năng cơ bản nhất của một trang web thương mại điện tử và vận dụng những kiến thức đó để tạo ra một sản phẩm thực tế bao gồm các tính năng cốt lõi như: Đặt hàng, xử lý đơn hàng, theo dõi đơn hàng, quản lý doanh thu Đề tài cũng không đặt nặng lý thuyết và những tính năng không có hoặc ít ứng dụng trong thực tế.
4 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đề tài đề cao khả khả năng lập trình thông qua việc học tập công nghệ, kỹ thuật để ứng dụng vào việc xây dựng ứng dụng web, hiểu biết được các nghiệp vụ cần có của một ứng dụng web thương mại điện tử.
Bên cạnh ý nghĩa khoa học, đề tài hy vọng mang đến một môi trường công bằng, cạnh tranh và an toàn cho mọi người có thể trao đổi, mua bán với nhau Người mua có thể tìm được sản phẩm mình cần và mua với giá cạnh tranh, người bán có được môi trường tự do buôn bán Qua đó góp phần thúc đẩy sự phát triển của thương mại điện tử ở nước ta.
CƠ SỞ LÝ THUYẾT
REDUX
1 Mô hình hóa yêu cầu
3 Thiết kế cơ sở dữ liệu
4 Hướng phát triển Tài liệu tham khảo.
Tuần Ngày Nhiệm vụ (Công việc dự kiến) Sản phẩm Ghi chú
- Khảo sát hiện trạng - Hiện trạng 5
- Thiết kế use case và mô hình hóa trang web
- Thiết kế sơ đồ lớp điện tử, sơ đồ use case và sơ đồ lớp
- Tìm hiểu về React JS - Tài liệu về
4 3/4 – 9/4 - Tìm hiểu về ASP.NET Core React JS và
- Tìm hiểu về Entity Framework - Tài liệu về
5 10/4 – 16/4 - Tìm hiểu về Redux Framework
- Tiến hành triển khai phía máy chủ - Các trang giao dựa trên các lược đồ use case và diện cho từng
6+7+8+9+10 17/4 – 21/5 yêu cầu chức năng có
- Tiến hành xây dựng giao diện theo thể tương tác yêu cầu với máy chủ.
- Tích hợp dần giao diện và API
- Tích hợp hoàn thiện giao diện và - Ứng dụng
13 6/6 – 12/6 - Tìm hiểu, sửa đổi, tối ưu hệ thống - Ứng dụng được sửa
- Kiểm thử chương trình và tiến - Ứng dụng đã
14 13/6 – 19/6 hành sửa lỗi được kiểm thử
- Chỉnh sửa tổng hợp báo cáo và sửa lỗi.
15 20/6 – 26/6 - Hoàn tất chương trình hoàn chỉnh để in và nộp.
Giáo viên hướng dẫn Tp Hồ Chí Minh, ngày tháng năm
(Ký và ghi rõ họ tên) Người viết đề cương
(Ký và ghi rõ họ tên)
LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2
1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI 13
2 MỤC ĐÍCH CỦA ĐỀ TÀI 13
3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU 14
4 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 14
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 16
1.1 Giới thiệu về ASP.NET Core 16
1.3 Xây dựng web api với ASP.NET Core 16
2.1 Giới thiệu về React JS 17
3.1 Giới thiệu Entity Framework Core 19
CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 21
2.2 Yêu cầu phi chức năng 26
CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 28
1 MÔ HÌNH HÓA YÊU CẦU 28
3 THIẾT KẾ CƠ SỞ DỮ LIỆU 57
3.1 Lược đồ cơ sở dữ liệu 57
3.2 Chi tiết bảng dữ liệu 58
4.3 Giao diện người quản trị 78
CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 86
1.1 Các công cụ sử dụng 86
1.2 Các công nghệ sử dụng 86
4 HƯỚNG PHÁT TRIỂN 96 TÀI LIỆU THAM KHẢO 98
Bảng 1: Use case Đăng ký 29
Bảng 2: Use case tìm kiếm sản phẩm 30
Bảng 3: Use case xem chi tiết sản phẩm 31
Bảng 4: Use case đăng nhập 32
Bảng 5: Use case đổi mật khẩu 33
Bảng 6: Use case thay đổi thông tin cá nhân 34
Bảng 7: Use case thêm sản phẩm vào giỏ hàng 34
Bảng 8: Use case đặt hàng 35
Bảng 9: Usecase hủy đơn hàng 36
Bảng 10: Use case đánh giá sản phẩm 36
Bảng 11: Use case thêm sản phẩm mới 37
Bảng 12: Use case xem sản phẩm của shop 38
Bảng 13: Use case chuẩn bị hàng 38
Bảng 14: Use case xem danh sách đơn hàng 39
Bảng 15: Use case thống kê giao dịch của shop 39
Bảng 16: Use case rút tiền từ ví của shop 40
Bảng 18: Use case giao hàng 41
Bảng 19: Use case hủy đơn hàng của shipper 41
Bảng 20: Use case xác nhận đơn hàng 42
Bảng 21: Use case quản lý shippers 43
Bảng 22: Use case quản lý danh mục sản phẩm 43
Bảng 23: Use case quản lý thuộc tính sản phẩm 44
Bảng 24: Use case xem đơn hàng dành cho admin 45
Bảng 25: Use case từ chối đơn hàng chờ xác nhận 45
Bảng 26: Use case xem thống kê doanh thu 46
Bảng 27: Use case quản lý mã giảm giá của hệ thống 46
Bảng 28: Use case xem thống kê giao dịch 47
Bảng 29: Chi tiết dữ liệu bảng Address 58
Bảng 30: Chi tiết dữ liệu bảng AspNetUser 59
Bảng 31: Chi tiết dữ liệu bảng CancelledOrderInfo 60
Bảng 32: Chi tiết dữ liệu bảng Cart 60
Bảng 33: Chi tiết dữ liệu bảng Category 61
Bảng 34: Chi tiết dữ liệu bảng CategorySelectProperty 61
Bảng 35: Chi tiết dữ liệu bảng CategoryTypingProperty 61
Bảng 36: Chi tiết dữ liệu bảng Customer 61
Bảng 37: Chi tiết dữ liệu bảng Order 62
Bảng 38: Chi tiết dữ liệu bảng OrderItems 62
Bảng 39: Chi tiết dữ liệu bảng OrderStatusTrackings 63
Bảng 40: Chi tiết dữ liệu bảng Product 63
Bảng 41: Chi tiết dữ liệu bảng ProductImage 63
Bảng 42: Chi tiết dữ liệu bảng ProductSelectValue 64
Bảng 43: Chi tiết dữ liệu bảng ProductTypingValue 64
Bảng 44: Chi tiết dữ liệu bảng ProductVariant 64
Bảng 45: Chi tiết dữ liệu bảng ProductVariantCombination 64
Bảng 46: Chi tiết dữ liệu bảng ProductVariantOption 65
Bảng 47: Chi tiết dữ liệu bảng ProductViewingTrackings 65
Bảng 48: Chi tiết dữ liệu bảng SelectProperty 65
Bảng 49: Chi tiết dữ liệu bảng SelectValue 66
Bảng 50: Chi tiết dữ liệu bảng Shipper 66
Bảng 51: Chi tiết dữ liệu bảng TypingProperty 66
Bảng 52: Chi tiết dữ liệu bảng Transaction 66
Bảng 53: Chi tiết dữ liệu bảng AdminDiscount 67
Bảng 54: Mô tả giao diện trang chủ 68
Bảng 55: Mô tả giao diện lọc sản phẩm 69
Bảng 56: Mô tả giao diện giỏ hàng 70
Bảng 57: Mô tả giao diện trang checkout (nửa trên) 70
Bảng 58: Mô tả giao diện chi tiết sản phẩm (nửa trên) 71
Bảng 59: Mô tả giao diện chi tiết sản phẩm (nửa dưới) 72
Bảng 60: Mô tả giao diện chọn mã giảm giá 73
Bảng 61: Mô tả giao diện form tạo mới địa chỉ 74
Bảng 62: Mô tả giao diện quản lý đơn hàng 75
Bảng 63: Mô tả giao diện quản lý sản phẩm 75
Bảng 64: Mô tả giao diện thêm sản phẩm (thông tin cơ bản) 76
Bảng 65: Mô tả giao diện thêm sản phẩm (thông tin bán hàng) 77
Bảng 66: Mô tả giao diện thêm sản phẩm (thông tin vận chuyển) 78
Bảng 67: Mô tả giao diện quản lý đơn hàng (người bán) 78
Bảng 68: Mô tả giao diện quản lý danh mục sản phẩm 79
Bảng 69: Mô tả giao diện quản lý thuộc tính sản phẩm 80
Bảng 70: Mô tả giao diện quản lý mã giảm giá 81
Bảng 71: Mô tả giao diện tạo mã giảm giá 82
Bảng 72: Mô tả giao diện quản lý các giao dịch 83
Bảng 73: Mô tả giao diện lấy đơn hàng 84
Bảng 74: Mô tả giao diện giao hàng 85
Bảng 75: Kịch bản kiểm thử 88
Bảng 76: Kết quả kiểm thử của chức năng xác nhận đơn hàng 89
Bảng 77: Kết quả kiểm thử của chức năng chuẩn bị hàng 90
Bảng 78: Kết quả kiểm thử chức năng đặt hàng với hình thức thanh toán paypal 92
Hình 6: Use case cho người dùng 28
Hình 7: Use case cho người quản trị 29
Hình 8: Lược đồ tuần tự chức năng đăng nhập 48
Hình 9: Lược đồ tuần tự chức năng đăng ký 49
Hình 10: Lược đồ tuần tự chức năng thêm sản phẩm 50
Hình 11: Lược đồ tuần tự chức năng thêm vào giỏ hàng 50
Hình 12: Lược đồ tuần tự chức năng đặt hàng 51
Hình 13: Lược đồ tuần tự chức năng xác nhận đơn hàng 51
Hình 14: Lược đồ tuần tự chức năng chuẩn bị hàng 52
Hình 15: Lược đồ tuần tự chức năng lấy hàng 52
Hình 16: Lược đồ tuần tự chức năng giao hàng 53
Hình 17: Lược đồ tuần tự chức năng tạo mới danh mục 53
Hình 18: Lược đồ tuần tự chức năng tạo thuộc tính 54
Hình 19: Lược đồ tuần tự chức năng hủy đơn hàng của người mua 54
Hình 20: Lược đồ tuần tự chức năng tạo mới tài khoản shipper 55
Hình 21: Lược đồ lớp thực thể 56
Hình 22: Lược đồ lớp điều khiển và dịch vụ 57
Hình 23: Lược đồ cơ sở dữ liệu 58
Hình 24: Giao diện trang chủ 68
Hình 25: Giao diện lọc sản phẩm 69
Hình 26: Giao diện giỏ hàng 69
Hình 27: Giao diện trang checkout (nửa trên) 70
Hình 28: Giao diện trang checkout (nửa dưới) 71
Hình 29: Giao diện chi tiết sản phẩm (nửa trên) 71
Hình 30: Giao diện chi tiết sản phẩm (nửa dưới) 72
Hình 31: Giao diện chọn mã giảm giá 73
Hình 32: Giao diện form tạo mới địa chỉ 74
Hình 33: Giao diện quản lý đơn hàng 74
Hình 34: Giao diện quản lý sản phẩm 75
Hình 35: Giao diện thêm sản phẩm (thông tin cơ bản) 76
Hình 36: Giao diện thêm sản phẩm (thông tin thuộc tính) 76
Hình 37: Giao diện thêm sản phẩm (thông tin bán hàng) 77
Hình 38: Giao diện thêm sản phẩm ( thông tin vận chuyển) 77
Hình 39: Giao diện quản lý đơn hàng (người bán) 78
Hình 40: Giao diện quản lý danh mục sản phẩm 79
Hình 41: Giao diện quản lý thuộc tính sản phẩm 80
Hình 42: Giao diện quản lý mã giảm giá 81
Hình 43: Giao diện tạo mã giảm giá 82
Hình 44: Giao diện quản lý các giao dịch 83
Hình 45: Giao diện lấy đơn hàng 84
Hình 46: Giao diện giao hàng 84
Hình 47: Kết quả mong đợi và thực tế của test case TC_AD_01 90
Hình 48: Kết quả mong đợi và thực tế của test case TC_AD_02 90
Hình 49: Kết quả mong đợi và thực tế của test case TC_SE_01 92
Hình 50: Kết quả mong đợi và thực tế của testcase TC_SE_02 92 Hình 51: Kết quả mong đợi và thực tế của test case TC_CS_01 94 Hình 52: Kết quả mong đợi và thực tế của test case TC_CS_02 95
1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI
Ngày nay với sự phát triển của ngành công nghệ thông tin, mọi lĩnh vực trong xã hội đều được thúc đẩy phát triển mạnh mẽ, đặc biệt là với lĩnh vực thương mại, với sự ra đời của các hình thức mua sắm trực tuyến, nhu cầu về mua sắm của người tiêu dùng càng tăng nhanh chóng bởi sự tiện lợi của nó Thương mại điện đang dần trở thành xu hướng tất yếu, là tác nhân cốt lõi thúc đẩy nền kinh tế toàn cầu phát triển.
Các sàn thương mại điện tử lớn hiện nay không chỉ đáp ứng nhu cầu của người mua, mà còn là nơi để những người bán đăng bán sản phẩm của họ, mô hình này được biết đến theo tên gọi C2C (customer to customer), được đánh giá là mô hình tiềm năng phát triển lớn với sự tham gia của những “ông lớn” trong lĩnh vực bán hàng như Tiki, Shoppe, Lazada Theo đó mô hình C2C tối ưu chi phí cho cả người bán lẫn người mua, người bán không phải chịu tác động từ phía doanh nghiệp sản xuất, còn người mua sẽ mua được những sản phẩm với mức giá hợp lý do tính cạnh tranh của mô hình.
Nắm bắt được xu thế mua sắm hiện nay và tiềm năng của mô hình C2C, nhóm chúng tôi đã chọn đề tài “Xây dựng website thương mại điện tử sử dụng ASP.NET Core và React JS” để xây dựng một môi trường giúp mọi người có thể trao đổi mua bán với chi phí tiết kiệm.
2 MỤC ĐÍCH CỦA ĐỀ TÀI
Mục đích của đề tài bao gồm:
- Hiểu và có khả năng ứng dụng ASP.NET Core, React JS và các công nghệ liên quan để xây dựng ứng dụng web.
- Áp dụng các kỹ thuật, công cụ vào quá trình phát triển phần mềm để phát triển một trang web thương mại điện tử dựa theo mô hình C2C với chức năng như một nơi trung gian giúp người mua và người bán trao đổi sản phẩm thuộc nhiều danh mục.
- Sản phẩm là 3 trang web bao gồm: Trang dành cho người quản trị, trang dành cho người bán và trang dành cho người mua.
- Bên cạnh các chức năng chính, hệ thống phải đáp ứng được các yêu cầu phi chức năng như tính bảo mật: Các api endpoint phải được xác thực, mật khẩu của người dùng phải được mã hóa, hệ thống phải được thiết lập cơ chế phân quyền Hiệu suất của hệ thống như: Các câu truy vấn dữ liệu từ cơ sở dữ liệu phải được tối ưu, các ngoại lệ phải được xử lý.
3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU Đối tượng nghiên cứu của đề tài:
Có 2 đối tượng chính mà đề tài nhắm đến: Công nghệ phát triển ứng dụng web và kiến thức về nghiệp vụ, quy trình hoạt động của một trang web thương mại điện tử.
Về đối tượng thứ nhất: Các công nghệ ASP.NET Core để phát triền phía máy chủ cho ứng dụng web Công nghệ React JS để triển khai phía người dùng cho ứng dụng web Ngoài ra còn có các công nghệ, thư viện khác bổ trợ trong quá trình phát triển ứng dụng web như Entity Framework Core, Redux, Json Web Token.
Về đối tượng thứ hai: Các kiến thức về phương thức hoạt động của trang web thương mại điện tử, các giai đoạn đăng ký gian hàng, thêm sản phẩm vào gian hàng của người bán, giai đoạn đặt hàng, theo dõi đơn hàng, xử lý đơn hàng cho đến cách thức thanh toán và quản lý doanh thu của người sở hữu web và người bán.
Phạm vi nghiên cứu của đề tài:
Phạm vi của đề tài tập trung tìm hiểu về các nghiệp vụ, tính năng cơ bản nhất của một trang web thương mại điện tử và vận dụng những kiến thức đó để tạo ra một sản phẩm thực tế bao gồm các tính năng cốt lõi như: Đặt hàng, xử lý đơn hàng, theo dõi đơn hàng, quản lý doanh thu Đề tài cũng không đặt nặng lý thuyết và những tính năng không có hoặc ít ứng dụng trong thực tế.
4 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đề tài đề cao khả khả năng lập trình thông qua việc học tập công nghệ, kỹ thuật để ứng dụng vào việc xây dựng ứng dụng web, hiểu biết được các nghiệp vụ cần có của một ứng dụng web thương mại điện tử.
Bên cạnh ý nghĩa khoa học, đề tài hy vọng mang đến một môi trường công bằng, cạnh tranh và an toàn cho mọi người có thể trao đổi, mua bán với nhau Người mua có thể tìm được sản phẩm mình cần và mua với giá cạnh tranh, người bán có được môi trường tự do buôn bán Qua đó góp phần thúc đẩy sự phát triển của thương mại điện tử ở nước ta.
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT
1.1 Giới thiệu về ASP.NET Core
ASP.NET Core là một framework đa nền tảng, hiệu suất cao và mã nguồn mở để xây dựng các ứng dụng hiện đại, có khả năng kết nối đám mây, kết nối internet Với ASP.NET Core, chúng ta có thể xây dựng các ứng dụng và dịch vụ web, ứng dụng internet vạn vật và phía máy chủ cho ứng dụng di động [1]
Hàng triệu lập trình viên đang hoặc đã sử dụng ASP.NET 4.x để tạo ứng dụng web ASP.NET Core là bản thiết kế lại của ASP.NET 4.x, bao gồm những thay đổi về kiến trúc dẫn đến một khung mô-đun gọn gàng hơn.
Các tính năng chính của ASP.NET Core:
- Quá trình biên dịch diễn ra liên tục, lập trình viên không cần phải gọi lệnh biên dịch lại.
- Các module được phân phối dưới dạng các Nuget packages.
- Xây dựng và chạy các ứng dụng ASP.NET Core đa nền tảng trên các hệ điều hành: Windows, Mac, Linux
- Các hỗ trợ cho dependency injection được xây dựng sẵn.
1.3 Xây dựng web api với ASP.NET Core
API là viết tắt của Application Programming Interface Nó là một tác nhân phần mềm trung gian cho phép hai hoặc nhiều ứng dụng tương tác với nhau.
ASP.NET Core hỗ trợ tạo các dịch vụ RESTful, còn được gọi là API web Để xử lý các request, web API sử dụng các controllers Controller trong API web là các lớp bắt nguồn từ ControllerBase [2]
Các ưu điểm nổi bật của ASP.NET Core:
- ASP.NET Core là một web framework nhẹ và nhanh.
- Tích hợp dễ dàng với các framework ở phía client như react, angular
- Là một framework mã nguồn mở và tập trung vào cộng đồng.
2.1 Giới thiệu về React JS
KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU
XÁC ĐỊNH YÊU CẦU
1 Mô hình hóa yêu cầu
3 Thiết kế cơ sở dữ liệu
4 Hướng phát triển Tài liệu tham khảo.
Tuần Ngày Nhiệm vụ (Công việc dự kiến) Sản phẩm Ghi chú
- Khảo sát hiện trạng - Hiện trạng 5
- Thiết kế use case và mô hình hóa trang web
- Thiết kế sơ đồ lớp điện tử, sơ đồ use case và sơ đồ lớp
- Tìm hiểu về React JS - Tài liệu về
4 3/4 – 9/4 - Tìm hiểu về ASP.NET Core React JS và
- Tìm hiểu về Entity Framework - Tài liệu về
5 10/4 – 16/4 - Tìm hiểu về Redux Framework
- Tiến hành triển khai phía máy chủ - Các trang giao dựa trên các lược đồ use case và diện cho từng
6+7+8+9+10 17/4 – 21/5 yêu cầu chức năng có
- Tiến hành xây dựng giao diện theo thể tương tác yêu cầu với máy chủ.
- Tích hợp dần giao diện và API
- Tích hợp hoàn thiện giao diện và - Ứng dụng
13 6/6 – 12/6 - Tìm hiểu, sửa đổi, tối ưu hệ thống - Ứng dụng được sửa
- Kiểm thử chương trình và tiến - Ứng dụng đã
14 13/6 – 19/6 hành sửa lỗi được kiểm thử
- Chỉnh sửa tổng hợp báo cáo và sửa lỗi.
15 20/6 – 26/6 - Hoàn tất chương trình hoàn chỉnh để in và nộp.
Giáo viên hướng dẫn Tp Hồ Chí Minh, ngày tháng năm
(Ký và ghi rõ họ tên) Người viết đề cương
(Ký và ghi rõ họ tên)
LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2
1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI 13
2 MỤC ĐÍCH CỦA ĐỀ TÀI 13
3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU 14
4 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 14
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 16
1.1 Giới thiệu về ASP.NET Core 16
1.3 Xây dựng web api với ASP.NET Core 16
2.1 Giới thiệu về React JS 17
3.1 Giới thiệu Entity Framework Core 19
CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 21
2.2 Yêu cầu phi chức năng 26
CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 28
1 MÔ HÌNH HÓA YÊU CẦU 28
3 THIẾT KẾ CƠ SỞ DỮ LIỆU 57
3.1 Lược đồ cơ sở dữ liệu 57
3.2 Chi tiết bảng dữ liệu 58
4.3 Giao diện người quản trị 78
CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 86
1.1 Các công cụ sử dụng 86
1.2 Các công nghệ sử dụng 86
4 HƯỚNG PHÁT TRIỂN 96 TÀI LIỆU THAM KHẢO 98
Bảng 1: Use case Đăng ký 29
Bảng 2: Use case tìm kiếm sản phẩm 30
Bảng 3: Use case xem chi tiết sản phẩm 31
Bảng 4: Use case đăng nhập 32
Bảng 5: Use case đổi mật khẩu 33
Bảng 6: Use case thay đổi thông tin cá nhân 34
Bảng 7: Use case thêm sản phẩm vào giỏ hàng 34
Bảng 8: Use case đặt hàng 35
Bảng 9: Usecase hủy đơn hàng 36
Bảng 10: Use case đánh giá sản phẩm 36
Bảng 11: Use case thêm sản phẩm mới 37
Bảng 12: Use case xem sản phẩm của shop 38
Bảng 13: Use case chuẩn bị hàng 38
Bảng 14: Use case xem danh sách đơn hàng 39
Bảng 15: Use case thống kê giao dịch của shop 39
Bảng 16: Use case rút tiền từ ví của shop 40
Bảng 18: Use case giao hàng 41
Bảng 19: Use case hủy đơn hàng của shipper 41
Bảng 20: Use case xác nhận đơn hàng 42
Bảng 21: Use case quản lý shippers 43
Bảng 22: Use case quản lý danh mục sản phẩm 43
Bảng 23: Use case quản lý thuộc tính sản phẩm 44
Bảng 24: Use case xem đơn hàng dành cho admin 45
Bảng 25: Use case từ chối đơn hàng chờ xác nhận 45
Bảng 26: Use case xem thống kê doanh thu 46
Bảng 27: Use case quản lý mã giảm giá của hệ thống 46
Bảng 28: Use case xem thống kê giao dịch 47
Bảng 29: Chi tiết dữ liệu bảng Address 58
Bảng 30: Chi tiết dữ liệu bảng AspNetUser 59
Bảng 31: Chi tiết dữ liệu bảng CancelledOrderInfo 60
Bảng 32: Chi tiết dữ liệu bảng Cart 60
Bảng 33: Chi tiết dữ liệu bảng Category 61
Bảng 34: Chi tiết dữ liệu bảng CategorySelectProperty 61
Bảng 35: Chi tiết dữ liệu bảng CategoryTypingProperty 61
Bảng 36: Chi tiết dữ liệu bảng Customer 61
Bảng 37: Chi tiết dữ liệu bảng Order 62
Bảng 38: Chi tiết dữ liệu bảng OrderItems 62
Bảng 39: Chi tiết dữ liệu bảng OrderStatusTrackings 63
Bảng 40: Chi tiết dữ liệu bảng Product 63
Bảng 41: Chi tiết dữ liệu bảng ProductImage 63
Bảng 42: Chi tiết dữ liệu bảng ProductSelectValue 64
Bảng 43: Chi tiết dữ liệu bảng ProductTypingValue 64
Bảng 44: Chi tiết dữ liệu bảng ProductVariant 64
Bảng 45: Chi tiết dữ liệu bảng ProductVariantCombination 64
Bảng 46: Chi tiết dữ liệu bảng ProductVariantOption 65
Bảng 47: Chi tiết dữ liệu bảng ProductViewingTrackings 65
Bảng 48: Chi tiết dữ liệu bảng SelectProperty 65
Bảng 49: Chi tiết dữ liệu bảng SelectValue 66
Bảng 50: Chi tiết dữ liệu bảng Shipper 66
Bảng 51: Chi tiết dữ liệu bảng TypingProperty 66
Bảng 52: Chi tiết dữ liệu bảng Transaction 66
Bảng 53: Chi tiết dữ liệu bảng AdminDiscount 67
Bảng 54: Mô tả giao diện trang chủ 68
Bảng 55: Mô tả giao diện lọc sản phẩm 69
Bảng 56: Mô tả giao diện giỏ hàng 70
Bảng 57: Mô tả giao diện trang checkout (nửa trên) 70
Bảng 58: Mô tả giao diện chi tiết sản phẩm (nửa trên) 71
Bảng 59: Mô tả giao diện chi tiết sản phẩm (nửa dưới) 72
Bảng 60: Mô tả giao diện chọn mã giảm giá 73
Bảng 61: Mô tả giao diện form tạo mới địa chỉ 74
Bảng 62: Mô tả giao diện quản lý đơn hàng 75
Bảng 63: Mô tả giao diện quản lý sản phẩm 75
Bảng 64: Mô tả giao diện thêm sản phẩm (thông tin cơ bản) 76
Bảng 65: Mô tả giao diện thêm sản phẩm (thông tin bán hàng) 77
Bảng 66: Mô tả giao diện thêm sản phẩm (thông tin vận chuyển) 78
Bảng 67: Mô tả giao diện quản lý đơn hàng (người bán) 78
Bảng 68: Mô tả giao diện quản lý danh mục sản phẩm 79
Bảng 69: Mô tả giao diện quản lý thuộc tính sản phẩm 80
Bảng 70: Mô tả giao diện quản lý mã giảm giá 81
Bảng 71: Mô tả giao diện tạo mã giảm giá 82
Bảng 72: Mô tả giao diện quản lý các giao dịch 83
Bảng 73: Mô tả giao diện lấy đơn hàng 84
Bảng 74: Mô tả giao diện giao hàng 85
Bảng 75: Kịch bản kiểm thử 88
Bảng 76: Kết quả kiểm thử của chức năng xác nhận đơn hàng 89
Bảng 77: Kết quả kiểm thử của chức năng chuẩn bị hàng 90
Bảng 78: Kết quả kiểm thử chức năng đặt hàng với hình thức thanh toán paypal 92
Hình 6: Use case cho người dùng 28
Hình 7: Use case cho người quản trị 29
Hình 8: Lược đồ tuần tự chức năng đăng nhập 48
Hình 9: Lược đồ tuần tự chức năng đăng ký 49
Hình 10: Lược đồ tuần tự chức năng thêm sản phẩm 50
Hình 11: Lược đồ tuần tự chức năng thêm vào giỏ hàng 50
Hình 12: Lược đồ tuần tự chức năng đặt hàng 51
Hình 13: Lược đồ tuần tự chức năng xác nhận đơn hàng 51
Hình 14: Lược đồ tuần tự chức năng chuẩn bị hàng 52
Hình 15: Lược đồ tuần tự chức năng lấy hàng 52
Hình 16: Lược đồ tuần tự chức năng giao hàng 53
Hình 17: Lược đồ tuần tự chức năng tạo mới danh mục 53
Hình 18: Lược đồ tuần tự chức năng tạo thuộc tính 54
Hình 19: Lược đồ tuần tự chức năng hủy đơn hàng của người mua 54
Hình 20: Lược đồ tuần tự chức năng tạo mới tài khoản shipper 55
Hình 21: Lược đồ lớp thực thể 56
Hình 22: Lược đồ lớp điều khiển và dịch vụ 57
Hình 23: Lược đồ cơ sở dữ liệu 58
Hình 24: Giao diện trang chủ 68
Hình 25: Giao diện lọc sản phẩm 69
Hình 26: Giao diện giỏ hàng 69
Hình 27: Giao diện trang checkout (nửa trên) 70
Hình 28: Giao diện trang checkout (nửa dưới) 71
Hình 29: Giao diện chi tiết sản phẩm (nửa trên) 71
Hình 30: Giao diện chi tiết sản phẩm (nửa dưới) 72
Hình 31: Giao diện chọn mã giảm giá 73
Hình 32: Giao diện form tạo mới địa chỉ 74
Hình 33: Giao diện quản lý đơn hàng 74
Hình 34: Giao diện quản lý sản phẩm 75
Hình 35: Giao diện thêm sản phẩm (thông tin cơ bản) 76
Hình 36: Giao diện thêm sản phẩm (thông tin thuộc tính) 76
Hình 37: Giao diện thêm sản phẩm (thông tin bán hàng) 77
Hình 38: Giao diện thêm sản phẩm ( thông tin vận chuyển) 77
Hình 39: Giao diện quản lý đơn hàng (người bán) 78
Hình 40: Giao diện quản lý danh mục sản phẩm 79
Hình 41: Giao diện quản lý thuộc tính sản phẩm 80
Hình 42: Giao diện quản lý mã giảm giá 81
Hình 43: Giao diện tạo mã giảm giá 82
Hình 44: Giao diện quản lý các giao dịch 83
Hình 45: Giao diện lấy đơn hàng 84
Hình 46: Giao diện giao hàng 84
Hình 47: Kết quả mong đợi và thực tế của test case TC_AD_01 90
Hình 48: Kết quả mong đợi và thực tế của test case TC_AD_02 90
Hình 49: Kết quả mong đợi và thực tế của test case TC_SE_01 92
Hình 50: Kết quả mong đợi và thực tế của testcase TC_SE_02 92 Hình 51: Kết quả mong đợi và thực tế của test case TC_CS_01 94 Hình 52: Kết quả mong đợi và thực tế của test case TC_CS_02 95
1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI
Ngày nay với sự phát triển của ngành công nghệ thông tin, mọi lĩnh vực trong xã hội đều được thúc đẩy phát triển mạnh mẽ, đặc biệt là với lĩnh vực thương mại, với sự ra đời của các hình thức mua sắm trực tuyến, nhu cầu về mua sắm của người tiêu dùng càng tăng nhanh chóng bởi sự tiện lợi của nó Thương mại điện đang dần trở thành xu hướng tất yếu, là tác nhân cốt lõi thúc đẩy nền kinh tế toàn cầu phát triển.
Các sàn thương mại điện tử lớn hiện nay không chỉ đáp ứng nhu cầu của người mua, mà còn là nơi để những người bán đăng bán sản phẩm của họ, mô hình này được biết đến theo tên gọi C2C (customer to customer), được đánh giá là mô hình tiềm năng phát triển lớn với sự tham gia của những “ông lớn” trong lĩnh vực bán hàng như Tiki, Shoppe, Lazada Theo đó mô hình C2C tối ưu chi phí cho cả người bán lẫn người mua, người bán không phải chịu tác động từ phía doanh nghiệp sản xuất, còn người mua sẽ mua được những sản phẩm với mức giá hợp lý do tính cạnh tranh của mô hình.
Nắm bắt được xu thế mua sắm hiện nay và tiềm năng của mô hình C2C, nhóm chúng tôi đã chọn đề tài “Xây dựng website thương mại điện tử sử dụng ASP.NET Core và React JS” để xây dựng một môi trường giúp mọi người có thể trao đổi mua bán với chi phí tiết kiệm.
2 MỤC ĐÍCH CỦA ĐỀ TÀI
Mục đích của đề tài bao gồm:
- Hiểu và có khả năng ứng dụng ASP.NET Core, React JS và các công nghệ liên quan để xây dựng ứng dụng web.
- Áp dụng các kỹ thuật, công cụ vào quá trình phát triển phần mềm để phát triển một trang web thương mại điện tử dựa theo mô hình C2C với chức năng như một nơi trung gian giúp người mua và người bán trao đổi sản phẩm thuộc nhiều danh mục.
- Sản phẩm là 3 trang web bao gồm: Trang dành cho người quản trị, trang dành cho người bán và trang dành cho người mua.
- Bên cạnh các chức năng chính, hệ thống phải đáp ứng được các yêu cầu phi chức năng như tính bảo mật: Các api endpoint phải được xác thực, mật khẩu của người dùng phải được mã hóa, hệ thống phải được thiết lập cơ chế phân quyền Hiệu suất của hệ thống như: Các câu truy vấn dữ liệu từ cơ sở dữ liệu phải được tối ưu, các ngoại lệ phải được xử lý.
3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU Đối tượng nghiên cứu của đề tài:
Có 2 đối tượng chính mà đề tài nhắm đến: Công nghệ phát triển ứng dụng web và kiến thức về nghiệp vụ, quy trình hoạt động của một trang web thương mại điện tử.
Về đối tượng thứ nhất: Các công nghệ ASP.NET Core để phát triền phía máy chủ cho ứng dụng web Công nghệ React JS để triển khai phía người dùng cho ứng dụng web Ngoài ra còn có các công nghệ, thư viện khác bổ trợ trong quá trình phát triển ứng dụng web như Entity Framework Core, Redux, Json Web Token.
Về đối tượng thứ hai: Các kiến thức về phương thức hoạt động của trang web thương mại điện tử, các giai đoạn đăng ký gian hàng, thêm sản phẩm vào gian hàng của người bán, giai đoạn đặt hàng, theo dõi đơn hàng, xử lý đơn hàng cho đến cách thức thanh toán và quản lý doanh thu của người sở hữu web và người bán.
Phạm vi nghiên cứu của đề tài:
Phạm vi của đề tài tập trung tìm hiểu về các nghiệp vụ, tính năng cơ bản nhất của một trang web thương mại điện tử và vận dụng những kiến thức đó để tạo ra một sản phẩm thực tế bao gồm các tính năng cốt lõi như: Đặt hàng, xử lý đơn hàng, theo dõi đơn hàng, quản lý doanh thu Đề tài cũng không đặt nặng lý thuyết và những tính năng không có hoặc ít ứng dụng trong thực tế.
4 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đề tài đề cao khả khả năng lập trình thông qua việc học tập công nghệ, kỹ thuật để ứng dụng vào việc xây dựng ứng dụng web, hiểu biết được các nghiệp vụ cần có của một ứng dụng web thương mại điện tử.
Bên cạnh ý nghĩa khoa học, đề tài hy vọng mang đến một môi trường công bằng, cạnh tranh và an toàn cho mọi người có thể trao đổi, mua bán với nhau Người mua có thể tìm được sản phẩm mình cần và mua với giá cạnh tranh, người bán có được môi trường tự do buôn bán Qua đó góp phần thúc đẩy sự phát triển của thương mại điện tử ở nước ta.
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT
1.1 Giới thiệu về ASP.NET Core
ASP.NET Core là một framework đa nền tảng, hiệu suất cao và mã nguồn mở để xây dựng các ứng dụng hiện đại, có khả năng kết nối đám mây, kết nối internet Với ASP.NET Core, chúng ta có thể xây dựng các ứng dụng và dịch vụ web, ứng dụng internet vạn vật và phía máy chủ cho ứng dụng di động [1]
Hàng triệu lập trình viên đang hoặc đã sử dụng ASP.NET 4.x để tạo ứng dụng web ASP.NET Core là bản thiết kế lại của ASP.NET 4.x, bao gồm những thay đổi về kiến trúc dẫn đến một khung mô-đun gọn gàng hơn.
Các tính năng chính của ASP.NET Core:
- Quá trình biên dịch diễn ra liên tục, lập trình viên không cần phải gọi lệnh biên dịch lại.
- Các module được phân phối dưới dạng các Nuget packages.
- Xây dựng và chạy các ứng dụng ASP.NET Core đa nền tảng trên các hệ điều hành: Windows, Mac, Linux
- Các hỗ trợ cho dependency injection được xây dựng sẵn.
1.3 Xây dựng web api với ASP.NET Core
API là viết tắt của Application Programming Interface Nó là một tác nhân phần mềm trung gian cho phép hai hoặc nhiều ứng dụng tương tác với nhau.
ASP.NET Core hỗ trợ tạo các dịch vụ RESTful, còn được gọi là API web Để xử lý các request, web API sử dụng các controllers Controller trong API web là các lớp bắt nguồn từ ControllerBase [2]
Các ưu điểm nổi bật của ASP.NET Core:
- ASP.NET Core là một web framework nhẹ và nhanh.
- Tích hợp dễ dàng với các framework ở phía client như react, angular
- Là một framework mã nguồn mở và tập trung vào cộng đồng.
2.1 Giới thiệu về React JS
THIẾT KẾ PHẦN MỀM
THIẾT KẾ GIAO DIỆN
4 Hướng phát triển Tài liệu tham khảo.
Tuần Ngày Nhiệm vụ (Công việc dự kiến) Sản phẩm Ghi chú
- Khảo sát hiện trạng - Hiện trạng 5
- Thiết kế use case và mô hình hóa trang web
- Thiết kế sơ đồ lớp điện tử, sơ đồ use case và sơ đồ lớp
- Tìm hiểu về React JS - Tài liệu về
4 3/4 – 9/4 - Tìm hiểu về ASP.NET Core React JS và
- Tìm hiểu về Entity Framework - Tài liệu về
5 10/4 – 16/4 - Tìm hiểu về Redux Framework
- Tiến hành triển khai phía máy chủ - Các trang giao dựa trên các lược đồ use case và diện cho từng
6+7+8+9+10 17/4 – 21/5 yêu cầu chức năng có
- Tiến hành xây dựng giao diện theo thể tương tác yêu cầu với máy chủ.
- Tích hợp dần giao diện và API
- Tích hợp hoàn thiện giao diện và - Ứng dụng
13 6/6 – 12/6 - Tìm hiểu, sửa đổi, tối ưu hệ thống - Ứng dụng được sửa
- Kiểm thử chương trình và tiến - Ứng dụng đã
14 13/6 – 19/6 hành sửa lỗi được kiểm thử
- Chỉnh sửa tổng hợp báo cáo và sửa lỗi.
15 20/6 – 26/6 - Hoàn tất chương trình hoàn chỉnh để in và nộp.
Giáo viên hướng dẫn Tp Hồ Chí Minh, ngày tháng năm
(Ký và ghi rõ họ tên) Người viết đề cương
(Ký và ghi rõ họ tên)
LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2
1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI 13
2 MỤC ĐÍCH CỦA ĐỀ TÀI 13
3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU 14
4 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 14
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 16
1.1 Giới thiệu về ASP.NET Core 16
1.3 Xây dựng web api với ASP.NET Core 16
2.1 Giới thiệu về React JS 17
3.1 Giới thiệu Entity Framework Core 19
CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 21
2.2 Yêu cầu phi chức năng 26
CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 28
1 MÔ HÌNH HÓA YÊU CẦU 28
3 THIẾT KẾ CƠ SỞ DỮ LIỆU 57
3.1 Lược đồ cơ sở dữ liệu 57
3.2 Chi tiết bảng dữ liệu 58
4.3 Giao diện người quản trị 78
CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 86
1.1 Các công cụ sử dụng 86
1.2 Các công nghệ sử dụng 86
4 HƯỚNG PHÁT TRIỂN 96 TÀI LIỆU THAM KHẢO 98
Bảng 1: Use case Đăng ký 29
Bảng 2: Use case tìm kiếm sản phẩm 30
Bảng 3: Use case xem chi tiết sản phẩm 31
Bảng 4: Use case đăng nhập 32
Bảng 5: Use case đổi mật khẩu 33
Bảng 6: Use case thay đổi thông tin cá nhân 34
Bảng 7: Use case thêm sản phẩm vào giỏ hàng 34
Bảng 8: Use case đặt hàng 35
Bảng 9: Usecase hủy đơn hàng 36
Bảng 10: Use case đánh giá sản phẩm 36
Bảng 11: Use case thêm sản phẩm mới 37
Bảng 12: Use case xem sản phẩm của shop 38
Bảng 13: Use case chuẩn bị hàng 38
Bảng 14: Use case xem danh sách đơn hàng 39
Bảng 15: Use case thống kê giao dịch của shop 39
Bảng 16: Use case rút tiền từ ví của shop 40
Bảng 18: Use case giao hàng 41
Bảng 19: Use case hủy đơn hàng của shipper 41
Bảng 20: Use case xác nhận đơn hàng 42
Bảng 21: Use case quản lý shippers 43
Bảng 22: Use case quản lý danh mục sản phẩm 43
Bảng 23: Use case quản lý thuộc tính sản phẩm 44
Bảng 24: Use case xem đơn hàng dành cho admin 45
Bảng 25: Use case từ chối đơn hàng chờ xác nhận 45
Bảng 26: Use case xem thống kê doanh thu 46
Bảng 27: Use case quản lý mã giảm giá của hệ thống 46
Bảng 28: Use case xem thống kê giao dịch 47
Bảng 29: Chi tiết dữ liệu bảng Address 58
Bảng 30: Chi tiết dữ liệu bảng AspNetUser 59
Bảng 31: Chi tiết dữ liệu bảng CancelledOrderInfo 60
Bảng 32: Chi tiết dữ liệu bảng Cart 60
Bảng 33: Chi tiết dữ liệu bảng Category 61
Bảng 34: Chi tiết dữ liệu bảng CategorySelectProperty 61
Bảng 35: Chi tiết dữ liệu bảng CategoryTypingProperty 61
Bảng 36: Chi tiết dữ liệu bảng Customer 61
Bảng 37: Chi tiết dữ liệu bảng Order 62
Bảng 38: Chi tiết dữ liệu bảng OrderItems 62
Bảng 39: Chi tiết dữ liệu bảng OrderStatusTrackings 63
Bảng 40: Chi tiết dữ liệu bảng Product 63
Bảng 41: Chi tiết dữ liệu bảng ProductImage 63
Bảng 42: Chi tiết dữ liệu bảng ProductSelectValue 64
Bảng 43: Chi tiết dữ liệu bảng ProductTypingValue 64
Bảng 44: Chi tiết dữ liệu bảng ProductVariant 64
Bảng 45: Chi tiết dữ liệu bảng ProductVariantCombination 64
Bảng 46: Chi tiết dữ liệu bảng ProductVariantOption 65
Bảng 47: Chi tiết dữ liệu bảng ProductViewingTrackings 65
Bảng 48: Chi tiết dữ liệu bảng SelectProperty 65
Bảng 49: Chi tiết dữ liệu bảng SelectValue 66
Bảng 50: Chi tiết dữ liệu bảng Shipper 66
Bảng 51: Chi tiết dữ liệu bảng TypingProperty 66
Bảng 52: Chi tiết dữ liệu bảng Transaction 66
Bảng 53: Chi tiết dữ liệu bảng AdminDiscount 67
Bảng 54: Mô tả giao diện trang chủ 68
Bảng 55: Mô tả giao diện lọc sản phẩm 69
Bảng 56: Mô tả giao diện giỏ hàng 70
Bảng 57: Mô tả giao diện trang checkout (nửa trên) 70
Bảng 58: Mô tả giao diện chi tiết sản phẩm (nửa trên) 71
Bảng 59: Mô tả giao diện chi tiết sản phẩm (nửa dưới) 72
Bảng 60: Mô tả giao diện chọn mã giảm giá 73
Bảng 61: Mô tả giao diện form tạo mới địa chỉ 74
Bảng 62: Mô tả giao diện quản lý đơn hàng 75
Bảng 63: Mô tả giao diện quản lý sản phẩm 75
Bảng 64: Mô tả giao diện thêm sản phẩm (thông tin cơ bản) 76
Bảng 65: Mô tả giao diện thêm sản phẩm (thông tin bán hàng) 77
Bảng 66: Mô tả giao diện thêm sản phẩm (thông tin vận chuyển) 78
Bảng 67: Mô tả giao diện quản lý đơn hàng (người bán) 78
Bảng 68: Mô tả giao diện quản lý danh mục sản phẩm 79
Bảng 69: Mô tả giao diện quản lý thuộc tính sản phẩm 80
Bảng 70: Mô tả giao diện quản lý mã giảm giá 81
Bảng 71: Mô tả giao diện tạo mã giảm giá 82
Bảng 72: Mô tả giao diện quản lý các giao dịch 83
Bảng 73: Mô tả giao diện lấy đơn hàng 84
Bảng 74: Mô tả giao diện giao hàng 85
Bảng 75: Kịch bản kiểm thử 88
Bảng 76: Kết quả kiểm thử của chức năng xác nhận đơn hàng 89
Bảng 77: Kết quả kiểm thử của chức năng chuẩn bị hàng 90
Bảng 78: Kết quả kiểm thử chức năng đặt hàng với hình thức thanh toán paypal 92
Hình 6: Use case cho người dùng 28
Hình 7: Use case cho người quản trị 29
Hình 8: Lược đồ tuần tự chức năng đăng nhập 48
Hình 9: Lược đồ tuần tự chức năng đăng ký 49
Hình 10: Lược đồ tuần tự chức năng thêm sản phẩm 50
Hình 11: Lược đồ tuần tự chức năng thêm vào giỏ hàng 50
Hình 12: Lược đồ tuần tự chức năng đặt hàng 51
Hình 13: Lược đồ tuần tự chức năng xác nhận đơn hàng 51
Hình 14: Lược đồ tuần tự chức năng chuẩn bị hàng 52
Hình 15: Lược đồ tuần tự chức năng lấy hàng 52
Hình 16: Lược đồ tuần tự chức năng giao hàng 53
Hình 17: Lược đồ tuần tự chức năng tạo mới danh mục 53
Hình 18: Lược đồ tuần tự chức năng tạo thuộc tính 54
Hình 19: Lược đồ tuần tự chức năng hủy đơn hàng của người mua 54
Hình 20: Lược đồ tuần tự chức năng tạo mới tài khoản shipper 55
Hình 21: Lược đồ lớp thực thể 56
Hình 22: Lược đồ lớp điều khiển và dịch vụ 57
Hình 23: Lược đồ cơ sở dữ liệu 58
Hình 24: Giao diện trang chủ 68
Hình 25: Giao diện lọc sản phẩm 69
Hình 26: Giao diện giỏ hàng 69
Hình 27: Giao diện trang checkout (nửa trên) 70
Hình 28: Giao diện trang checkout (nửa dưới) 71
Hình 29: Giao diện chi tiết sản phẩm (nửa trên) 71
Hình 30: Giao diện chi tiết sản phẩm (nửa dưới) 72
Hình 31: Giao diện chọn mã giảm giá 73
Hình 32: Giao diện form tạo mới địa chỉ 74
Hình 33: Giao diện quản lý đơn hàng 74
Hình 34: Giao diện quản lý sản phẩm 75
Hình 35: Giao diện thêm sản phẩm (thông tin cơ bản) 76
Hình 36: Giao diện thêm sản phẩm (thông tin thuộc tính) 76
Hình 37: Giao diện thêm sản phẩm (thông tin bán hàng) 77
Hình 38: Giao diện thêm sản phẩm ( thông tin vận chuyển) 77
Hình 39: Giao diện quản lý đơn hàng (người bán) 78
Hình 40: Giao diện quản lý danh mục sản phẩm 79
Hình 41: Giao diện quản lý thuộc tính sản phẩm 80
Hình 42: Giao diện quản lý mã giảm giá 81
Hình 43: Giao diện tạo mã giảm giá 82
Hình 44: Giao diện quản lý các giao dịch 83
Hình 45: Giao diện lấy đơn hàng 84
Hình 46: Giao diện giao hàng 84
Hình 47: Kết quả mong đợi và thực tế của test case TC_AD_01 90
Hình 48: Kết quả mong đợi và thực tế của test case TC_AD_02 90
Hình 49: Kết quả mong đợi và thực tế của test case TC_SE_01 92
Hình 50: Kết quả mong đợi và thực tế của testcase TC_SE_02 92 Hình 51: Kết quả mong đợi và thực tế của test case TC_CS_01 94 Hình 52: Kết quả mong đợi và thực tế của test case TC_CS_02 95
1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI
Ngày nay với sự phát triển của ngành công nghệ thông tin, mọi lĩnh vực trong xã hội đều được thúc đẩy phát triển mạnh mẽ, đặc biệt là với lĩnh vực thương mại, với sự ra đời của các hình thức mua sắm trực tuyến, nhu cầu về mua sắm của người tiêu dùng càng tăng nhanh chóng bởi sự tiện lợi của nó Thương mại điện đang dần trở thành xu hướng tất yếu, là tác nhân cốt lõi thúc đẩy nền kinh tế toàn cầu phát triển.
Các sàn thương mại điện tử lớn hiện nay không chỉ đáp ứng nhu cầu của người mua, mà còn là nơi để những người bán đăng bán sản phẩm của họ, mô hình này được biết đến theo tên gọi C2C (customer to customer), được đánh giá là mô hình tiềm năng phát triển lớn với sự tham gia của những “ông lớn” trong lĩnh vực bán hàng như Tiki, Shoppe, Lazada Theo đó mô hình C2C tối ưu chi phí cho cả người bán lẫn người mua, người bán không phải chịu tác động từ phía doanh nghiệp sản xuất, còn người mua sẽ mua được những sản phẩm với mức giá hợp lý do tính cạnh tranh của mô hình.
Nắm bắt được xu thế mua sắm hiện nay và tiềm năng của mô hình C2C, nhóm chúng tôi đã chọn đề tài “Xây dựng website thương mại điện tử sử dụng ASP.NET Core và React JS” để xây dựng một môi trường giúp mọi người có thể trao đổi mua bán với chi phí tiết kiệm.
2 MỤC ĐÍCH CỦA ĐỀ TÀI
Mục đích của đề tài bao gồm:
- Hiểu và có khả năng ứng dụng ASP.NET Core, React JS và các công nghệ liên quan để xây dựng ứng dụng web.
- Áp dụng các kỹ thuật, công cụ vào quá trình phát triển phần mềm để phát triển một trang web thương mại điện tử dựa theo mô hình C2C với chức năng như một nơi trung gian giúp người mua và người bán trao đổi sản phẩm thuộc nhiều danh mục.
- Sản phẩm là 3 trang web bao gồm: Trang dành cho người quản trị, trang dành cho người bán và trang dành cho người mua.
- Bên cạnh các chức năng chính, hệ thống phải đáp ứng được các yêu cầu phi chức năng như tính bảo mật: Các api endpoint phải được xác thực, mật khẩu của người dùng phải được mã hóa, hệ thống phải được thiết lập cơ chế phân quyền Hiệu suất của hệ thống như: Các câu truy vấn dữ liệu từ cơ sở dữ liệu phải được tối ưu, các ngoại lệ phải được xử lý.
3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU Đối tượng nghiên cứu của đề tài:
Có 2 đối tượng chính mà đề tài nhắm đến: Công nghệ phát triển ứng dụng web và kiến thức về nghiệp vụ, quy trình hoạt động của một trang web thương mại điện tử.
Về đối tượng thứ nhất: Các công nghệ ASP.NET Core để phát triền phía máy chủ cho ứng dụng web Công nghệ React JS để triển khai phía người dùng cho ứng dụng web Ngoài ra còn có các công nghệ, thư viện khác bổ trợ trong quá trình phát triển ứng dụng web như Entity Framework Core, Redux, Json Web Token.
Về đối tượng thứ hai: Các kiến thức về phương thức hoạt động của trang web thương mại điện tử, các giai đoạn đăng ký gian hàng, thêm sản phẩm vào gian hàng của người bán, giai đoạn đặt hàng, theo dõi đơn hàng, xử lý đơn hàng cho đến cách thức thanh toán và quản lý doanh thu của người sở hữu web và người bán.
Phạm vi nghiên cứu của đề tài:
Phạm vi của đề tài tập trung tìm hiểu về các nghiệp vụ, tính năng cơ bản nhất của một trang web thương mại điện tử và vận dụng những kiến thức đó để tạo ra một sản phẩm thực tế bao gồm các tính năng cốt lõi như: Đặt hàng, xử lý đơn hàng, theo dõi đơn hàng, quản lý doanh thu Đề tài cũng không đặt nặng lý thuyết và những tính năng không có hoặc ít ứng dụng trong thực tế.
4 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đề tài đề cao khả khả năng lập trình thông qua việc học tập công nghệ, kỹ thuật để ứng dụng vào việc xây dựng ứng dụng web, hiểu biết được các nghiệp vụ cần có của một ứng dụng web thương mại điện tử.
Bên cạnh ý nghĩa khoa học, đề tài hy vọng mang đến một môi trường công bằng, cạnh tranh và an toàn cho mọi người có thể trao đổi, mua bán với nhau Người mua có thể tìm được sản phẩm mình cần và mua với giá cạnh tranh, người bán có được môi trường tự do buôn bán Qua đó góp phần thúc đẩy sự phát triển của thương mại điện tử ở nước ta.
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT
1.1 Giới thiệu về ASP.NET Core
ASP.NET Core là một framework đa nền tảng, hiệu suất cao và mã nguồn mở để xây dựng các ứng dụng hiện đại, có khả năng kết nối đám mây, kết nối internet Với ASP.NET Core, chúng ta có thể xây dựng các ứng dụng và dịch vụ web, ứng dụng internet vạn vật và phía máy chủ cho ứng dụng di động [1]
Hàng triệu lập trình viên đang hoặc đã sử dụng ASP.NET 4.x để tạo ứng dụng web ASP.NET Core là bản thiết kế lại của ASP.NET 4.x, bao gồm những thay đổi về kiến trúc dẫn đến một khung mô-đun gọn gàng hơn.
Các tính năng chính của ASP.NET Core:
- Quá trình biên dịch diễn ra liên tục, lập trình viên không cần phải gọi lệnh biên dịch lại.
- Các module được phân phối dưới dạng các Nuget packages.
- Xây dựng và chạy các ứng dụng ASP.NET Core đa nền tảng trên các hệ điều hành: Windows, Mac, Linux
- Các hỗ trợ cho dependency injection được xây dựng sẵn.
1.3 Xây dựng web api với ASP.NET Core
API là viết tắt của Application Programming Interface Nó là một tác nhân phần mềm trung gian cho phép hai hoặc nhiều ứng dụng tương tác với nhau.
ASP.NET Core hỗ trợ tạo các dịch vụ RESTful, còn được gọi là API web Để xử lý các request, web API sử dụng các controllers Controller trong API web là các lớp bắt nguồn từ ControllerBase [2]
Các ưu điểm nổi bật của ASP.NET Core:
- ASP.NET Core là một web framework nhẹ và nhanh.
- Tích hợp dễ dàng với các framework ở phía client như react, angular
- Là một framework mã nguồn mở và tập trung vào cộng đồng.
2.1 Giới thiệu về React JS
CÀI ĐẶT VÀ KIỂM THỬ
ƯU ĐIỂM
4 Đề nghị cho bảo vệ hay không?:
Tp Hồ Chí Minh, ngày tháng năm 2022
Giáo viên hướng dẫn(Ký & ghi rõ họ tên) ĐH SƯ PHẠM KỸ THUẬT TP HCM CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM
KHOA CNTT Độc lập – Tự do – Hạnh Phúc
PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN
Họ và tên Sinh viên 1: Lê Khánh Vinh
Họ và tên Sinh viên 2: Nguyễn Hoàng Huy
Ngành: Công nghệ Thông tin
Tên đề tài: Xây dựng website thương mại điện tử sử dụng ASP.NET Core và React
JS Họ và tên Giáo viên phản biện: ThS Mai Anh Thơ NHẬN XÉT
1 Về nội dung đề tài & khối lượng thực hiện:
4 Đề nghị cho bảo vệ hay không?:
Tp Hồ Chí Minh, ngày tháng năm 2022
Giáo viên phản biện(Ký & ghi rõ họ tên)
Lời đầu tiên chúng tôi xin phép được gửi lời cảm ơn chân thành và sâu sắc nhất đến với Khoa Công Nghệ Thông Tin – Trường Đại Học Sư Phạm Kỹ Thuật Thành Phố
Hồ Chí Minh vì đã nâng đỡ, tạo điều kiện để nhóm có thể thực hiện được đề tài này.
Lời tiếp theo xin gửi đến thầy Lê Văn Vinh, người trực tiếp hướng dẫn chúng tôi thực hiện đề tài này, lời cảm ơn sâu sắc nhất Thầy là người tận tâm hướng dẫn nhóm từ khâu chọn đề tài, đến thiết kế và triển khai và đưa ra những lời khuyên đúng đắn, kịp thời giúp nhóm tích lũy thêm được nhiều kiến thức và hoàn thành được đề tài.
Tuy nhiên do giới hạn về thời gian, kiến thức cũng như các điều kiện khách quan khác, những thiếu sót của chúng tôi là hoàn toàn không tránh khỏi Chúng tôi rất mong được nghe những góp ý cực kỳ quý giá của các thầy, cô để cải thiện bản thân Xin chân thành cảm ơn.
Lê Khánh Vinh – 18110395Nguyễn Hoàng Huy – 18110293
Trường ĐH Sư Phạm Kỹ Thuật TP.HCM
Khoa Công nghệ Thông tin ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP
Họ và tên sinh viên 1: Lê Khánh Vinh - MSSV 1: 18110395
Họ và tên sinh viên 2: Nguyễn Hoàng Huy - MSSV 2: 18110293
Thời gian làm luận văn: Từ 13/03/2022 đến 26/6/2022 (15 tuần)
Chuyên ngành: Công nghệ phần mềm
Tên luận văn: Xây dựng website thương mại điện tử sử dụng ASP.NET Core và React JS
Giáo viên hướng dẫn: TS Lê Văn Vinh
Nhiệm vụ của luận văn:
Tìm hiểu về các công nghệ: ASP.NET Core, React JS, Entity Framework Core, Redux.
Vận dụng những công nghệ tìm hiểu được để phát triển ứng dụng web, bao gồm các công việc:
Sử dụng ASP.NET Core để triển khai phía server của hệ thống.
Sử dụng Entity Framework Core để thao tác với dữ liệu của hệ thống.
Sử dụng React JS để xây dựng giao diện phía client của hệ thống.
Sử dụng Redux để làm công cụ quản lý lưu trữ cho phía client của hệ thống. Đề cương viết luận văn:
1 Tính cấp thiết của đề tài
2 Mục đích của đề tài
3 Cách tiếp cận và phương pháp nghiên cứu
4 Ý nghĩa khoa học và thực tiễn
1 Mô hình hóa yêu cầu
3 Thiết kế cơ sở dữ liệu
4 Hướng phát triển Tài liệu tham khảo.
Tuần Ngày Nhiệm vụ (Công việc dự kiến) Sản phẩm Ghi chú
- Khảo sát hiện trạng - Hiện trạng 5
- Thiết kế use case và mô hình hóa trang web
- Thiết kế sơ đồ lớp điện tử, sơ đồ use case và sơ đồ lớp
- Tìm hiểu về React JS - Tài liệu về
4 3/4 – 9/4 - Tìm hiểu về ASP.NET Core React JS và
- Tìm hiểu về Entity Framework - Tài liệu về
5 10/4 – 16/4 - Tìm hiểu về Redux Framework
- Tiến hành triển khai phía máy chủ - Các trang giao dựa trên các lược đồ use case và diện cho từng
6+7+8+9+10 17/4 – 21/5 yêu cầu chức năng có
- Tiến hành xây dựng giao diện theo thể tương tác yêu cầu với máy chủ.
- Tích hợp dần giao diện và API
- Tích hợp hoàn thiện giao diện và - Ứng dụng
13 6/6 – 12/6 - Tìm hiểu, sửa đổi, tối ưu hệ thống - Ứng dụng được sửa
- Kiểm thử chương trình và tiến - Ứng dụng đã
14 13/6 – 19/6 hành sửa lỗi được kiểm thử
- Chỉnh sửa tổng hợp báo cáo và sửa lỗi.
15 20/6 – 26/6 - Hoàn tất chương trình hoàn chỉnh để in và nộp.
Giáo viên hướng dẫn Tp Hồ Chí Minh, ngày tháng năm
(Ký và ghi rõ họ tên) Người viết đề cương
(Ký và ghi rõ họ tên)
LỜI CẢM ƠN 1 ĐỀ CƯƠNG LUẬN VĂN TỐT NGHIỆP 2
1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI 13
2 MỤC ĐÍCH CỦA ĐỀ TÀI 13
3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU 14
4 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN 14
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 16
1.1 Giới thiệu về ASP.NET Core 16
1.3 Xây dựng web api với ASP.NET Core 16
2.1 Giới thiệu về React JS 17
3.1 Giới thiệu Entity Framework Core 19
CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 21
2.2 Yêu cầu phi chức năng 26
CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 28
1 MÔ HÌNH HÓA YÊU CẦU 28
3 THIẾT KẾ CƠ SỞ DỮ LIỆU 57
3.1 Lược đồ cơ sở dữ liệu 57
3.2 Chi tiết bảng dữ liệu 58
4.3 Giao diện người quản trị 78
CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ 86
1.1 Các công cụ sử dụng 86
1.2 Các công nghệ sử dụng 86
4 HƯỚNG PHÁT TRIỂN 96 TÀI LIỆU THAM KHẢO 98
Bảng 1: Use case Đăng ký 29
Bảng 2: Use case tìm kiếm sản phẩm 30
Bảng 3: Use case xem chi tiết sản phẩm 31
Bảng 4: Use case đăng nhập 32
Bảng 5: Use case đổi mật khẩu 33
Bảng 6: Use case thay đổi thông tin cá nhân 34
Bảng 7: Use case thêm sản phẩm vào giỏ hàng 34
Bảng 8: Use case đặt hàng 35
Bảng 9: Usecase hủy đơn hàng 36
Bảng 10: Use case đánh giá sản phẩm 36
Bảng 11: Use case thêm sản phẩm mới 37
Bảng 12: Use case xem sản phẩm của shop 38
Bảng 13: Use case chuẩn bị hàng 38
Bảng 14: Use case xem danh sách đơn hàng 39
Bảng 15: Use case thống kê giao dịch của shop 39
Bảng 16: Use case rút tiền từ ví của shop 40
Bảng 18: Use case giao hàng 41
Bảng 19: Use case hủy đơn hàng của shipper 41
Bảng 20: Use case xác nhận đơn hàng 42
Bảng 21: Use case quản lý shippers 43
Bảng 22: Use case quản lý danh mục sản phẩm 43
Bảng 23: Use case quản lý thuộc tính sản phẩm 44
Bảng 24: Use case xem đơn hàng dành cho admin 45
Bảng 25: Use case từ chối đơn hàng chờ xác nhận 45
Bảng 26: Use case xem thống kê doanh thu 46
Bảng 27: Use case quản lý mã giảm giá của hệ thống 46
Bảng 28: Use case xem thống kê giao dịch 47
Bảng 29: Chi tiết dữ liệu bảng Address 58
Bảng 30: Chi tiết dữ liệu bảng AspNetUser 59
Bảng 31: Chi tiết dữ liệu bảng CancelledOrderInfo 60
Bảng 32: Chi tiết dữ liệu bảng Cart 60
Bảng 33: Chi tiết dữ liệu bảng Category 61
Bảng 34: Chi tiết dữ liệu bảng CategorySelectProperty 61
Bảng 35: Chi tiết dữ liệu bảng CategoryTypingProperty 61
Bảng 36: Chi tiết dữ liệu bảng Customer 61
Bảng 37: Chi tiết dữ liệu bảng Order 62
Bảng 38: Chi tiết dữ liệu bảng OrderItems 62
Bảng 39: Chi tiết dữ liệu bảng OrderStatusTrackings 63
Bảng 40: Chi tiết dữ liệu bảng Product 63
Bảng 41: Chi tiết dữ liệu bảng ProductImage 63
Bảng 42: Chi tiết dữ liệu bảng ProductSelectValue 64
Bảng 43: Chi tiết dữ liệu bảng ProductTypingValue 64
Bảng 44: Chi tiết dữ liệu bảng ProductVariant 64
Bảng 45: Chi tiết dữ liệu bảng ProductVariantCombination 64
Bảng 46: Chi tiết dữ liệu bảng ProductVariantOption 65
Bảng 47: Chi tiết dữ liệu bảng ProductViewingTrackings 65
Bảng 48: Chi tiết dữ liệu bảng SelectProperty 65
Bảng 49: Chi tiết dữ liệu bảng SelectValue 66
Bảng 50: Chi tiết dữ liệu bảng Shipper 66
Bảng 51: Chi tiết dữ liệu bảng TypingProperty 66
Bảng 52: Chi tiết dữ liệu bảng Transaction 66
Bảng 53: Chi tiết dữ liệu bảng AdminDiscount 67
Bảng 54: Mô tả giao diện trang chủ 68
Bảng 55: Mô tả giao diện lọc sản phẩm 69
Bảng 56: Mô tả giao diện giỏ hàng 70
Bảng 57: Mô tả giao diện trang checkout (nửa trên) 70
Bảng 58: Mô tả giao diện chi tiết sản phẩm (nửa trên) 71
Bảng 59: Mô tả giao diện chi tiết sản phẩm (nửa dưới) 72
Bảng 60: Mô tả giao diện chọn mã giảm giá 73
Bảng 61: Mô tả giao diện form tạo mới địa chỉ 74
Bảng 62: Mô tả giao diện quản lý đơn hàng 75
Bảng 63: Mô tả giao diện quản lý sản phẩm 75
Bảng 64: Mô tả giao diện thêm sản phẩm (thông tin cơ bản) 76
Bảng 65: Mô tả giao diện thêm sản phẩm (thông tin bán hàng) 77
Bảng 66: Mô tả giao diện thêm sản phẩm (thông tin vận chuyển) 78
Bảng 67: Mô tả giao diện quản lý đơn hàng (người bán) 78
Bảng 68: Mô tả giao diện quản lý danh mục sản phẩm 79
Bảng 69: Mô tả giao diện quản lý thuộc tính sản phẩm 80
Bảng 70: Mô tả giao diện quản lý mã giảm giá 81
Bảng 71: Mô tả giao diện tạo mã giảm giá 82
Bảng 72: Mô tả giao diện quản lý các giao dịch 83
Bảng 73: Mô tả giao diện lấy đơn hàng 84
Bảng 74: Mô tả giao diện giao hàng 85
Bảng 75: Kịch bản kiểm thử 88
Bảng 76: Kết quả kiểm thử của chức năng xác nhận đơn hàng 89
Bảng 77: Kết quả kiểm thử của chức năng chuẩn bị hàng 90
Bảng 78: Kết quả kiểm thử chức năng đặt hàng với hình thức thanh toán paypal 92
Hình 6: Use case cho người dùng 28
Hình 7: Use case cho người quản trị 29
Hình 8: Lược đồ tuần tự chức năng đăng nhập 48
Hình 9: Lược đồ tuần tự chức năng đăng ký 49
Hình 10: Lược đồ tuần tự chức năng thêm sản phẩm 50
Hình 11: Lược đồ tuần tự chức năng thêm vào giỏ hàng 50
Hình 12: Lược đồ tuần tự chức năng đặt hàng 51
Hình 13: Lược đồ tuần tự chức năng xác nhận đơn hàng 51
Hình 14: Lược đồ tuần tự chức năng chuẩn bị hàng 52
Hình 15: Lược đồ tuần tự chức năng lấy hàng 52
Hình 16: Lược đồ tuần tự chức năng giao hàng 53
Hình 17: Lược đồ tuần tự chức năng tạo mới danh mục 53
Hình 18: Lược đồ tuần tự chức năng tạo thuộc tính 54
Hình 19: Lược đồ tuần tự chức năng hủy đơn hàng của người mua 54
Hình 20: Lược đồ tuần tự chức năng tạo mới tài khoản shipper 55
Hình 21: Lược đồ lớp thực thể 56
Hình 22: Lược đồ lớp điều khiển và dịch vụ 57
Hình 23: Lược đồ cơ sở dữ liệu 58
Hình 24: Giao diện trang chủ 68
Hình 25: Giao diện lọc sản phẩm 69
Hình 26: Giao diện giỏ hàng 69
Hình 27: Giao diện trang checkout (nửa trên) 70
Hình 28: Giao diện trang checkout (nửa dưới) 71
Hình 29: Giao diện chi tiết sản phẩm (nửa trên) 71
Hình 30: Giao diện chi tiết sản phẩm (nửa dưới) 72
Hình 31: Giao diện chọn mã giảm giá 73
Hình 32: Giao diện form tạo mới địa chỉ 74
Hình 33: Giao diện quản lý đơn hàng 74
Hình 34: Giao diện quản lý sản phẩm 75
Hình 35: Giao diện thêm sản phẩm (thông tin cơ bản) 76
Hình 36: Giao diện thêm sản phẩm (thông tin thuộc tính) 76
Hình 37: Giao diện thêm sản phẩm (thông tin bán hàng) 77
Hình 38: Giao diện thêm sản phẩm ( thông tin vận chuyển) 77
Hình 39: Giao diện quản lý đơn hàng (người bán) 78
Hình 40: Giao diện quản lý danh mục sản phẩm 79
Hình 41: Giao diện quản lý thuộc tính sản phẩm 80
Hình 42: Giao diện quản lý mã giảm giá 81
Hình 43: Giao diện tạo mã giảm giá 82
Hình 44: Giao diện quản lý các giao dịch 83
Hình 45: Giao diện lấy đơn hàng 84
Hình 46: Giao diện giao hàng 84
Hình 47: Kết quả mong đợi và thực tế của test case TC_AD_01 90
Hình 48: Kết quả mong đợi và thực tế của test case TC_AD_02 90
Hình 49: Kết quả mong đợi và thực tế của test case TC_SE_01 92
Hình 50: Kết quả mong đợi và thực tế của testcase TC_SE_02 92 Hình 51: Kết quả mong đợi và thực tế của test case TC_CS_01 94 Hình 52: Kết quả mong đợi và thực tế của test case TC_CS_02 95
1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI
Ngày nay với sự phát triển của ngành công nghệ thông tin, mọi lĩnh vực trong xã hội đều được thúc đẩy phát triển mạnh mẽ, đặc biệt là với lĩnh vực thương mại, với sự ra đời của các hình thức mua sắm trực tuyến, nhu cầu về mua sắm của người tiêu dùng càng tăng nhanh chóng bởi sự tiện lợi của nó Thương mại điện đang dần trở thành xu hướng tất yếu, là tác nhân cốt lõi thúc đẩy nền kinh tế toàn cầu phát triển.
Các sàn thương mại điện tử lớn hiện nay không chỉ đáp ứng nhu cầu của người mua, mà còn là nơi để những người bán đăng bán sản phẩm của họ, mô hình này được biết đến theo tên gọi C2C (customer to customer), được đánh giá là mô hình tiềm năng phát triển lớn với sự tham gia của những “ông lớn” trong lĩnh vực bán hàng như Tiki, Shoppe, Lazada Theo đó mô hình C2C tối ưu chi phí cho cả người bán lẫn người mua, người bán không phải chịu tác động từ phía doanh nghiệp sản xuất, còn người mua sẽ mua được những sản phẩm với mức giá hợp lý do tính cạnh tranh của mô hình.
Nắm bắt được xu thế mua sắm hiện nay và tiềm năng của mô hình C2C, nhóm chúng tôi đã chọn đề tài “Xây dựng website thương mại điện tử sử dụng ASP.NET Core và React JS” để xây dựng một môi trường giúp mọi người có thể trao đổi mua bán với chi phí tiết kiệm.
2 MỤC ĐÍCH CỦA ĐỀ TÀI
Mục đích của đề tài bao gồm:
- Hiểu và có khả năng ứng dụng ASP.NET Core, React JS và các công nghệ liên quan để xây dựng ứng dụng web.
- Áp dụng các kỹ thuật, công cụ vào quá trình phát triển phần mềm để phát triển một trang web thương mại điện tử dựa theo mô hình C2C với chức năng như một nơi trung gian giúp người mua và người bán trao đổi sản phẩm thuộc nhiều danh mục.
- Sản phẩm là 3 trang web bao gồm: Trang dành cho người quản trị, trang dành cho người bán và trang dành cho người mua.
- Bên cạnh các chức năng chính, hệ thống phải đáp ứng được các yêu cầu phi chức năng như tính bảo mật: Các api endpoint phải được xác thực, mật khẩu của người dùng phải được mã hóa, hệ thống phải được thiết lập cơ chế phân quyền Hiệu suất của hệ thống như: Các câu truy vấn dữ liệu từ cơ sở dữ liệu phải được tối ưu, các ngoại lệ phải được xử lý.
3 CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU Đối tượng nghiên cứu của đề tài:
Có 2 đối tượng chính mà đề tài nhắm đến: Công nghệ phát triển ứng dụng web và kiến thức về nghiệp vụ, quy trình hoạt động của một trang web thương mại điện tử.
Về đối tượng thứ nhất: Các công nghệ ASP.NET Core để phát triền phía máy chủ cho ứng dụng web Công nghệ React JS để triển khai phía người dùng cho ứng dụng web Ngoài ra còn có các công nghệ, thư viện khác bổ trợ trong quá trình phát triển ứng dụng web như Entity Framework Core, Redux, Json Web Token.
Về đối tượng thứ hai: Các kiến thức về phương thức hoạt động của trang web thương mại điện tử, các giai đoạn đăng ký gian hàng, thêm sản phẩm vào gian hàng của người bán, giai đoạn đặt hàng, theo dõi đơn hàng, xử lý đơn hàng cho đến cách thức thanh toán và quản lý doanh thu của người sở hữu web và người bán.
Phạm vi nghiên cứu của đề tài:
Phạm vi của đề tài tập trung tìm hiểu về các nghiệp vụ, tính năng cơ bản nhất của một trang web thương mại điện tử và vận dụng những kiến thức đó để tạo ra một sản phẩm thực tế bao gồm các tính năng cốt lõi như: Đặt hàng, xử lý đơn hàng, theo dõi đơn hàng, quản lý doanh thu Đề tài cũng không đặt nặng lý thuyết và những tính năng không có hoặc ít ứng dụng trong thực tế.
4 Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN Đề tài đề cao khả khả năng lập trình thông qua việc học tập công nghệ, kỹ thuật để ứng dụng vào việc xây dựng ứng dụng web, hiểu biết được các nghiệp vụ cần có của một ứng dụng web thương mại điện tử.
Bên cạnh ý nghĩa khoa học, đề tài hy vọng mang đến một môi trường công bằng, cạnh tranh và an toàn cho mọi người có thể trao đổi, mua bán với nhau Người mua có thể tìm được sản phẩm mình cần và mua với giá cạnh tranh, người bán có được môi trường tự do buôn bán Qua đó góp phần thúc đẩy sự phát triển của thương mại điện tử ở nước ta.
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT
1.1 Giới thiệu về ASP.NET Core
![Hình 5: Trang chủ Vatgia [10] - (Đồ án tốt nghiệp) xây dựng website thương mại điện tử sử dụng asp net core và react js](https://media.store123doc.com/figures/004/831/hinh-trang-chu-vatgia-4831388.webp)
