1. Trang chủ
  2. » Luận Văn - Báo Cáo

(Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js

104 27 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Xây Dựng Website Thương Mại Điện Tử Sử Dụng Asp.Net Core Và React Js
Tác giả Lê Khánh Vinh, Nguyễn Hoàng Huy
Người hướng dẫn TS. Lê Văn Vinh
Trường học Trường Đại Học Sư Phạm Kỹ Thuật Thành Phố Hồ Chí Minh
Chuyên ngành Công Nghệ Thông Tin
Thể loại Đồ án tốt nghiệp
Năm xuất bản 2022
Thành phố Thành phố Hồ Chí Minh
Định dạng
Số trang 104
Dung lượng 8,52 MB

Các công cụ chuyển đổi và chỉnh sửa cho tài liệu này

Cấu trúc

  • 1. TÍNH CẤP THIẾT CỦA ĐỀ TÀI (8)
  • 2. MỤC ĐÍCH CỦA ĐỀ TÀI (8)
  • 3. CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU (8)
  • 4. Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN (8)
  • CHƯƠNG 1: CƠ SỞ LÝ THUYẾT (21)
    • 1. ASP.NET CORE (8)
      • 1.1. Giới thiệu về ASP.NET Core (21)
      • 1.2. Các tính năng (21)
      • 1.3. Xây dựng web api với ASP.NET Core (21)
      • 1.4. Ưu điểm (21)
    • 2. REACT JS (8)
      • 2.1. Giới thiệu về React JS (22)
      • 2.2. Các tính năng (22)
      • 2.3. Cách hoạt động (23)
      • 2.4. Ưu điểm (23)
    • 3. ENTITY FRAMEWORK CORE (8)
      • 3.1. Giới thiệu Entity Framework Core (24)
      • 3.2. Các tính năng (24)
      • 3.3. Ưu điểm (24)
    • 4. REDUX (8)
      • 4.1. Giới thiệu Redux (24)
      • 4.2. Các nguyên tắc (25)
      • 4.3. Ưu điểm (25)
  • CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU (26)
    • 1. KHẢO SÁT HIỆN TRẠNG (8)
      • 1.1. Shopee.vn (26)
      • 1.2. Tiki.vn (27)
      • 1.3. Lazada.vn (28)
      • 1.4. Sendo.vn (28)
      • 1.5. Vatgia.com (29)
    • 2. XÁC ĐỊNH YÊU CẦU (8)
      • 2.1. Yêu cầu chức năng (30)
      • 2.2. Yêu cầu phi chức năng (31)
  • CHƯƠNG 3: THIẾT KẾ PHẦN MỀM (33)
    • 1. MÔ HÌNH HÓA YÊU CẦU (8)
      • 1.1. Lược đồ use case (33)
      • 1.2. Đặc tả use case (34)
      • 1.3. Lược đồ tuần tự (53)
    • 2. LƯỢC ĐỒ LỚP (8)
    • 3. THIẾT KẾ CƠ SỞ DỮ LIỆU (8)
      • 3.1. Lược đồ cơ sở dữ liệu (62)
      • 3.2. Chi tiết bảng dữ liệu (63)
    • 4. THIẾT KẾ GIAO DIỆN (8)
      • 4.1. Giao diện người mua (73)
      • 4.2. Giao diện người bán (80)
      • 4.3. Giao diện người quản trị (83)
      • 4.4. Giao diện shipper (88)
  • CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ (91)
    • 1. CÀI ĐẶT (8)
      • 1.1. Các công cụ sử dụng (91)
      • 1.2. Các công nghệ sử dụng (91)
      • 1.3. Các bước cài đặt (91)
    • 2. KIỂM THỬ (8)
      • 2.1. Kế hoạch kiểm thử (93)
      • 2.2. Kịch bản kiểm thử (93)
      • 2.3. Kết quả kiểm thử (94)
    • 1. KẾT QUẢ ĐẠT ĐƯỢC (8)
    • 2. ƯU ĐIỂM (4)
    • 3. NHƯỢC ĐIỂM (9)

Nội dung

Ý NGHĨA KHOA HỌC VÀ THỰC TIỄN

Chương 1: Cơ sở lý thuyết

Chương 2: Khảo sát hiện trạng và xác định yêu cầu

Chương 3: Thiết kế phần mềm

1 Mô hình hóa yêu cầu

3 Thiết kế cơ sở dữ liệu

Chương 4: Cài đặt và kiểm thử

Tuần Ngày Nhiệm vụ (Công việc dự kiến) Sản phẩm Ghi chú

- Thiết kế use case và mô hình hóa yêu cầu

- Thiết kế sơ đồ lớp

- Hiện trạng 5 trang web thương mại điện tử, sơ đồ use case và sơ đồ lớp

- Tìm hiểu về React JS

- Tìm hiểu về ASP.NET Core

- Tài liệu về React JS và ASP.NET Core

- Tìm hiểu về Entity Framework Core

- Tài liệu về Entity Framework Core và Redux

- Tiến hành triển khai phía máy chủ dựa trên các lược đồ use case và yêu cầu

- Tiến hành xây dựng giao diện theo yêu cầu

- Tích hợp dần giao diện và API

- Các trang giao diện cho từng chức năng có thể tương tác với máy chủ

11+12 22/5 – 5/6 - Tích hợp hoàn thiện giao diện và

- Ứng dụng hoàn thành cơ bản

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 hành sửa lỗi

- Chỉnh sửa tổng hợp báo cáo

- Ứng dụng đã được kiểm thử và sửa lỗi

- Bản báo cáo hoàn chỉnh để in và nộp

(Ký và ghi rõ họ tên)

Tp Hồ Chí Minh, ngày tháng năm

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

Kết quả mong đợi và thực tế của các test case TC_SE_02, TC_CS_01 và TC_CS_02 được trình bày trong các hình 50, 51 và 52, tương ứng.

1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI

Ngày nay, sự phát triển mạnh mẽ của công nghệ thông tin đã thúc đẩy mọi lĩnh vực trong xã hội, đặc biệt là thương mại Sự ra đời của các hình thức mua sắm trực tuyến đã làm gia tăng nhanh chóng nhu cầu tiêu dùng nhờ vào tính tiện lợi Thương mại điện tử đang trở thành xu hướng tất yếu và là yếu tố cốt lõi thúc đẩy sự phát triển của nền kinh tế toàn cầu.

Các sàn thương mại điện tử lớn như Tiki, Shopee và Lazada không chỉ phục vụ nhu cầu của người mua mà còn tạo điều kiện cho người bán thông qua mô hình C2C (customer to customer) Mô hình này được đánh giá cao về tiềm năng phát triển, giúp tối ưu chi phí cho cả người bán lẫn người mua Người bán không bị ảnh hưởng bởi doanh nghiệp sản xuất, trong khi người mua có thể tiếp cận sản phẩm với mức giá hợp lý nhờ tính cạnh tranh của thị trường.

Nhằm đáp ứng xu hướng mua sắm hiện đại và khai thác tiềm năng của mô hình C2C, nhóm chúng tôi đã quyết định phát triển website thương mại điện tử sử dụng ASP.NET Core và React JS, tạo ra một nền tảng thuận lợi cho người dùng trong việc trao đổi và 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 và công cụ trong phát triển phần mềm nhằm xây dựng một trang web thương mại điện tử theo mô hình C2C, đóng vai trò là trung gian kết nối người mua và người bán để trao đổi sản phẩm thuộc nhiều danh mục khác nhau.

- 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

Hệ thống không chỉ cần thực hiện các chức năng chính mà còn phải đáp ứng các yêu cầu phi chức năng quan trọng như tính bảo mật, bao gồm việc xác thực các api endpoint, mã hóa mật khẩu người dùng và thiết lập cơ chế phân quyền Bên cạnh đó, hiệu suất của hệ thống cũng cần được đảm bảo, với việc tối ưu hóa các câu truy vấn dữ liệu từ cơ sở dữ liệu và xử lý các ngoại lệ một cách hiệu quả.

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:

Bài viết này tập trung vào hai đối tượng chính: công nghệ phát triển ứng dụng web và kiến thức về nghiệp vụ cũng như quy trình hoạt động của trang web thương mại điện tử.

Đối với phát triển ứng dụng web, ASP.NET Core là công nghệ chủ yếu cho phía máy chủ, trong khi React JS được sử dụng cho phía người dùng Bên cạnh đó, các công nghệ và thư viện hỗ trợ như Entity Framework Core, Redux và Json Web Token cũng đóng vai trò quan trọng trong quá trình phát triển ứng dụng.

Đối tượng thứ hai bao gồm các kiến thức quan trọng về hoạt động của trang web thương mại điện tử, từ 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, đến quy trình đặt hàng, theo dõi đơn hàng và xử lý đơn hàng Ngoài ra, bài viết cũng đề cập đến cách thức thanh toán và quản lý doanh thu cho cả người sở hữu website và người bán.

Phạm vi nghiên cứu của đề tài:

Đề tài này tập trung vào việc khám phá các nghiệp vụ và tính năng cơ bản của một trang web thương mại điện tử, nhằm áp dụng kiến thức đó để phát triển sản phẩm thực tế Các tính năng cốt lõi được chú trọng bao gồm: Đặt hàng, xử lý đơn hàng, theo dõi đơn hàng và quản lý doanh thu Bài viết không đi sâu vào lý thuyết hay những tính năng ít ứng dụng trong thực tế.

Đề tài nhấn mạnh tầm quan trọng của việc nâng cao khả năng lập trình thông qua việc học công nghệ và kỹ thuật, nhằm áp dụng vào việc phát triển ứng dụng web Qua đó, người học sẽ hiểu rõ các nghiệp vụ cần thiết cho một ứng dụng web thương mại điện tử.

Đề tài không chỉ mang ý nghĩa khoa học mà còn hướng tới việc tạo ra một môi trường công bằng, cạnh tranh và an toàn cho việc trao đổi, mua bán Người mua dễ dàng tìm thấy sản phẩm với giá cả cạnh tranh, trong khi người bán có cơ hội tự do kinh doanh Điều này góp phần thúc đẩy sự phát triển của thương mại điện tử tại Việt Nam.

CƠ SỞ LÝ THUYẾT

REDUX

Chương 2: Khảo sát hiện trạng và xác định yêu cầu

Chương 3: Thiết kế phần mềm

1 Mô hình hóa yêu cầu

3 Thiết kế cơ sở dữ liệu

Chương 4: Cài đặt và kiểm thử

Tuần Ngày Nhiệm vụ (Công việc dự kiến) Sản phẩm Ghi chú

- Thiết kế use case và mô hình hóa yêu cầu

- Thiết kế sơ đồ lớp

- Hiện trạng 5 trang web thương mại điện tử, sơ đồ use case và sơ đồ lớp

- Tìm hiểu về React JS

- Tìm hiểu về ASP.NET Core

- Tài liệu về React JS và ASP.NET Core

- Tìm hiểu về Entity Framework Core

- Tài liệu về Entity Framework Core và Redux

- Tiến hành triển khai phía máy chủ dựa trên các lược đồ use case và yêu cầu

- Tiến hành xây dựng giao diện theo yêu cầu

- Tích hợp dần giao diện và API

- Các trang giao diện cho từng chức năng có thể tương tác với máy chủ

11+12 22/5 – 5/6 - Tích hợp hoàn thiện giao diện và

- Ứng dụng hoàn thành cơ bản

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 hành sửa lỗi

- Chỉnh sửa tổng hợp báo cáo

- Ứng dụng đã được kiểm thử và sửa lỗi

- Bản báo cáo hoàn chỉnh để in và nộp

(Ký và ghi rõ họ tên)

Tp Hồ Chí Minh, ngày tháng năm

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

Kết quả mong đợi và thực tế của các test case TC_SE_02, TC_CS_01 và TC_CS_02 được trình bày trong các hình 50, 51 và 52, cung cấp cái nhìn tổng quan về hiệu suất và độ chính xác của các bài kiểm tra này.

1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI

Ngày nay, sự phát triển của công nghệ thông tin đã thúc đẩy mạnh mẽ mọi lĩnh vực trong xã hội, đặc biệt là thương mại Sự ra đời của các hình thức mua sắm trực tuyến đã làm tăng nhanh chóng nhu cầu mua sắm của người tiêu dùng nhờ vào tính tiện lợi Thương mại điện tử đang trở thành xu hướng tất yếu và là yếu tố cốt lõi thúc đẩy sự phát triển của nền kinh tế toàn cầu.

Các sàn thương mại điện tử lớn hiện nay như Tiki, Shopee và Lazada không chỉ phục vụ nhu cầu của người mua mà còn tạo điều kiện cho người bán thông qua mô hình C2C (customer to customer) Mô hình này được đánh giá có tiềm năng phát triển lớn, giúp tối ưu chi phí cho cả người bán và người mua Người bán không phải chịu áp lực từ doanh nghiệp sản xuất, trong khi người mua có cơ hội sở hữu sản phẩm với giá cả hợp lý nhờ tính cạnh tranh trong mô hình.

Nhằm nắm bắt xu thế mua sắm hiện đại và khai thác tiềm năng của mô hình C2C, nhóm chúng tôi đã quyết định phát triển website thương mại điện tử sử dụng ASP.NET Core và React JS Mục tiêu của dự án là tạo ra một nền tảng giúp người dùng dễ dàng trao đổi và mua bán sản phẩm 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 và công cụ trong phát triển phần mềm để xây dựng một trang web thương mại điện tử theo mô hình C2C, trang web này hoạt động như một nền tảng trung gian, giúp kết nối người mua và người bán trong việc trao đổi sản phẩm đa dạng thuộc nhiều danh mục khác nhau.

- 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

Hệ thống không chỉ cần đáp ứng các chức năng chính mà còn phải đảm bảo các yêu cầu phi chức năng như tính bảo mật, bao gồm việc xác thực các API endpoint, mã hóa mật khẩu người dùng và thiết lập cơ chế phân quyền Bên cạnh đó, hiệu suất của hệ thống cũng rất quan trọng, với việc tối ưu hóa các câu truy vấn dữ liệu từ cơ sở dữ liệu và xử lý các ngoại lệ một cách hiệu quả.

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ử

Các công nghệ ASP.NET Core được sử dụng để phát triển phía máy chủ cho ứng dụng web, trong khi React JS đảm nhận vai trò triển khai phía người dùng Bên cạnh đó, các công nghệ và thư viện bổ trợ như Entity Framework Core, Redux và Json Web Token cũng đóng góp quan trọng trong quá trình phát triển ứng dụng web.

Đối tượng thứ hai bao gồm kiến thức về cách thức hoạt động của trang web thương mại điện tử, 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, cho đến quy trình đặt hàng, theo dõi đơn hàng, xử lý đơn hàng, và cuối cùng là phương thức thanh toán cũng như quản lý doanh thu cho cả người sở hữu website và người bán.

Phạm vi nghiên cứu của đề tài:

Đề tài này tập trung vào việc khám phá các nghiệp vụ và tính năng cơ bản của một trang web thương mại điện tử, nhằm ứng dụng kiến thức để phát triển sản phẩm thực tế với 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 và quản lý doanh thu Nội dung không nhấn mạnh lý thuyết hay những tính năng í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ử

Đề tài không chỉ mang ý nghĩa khoa học mà còn hướng tới việc tạo ra một môi trường công bằng và an toàn cho mọi người trong giao dịch mua bán Người tiêu dùng có thể tìm kiếm sản phẩm cần thiết với giá cả cạnh tranh, trong khi người bán được hưởng lợi từ môi trường tự do kinh doanh Điều này sẽ góp phần thúc đẩy sự phát triển mạnh mẽ của thương mại điện tử tại Việt Nam.

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 mã nguồn mở, đa nền tảng và hiệu suất cao, lý tưởng để phát triển các ứng dụng hiện đại với khả năng kết nối đám mây và internet Nó cho phép xây dựng ứng dụng web, dịch vụ web, ứng dụng internet vạn vật và backend cho ứng dụng di động.

Hàng triệu lập trình viên đã và đang sử dụng ASP.NET 4.x để phát triển ứng dụng web ASP.NET Core là phiên bản tái thiết kế của ASP.NET 4.x, mang đến những cải tiến về kiến trúc, tạo ra một khung mô-đun tối ưu 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 enables the creation of RESTful services, commonly referred to as web APIs To handle requests, web APIs utilize controllers, which are classes derived from ControllerBase.

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

Chương 3: Thiết kế phần mềm

1 Mô hình hóa yêu cầu

3 Thiết kế cơ sở dữ liệu

Chương 4: Cài đặt và kiểm thử

Tuần Ngày Nhiệm vụ (Công việc dự kiến) Sản phẩm Ghi chú

- Thiết kế use case và mô hình hóa yêu cầu

- Thiết kế sơ đồ lớp

- Hiện trạng 5 trang web thương mại điện tử, sơ đồ use case và sơ đồ lớp

- Tìm hiểu về React JS

- Tìm hiểu về ASP.NET Core

- Tài liệu về React JS và ASP.NET Core

- Tìm hiểu về Entity Framework Core

- Tài liệu về Entity Framework Core và Redux

- Tiến hành triển khai phía máy chủ dựa trên các lược đồ use case và yêu cầu

- Tiến hành xây dựng giao diện theo yêu cầu

- Tích hợp dần giao diện và API

- Các trang giao diện cho từng chức năng có thể tương tác với máy chủ

11+12 22/5 – 5/6 - Tích hợp hoàn thiện giao diện và

- Ứng dụng hoàn thành cơ bản

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 hành sửa lỗi

- Chỉnh sửa tổng hợp báo cáo

- Ứng dụng đã được kiểm thử và sửa lỗi

- Bản báo cáo hoàn chỉnh để in và nộp

(Ký và ghi rõ họ tên)

Tp Hồ Chí Minh, ngày tháng năm

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, 51 và 52 trình bày kết quả mong đợi và thực tế của các test case TC_SE_02, TC_CS_01 và TC_CS_02 Những hình ảnh này giúp minh họa sự so sánh giữa kết quả dự kiến và kết quả thực tế, từ đó đánh giá hiệu quả của các test case trong quá trình kiểm thử.

1 TÍNH CẤP THIẾT CỦA ĐỀ TÀI

Ngày nay, sự phát triển của công nghệ thông tin đã thúc đẩy mạnh mẽ mọi lĩnh vực trong xã hội, đặc biệt là thương mại Sự ra đời của các hình thức mua sắm trực tuyến đã làm gia tăng nhanh chóng nhu cầu mua sắm của người tiêu dùng nhờ vào sự tiện lợi Thương mại điện tử đang trở thành xu hướng tất yếu và là yếu tố cốt lõi thúc đẩy sự phát triển của nền kinh tế toàn cầu.

Các sàn thương mại điện tử lớn như Tiki, Shopee và Lazada không chỉ phục vụ nhu cầu của người mua mà còn là nền tảng cho người bán thông qua mô hình C2C (customer to customer) Mô hình này được đánh giá có tiềm năng phát triển lớn, giúp tối ưu chi phí cho cả người bán và người mua Người bán không bị ảnh hưởng bởi doanh nghiệp sản xuất, trong khi người mua có cơ hội tiếp cận sản phẩm với giá cả hợp lý nhờ tính cạnh tranh của thị trường.

Nhằm nắm bắt xu thế mua sắm hiện đại và khai thác tiềm năng của mô hình C2C, nhóm chúng tôi đã quyết định phát triển website thương mại điện tử sử dụng ASP.NET Core và React JS Mục tiêu là tạo ra một nền tảng giúp người dùng dễ dàng trao đổi và mua bán sản phẩm 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 và công cụ trong phát triển phần mềm, chúng tôi xây dựng một trang web thương mại điện tử theo mô hình C2C, hoạt động như một nền tảng trung gian kết nối người mua và người bán, cho phép trao đổi sản phẩm đa dạng thuộc nhiều danh mục khác nhau.

- 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

Hệ thống không chỉ cần đáp ứng các chức năng chính mà còn phải đảm bảo các yêu cầu phi chức năng như tính bảo mật, với việc xác thực các API endpoint, mã hóa mật khẩu người dùng và thiết lập cơ chế phân quyền Bên cạnh đó, hiệu suất của hệ thống cũng rất quan trọng, bao gồm việc tối ưu hóa các câu truy vấn dữ liệu từ cơ sở dữ liệu và xử lý các ngoại lệ một cách hiệu quả.

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ử

Đối với phát triển ứng dụng web, ASP.NET Core được sử dụng cho phát triển phía máy chủ, trong khi React JS phục vụ cho triển khai phía người dùng Bên cạnh đó, các công nghệ và thư viện hỗ trợ như Entity Framework Core, Redux và Json Web Token cũng đóng vai trò quan trọng trong quá trình phát triển ứng dụng.

Đối tượng thứ hai cần nắm vững kiến thức về hoạt động của trang web thương mại điện tử, bao gồm các giai đoạn như đăng ký gian hàng, thêm sản phẩm, đặt hàng, theo dõi và xử lý đơn hàng Bên cạnh đó, người dùng cũng cần hiểu rõ cách thức thanh toán và quản lý doanh thu cho cả người sở hữu website và người bán.

Phạm vi nghiên cứu của đề tài:

Đề tài này tập trung vào việc nghiên cứu các nghiệp vụ và tính năng cơ bản của một trang web thương mại điện tử, nhằm áp dụng kiến thức để phát triển sản phẩm thực tế Các tính năng cốt lõi được chú trọng bao gồm: Đặt hàng, xử lý đơn hàng, theo dõi đơn hàng và quản lý doanh thu, trong khi lý thuyết và những tính năng ít ứng dụng sẽ không được nhấn mạnh.

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ử

Đề tài này không chỉ mang ý nghĩa khoa học mà còn tạo ra một môi trường công bằng, cạnh tranh và an toàn cho việc trao đổi, mua bán Người mua dễ dàng tìm thấy sản phẩm với giá cả hợp lý, trong khi người bán được hưởng lợi từ môi trường kinh doanh tự do Điều này góp phần thúc đẩy sự phát triển của thương mại điện tử tại Việt Nam.

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 mã nguồn mở, đa nền tảng và hiệu suất cao, lý tưởng cho việc phát triển các ứng dụng hiện đại có khả năng kết nối với đám mây và internet Với ASP.NET Core, người dùng có thể tạo ra các ứng dụng web, dịch vụ trực tuyến, ứng dụng internet vạn vật và backend cho ứng dụng di động.

Hàng triệu lập trình viên đã và đang sử dụng ASP.NET 4.x để phát triển ứng dụng web ASP.NET Core là phiên bản cải tiến của ASP.NET 4.x, với những thay đổi về kiến trúc giúp tạo ra một khung mô-đun hiệu quả và 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 facilitates the creation of RESTful services, commonly known as web APIs, which utilize controllers to handle requests In web APIs, controllers are classes that derive from ControllerBase.

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

CÀI ĐẶT VÀ KIỂM THỬ

Ngày đăng: 10/10/2023, 15:18

Nguồn tham khảo

Tài liệu tham khảo Loại Chi tiết
[2] Microsoft (2021), Create web APIs with ASP.NET Core, https://docs.microsoft.com/en- us/aspnet/core/web-api/?view=aspnetcore-6.0 (truy cập vào 6/4/2022) Sách, tạp chí
Tiêu đề: Create web APIs with ASP.NET Core
Tác giả: Microsoft
Năm: 2021
[3] Wikipedia (2021), React (Javascript Library), https://en.wikipedia.org/wiki/React_(JavaScript_library) (truy cập vào 7/4/2022) Sách, tạp chí
Tiêu đề: React (Javascript Library)
Tác giả: Wikipedia
Năm: 2021
[4] Microsoft (2021), Entity Framework Core, https://docs.microsoft.com/en-us/ef/core/ (truy cập vào 13/4/2021) Sách, tạp chí
Tiêu đề: Entity Framework Core
Tác giả: Microsoft
Năm: 2021
[5] Redux (2021), Three Principles, https://redux.js.org/understanding/thinking-in-redux/three-principles (truy cập vào 14/4/2022) Sách, tạp chí
Tiêu đề: Three Principles
Tác giả: Redux
Năm: 2021
[10] Công ty Cổ phần VNP Group, Trang chủ, https://vatgia.com/home/ (truy cập 26/3/2022) Sách, tạp chí
Tiêu đề: Trang chủ
Tác giả: Công ty Cổ phần VNP Group
[1] Microsoft (2021), Introduction to ASP.NET Core, https://docs.microsoft.com/en- us/aspnet/core/introduction-to-aspnet-core?view=aspnetcore-6.0 (truy cập vào 5/4/2022) Link

HÌNH ẢNH LIÊN QUAN

Hình 7: Use case cho người quản trị  1.2.  Đặc tả use case - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 7 Use case cho người quản trị 1.2. Đặc tả use case (Trang 34)
Hình 9: Lược đồ tuần tự chức năng đăng ký - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 9 Lược đồ tuần tự chức năng đăng ký (Trang 54)
Hình 10: Lược đồ tuần tự chức năng thêm sản phẩm - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 10 Lược đồ tuần tự chức năng thêm sản phẩm (Trang 55)
Hình 12: Lược đồ tuần tự chức năng đặt hàng - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 12 Lược đồ tuần tự chức năng đặt hàng (Trang 56)
Hình 14: Lược đồ tuần tự chức năng chuẩn bị hàng - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 14 Lược đồ tuần tự chức năng chuẩn bị hàng (Trang 57)
Hình 16: Lược đồ tuần tự chức năng giao hàng - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 16 Lược đồ tuần tự chức năng giao hàng (Trang 58)
Hình 18: Lược đồ tuần tự chức năng tạo thuộc tính - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 18 Lược đồ tuần tự chức năng tạo thuộc tính (Trang 59)
Hình 20: Lược đồ tuần tự chức năng tạo mới tài khoản shipper - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 20 Lược đồ tuần tự chức năng tạo mới tài khoản shipper (Trang 60)
Hình 21: Lược đồ lớp thực thể - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 21 Lược đồ lớp thực thể (Trang 61)
Hình 22: Lược đồ lớp điều khiển và dịch vụ - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 22 Lược đồ lớp điều khiển và dịch vụ (Trang 62)
Hình 23: Lược đồ cơ sở dữ liệu  3.2.  Chi tiết bảng dữ liệu - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 23 Lược đồ cơ sở dữ liệu 3.2. Chi tiết bảng dữ liệu (Trang 63)
Hình 25: Giao diện lọc sản phẩm  Bảng 55: Mô tả giao diện lọc sản phẩm - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 25 Giao diện lọc sản phẩm Bảng 55: Mô tả giao diện lọc sản phẩm (Trang 74)
Hình 36: Giao diện thêm sản phẩm (thông tin thuộc tính) - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 36 Giao diện thêm sản phẩm (thông tin thuộc tính) (Trang 81)
Hình 41: Giao diện quản lý thuộc tính sản phẩm  Bảng 69: Mô tả giao diện quản lý thuộc tính sản phẩm - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 41 Giao diện quản lý thuộc tính sản phẩm Bảng 69: Mô tả giao diện quản lý thuộc tính sản phẩm (Trang 85)
Hình 45: Giao diện lấy đơn hàng  Bảng 73: Mô tả giao diện lấy đơn hàng - (Đồ án hcmute) xây dựng website thương mại điện tử sử dụng asp net core và react js
Hình 45 Giao diện lấy đơn hàng Bảng 73: Mô tả giao diện lấy đơn hàng (Trang 89)

TỪ KHÓA LIÊN QUAN

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN

🧩 Sản phẩm bạn có thể quan tâm

w