T ÍNH CẤP THIẾT CỦA ĐỀ TÀI
Khi xã hội phát triển và mức sống của người dân được nâng cao, nhu cầu mua sắm ngày càng trở nên thiết yếu Tuy nhiên, đối với những người bận rộn, việc tìm kiếm sản phẩm ưng ý tại cửa hàng không hề đơn giản Vị trí địa lý cũng là một yếu tố quan trọng, bên cạnh việc khó khăn trong việc so sánh các sản phẩm cùng loại chỉ trong thời gian ngắn tại cửa hàng hoặc thông qua người tiếp thị, những người thường chỉ chú trọng vào việc bán sản phẩm.
Trong thời đại Internet bùng nổ, thương mại điện tử đã trở thành một giải pháp hiệu quả cho những khó khăn của hình thức bán hàng truyền thống Mô hình website bán hàng online không chỉ mang lại sự tiện lợi khi người tiêu dùng có thể xem thông tin sản phẩm, lựa chọn màu sắc phù hợp và so sánh các sản phẩm cùng loại, mà còn giúp họ đưa ra quyết định mua sắm thông minh hơn Chỉ với vài thao tác đơn giản trên smartphone hoặc máy tính, khách hàng có thể nhận hàng ngay tại nhà một cách nhanh chóng và thuận tiện.
Chủ cửa hàng có thể tiết kiệm đáng kể chi phí như tiền thuê mặt bằng, chi phí tiếp thị và trang trí cửa hàng Quản lý hoạt động kinh doanh trở nên chính xác, nhanh chóng và dễ dàng thông qua website.
Đề tài khóa luận tốt nghiệp này là cơ hội để nhóm áp dụng kiến thức đã tích lũy trong suốt quá trình học đại học, nhằm tạo ra một sản phẩm thực tiễn và ý nghĩa.
M ỤC TIÊU ĐỀ TÀI
- Tổng hợp cơ sở lý thuyết về Angular 7 và ASP NET Core và ứng dụng 2 nền tảng đó vào ứng dụng cụ thể thiết thực có giá trị
- Nghiên cứu thực trạng và đánh giá về thị trường website bán hàng
- Xây dựng được một ứng dụng hoàn chỉnh có thể sử dụng thực tế
- Trình bày báo cáo khoa học và hợp lý về nội dung trong đề tài khóa luận tốt nghiệp
- Đảm bảo tiếp tục phát triển ứng dụng, hoàn thiện mọi chức năng, nâng cấp đưa ra thị trường sử dụng thực tế
- Hiểu được nhu cầu mua bán hàng của mọi người và nhu cầu trải nghiệm website.
P HƯƠNG PHÁP NGHIÊN CỨU
Để thực hiện mục tiêu và nhiệm vụ nghiên cứu, nhóm đã sử dụng các phương pháp nghiên cứu sau:
- Phương pháp nghiên cứu tài liệu: Đọc các tài liệu tham khảo, xem video cách sử dụng tính năng
Phương pháp chuyên gia là quá trình nhận được sự hỗ trợ, tư vấn và góp ý từ giáo viên hướng dẫn cùng các giảng viên trong khoa Công nghệ thông tin của trường Đại học Sư phạm Kỹ thuật TP.HCM.
Đ ỐI TƯỢNG , PHẠM VI NGHIÊN CỨU
- Cơ chế hoạt động của website bán hàng trực tuyến
- Nhu cầu, khả năng sử dụng website bán hàng trong thực tế
Về phạm vi nghiên cứu nhóm chủ yếu nghiên cứu về cách sử dụng Angular và
Asp.net core để xây dựng được một website bán hàng cơ bản có thể sử dụng được
Tương lai có thể mở rộng quy mô, ứng dụng thêm nhiều chức năng mới phù hợp với nhu cầu người dùng.
P HÂN TÍCH NHỮNG WEBSITE BÁN HÀNG ONLINE TRÊN THỊ TRƯỜNG
5.1 Khảo sát website bán hàng online Lazada
+ Có thể đăng nhập bằng facebook hoặc google+
Chúng tôi cung cấp một menu đa cấp giúp phân chia danh mục sản phẩm một cách rõ ràng, dễ dàng tìm kiếm theo ngành hàng Khách hàng có thể kiểm tra đơn hàng nhanh chóng chỉ với địa chỉ email và mã đơn hàng mà không cần phải đăng nhập Ngoài ra, người dùng có thể lựa chọn sản phẩm trong giỏ hàng để đặt hàng mà không cần phải đặt tất cả sản phẩm cùng một lúc.
+ Không hiển thị toàn bộ sản phẩm (Cho phép xem thêm sản phẩm với nút “tải thêm” mỗi lần thêm 4 hàng)
+ Hiển thị đường dẫn đến sản phẩm (xem thêm các sản phẩm cùng ngành hàng) + Cho phép sắp xếp sản phẩm theo độ phổ biến hoặc theo giá
+ Hỗ trợ lọc sản phẩm với thương hiệu, vị trí, giá cả, đánh giá (rating),
+ Hỗ trợ chế độ xem lưới hoặc xem danh sách
+ Thêm nhiều vị trí đặt hàng, nhớ vị trí đặt hàng trước đó
+ Rating/đánh giá sản phẩm
+ Xem lại lịch sử tìm kiếm (lưu bằng cookie)
+ Gợi ý sản phẩm khác mà mọi người cũng xem khi xem sản phẩm này
+ Chat trực tiếp với người bán hàng
+ Danh sách tìm kiếm phổ biến thay đổi ngay sau khi tải lại trang => có thể chỉ là sản phẩm ngẫu nhiên
Trang adayroi.com đã cải thiện chức năng tìm kiếm bằng cách bổ sung tùy chọn ngành hàng, giúp người dùng tìm kiếm chính xác hơn Bên cạnh đó, trang web cũng giải quyết vấn đề không thể xem lại những sản phẩm đã xem, mang lại trải nghiệm tốt hơn cho khách hàng.
+ Mỗi câu hỏi chỉ một câu trả lời, không thể tiếp tục cuộc trò chuyện
5.2 Khảo sát website bán hàng Shopee
+ Phải nhập mã kích hoạt sms trước mỗi lần đăng nhập
+ Gợi ý sản phẩm tương tự (cùng tên hoặc cùng chức năng) thay vì gợi ý sản phẩm người khác cũng tìm kiếm thêm như lazada
Chức năng lọc đánh giá sản phẩm qua sao được hiển thị rõ ràng với nhiều nút khác nhau, giúp người dùng dễ dàng xem đánh giá nhanh chóng Bên cạnh đó, người dùng còn có thể đánh giá sản phẩm thông qua hình ảnh, tạo sự thuận tiện và sinh động cho quá trình đánh giá.
+ Gợi ý từ khóa tìm kiếm ngay dưới thanh search
+ Tìm kiếm thông qua tag # nhanh và chính xác
+ Thêm nhanh sản phẩm vào giỏ hàng
+ Tải thêm danh sách sản phẩm mỗi khi trượt thanh scrollbar
+ Chat trực tiếp với người bán hàng
+ Chỉ xem được đơn hàng trong tài khoản của mình (không hỗ trợ tra cứu qua mã hóa đơn)
+ Chỉ được đánh giá sản phẩm, không được đặt câu hỏi hay bình luận
+ Không xem lại được sản phẩm đã xem trước đó (Tiki có chức năng này)
5.3 Khảo sát Thế giới di động
+ Không cần tạo tài khoản để mua hàng
+ Kinh doanh nhiều mặt hàng về thiết bị điện tử
+ Đánh giá bình luận sản phẩm khi không cần tài khoản
+ Trên header khi cuộn xuống sâu sẽ cho mình biết mình đang ở hạng mục sản phẩm nào
+ Có tính năng xem 360 độ rất hay
+ Có danh mục hỏi đáp và thào luận
+ Sắp xếp sản phẩm theo giá, tính năng, trả góp 0%
+ Khách hàng mỗi lần đặt hàng đều phải điền thông tin, không thể sử dụng thông tin cũ
+ Quảng cáo khá nhiều dễ bị rối mắt
+ Nội dung trang khá dày đặc
K ẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC
- Có thể vận dụng sử dụng được Angular và Asp.net Core
- Hoàn thành cơ bản được website bán hàng, hoạt động mượt mà, giao diện đẹp
- Hiểu sâu về quy trình làm báo cáo luận văn
- Thấy được những tính năng thiết yếu đối với một trang web bán hàng.
TÌM HIỂU VỀ ANGULAR + ASP.NET CORE
ASP.NET CORE
2 Chương 2: Xác định yêu cầu
2.2 Yêu cầu phi chức năng
3 Chương 3: Phân tích yêu cầu
3.2 Mô hình hóa yêu cầu
4 Chương 4: Thiết kế cơ sơ dữ liệu
4.1 Lược đồ cơ sở dữ liệu sql server
5 Chương 5: Thiết kế giao diện và xử lý
5.1 Sơ đồ lớp của ứng dụng
5.5 Màn hình xem thông tin sản phẩm
5.8 Màn hình trang quản lý admin
6 Chương 6: Kiểm thử phần mềm
6.1 Kế hoạch kiểm thử chung
6.2 Chi tiết test case đã kiểm thử
7.2 Những ưu điểm và nhược điểm khi thực hiện 7.3 Hướng phát triển cho tương lai
[1] Trang chủ Docs của Angular https://angular.io/guide/quickstart
[2] Trang chủ Docs của ASP.Net Core https://docs.microsoft.com/en-us/aspnet/core/?view=aspnetcore-2.2
[3] Nguồn tài liệu về ASP.Net Core trên Tutorialspoint https://www.tutorialspoint.com/asp.net_core/
Angular là một framework JavaScript mạnh mẽ do Google phát triển, giúp xây dựng ứng dụng web đa nền tảng Phiên bản Angular 2+ áp dụng ECMAScript 2015, làm cho việc lập trình trở nên dễ dàng hơn nhờ vào TypeScript, cung cấp kiểm tra kiểu dữ liệu và hỗ trợ debug hiệu quả Kiến trúc MVVM của Angular phân tách rõ ràng giữa view và model, giúp quản lý dữ liệu và giao diện người dùng một cách hiệu quả Angular cũng hỗ trợ data binding, cho phép tự động cập nhật giao diện khi dữ liệu thay đổi, cùng với event binding giúp xử lý các sự kiện từ người dùng Tính năng routing của Angular cho phép điều hướng linh hoạt giữa các view khác nhau trong ứng dụng Cuối cùng, Angular tối ưu hóa kích thước và hiệu suất thông qua lazy loading và trình biên dịch AOT, giúp giảm thời gian tải trang Với tài liệu phong phú và cộng đồng lớn, Angular là lựa chọn lý tưởng cho các nhà phát triển web.
STT Thời gian Công Việc Ghi chú
1 4/3 – 10/3 - Gặp giảng viên hướng dẫn nhận yêu cầu
- Khảo sát và phân tích hiện trạng
- Lập danh sách nhiệm vụ theo tuần và thời gian thực hiện
2 11/3 – 17/3 - Phân tích các chức năng chính của ứng dụng
- Thiết kế cơ sở dữ liệu
3 18/3 – 24/3 - Cài đặt các công cụ cần thiết, thiết lập môi trường
- Thiết kế và cài đặt các Controller
4 25/3 – 31/3 - Viết API xác thực: Đăng ký, đăng nhập
5 1/4 -7/4 - Viết API đăng ký, đăng nhập qua Facebook,
6 8/4 – 14/4 - Xây dựng giao diện layout trang cá nhân
- Viết API chỉnh sửa thông tin cá nhân
- Tìm hiểu sử dụng thư việc chọn ngày tháng
7 15/4 – 21/4 - Thêm database tỉnh thành cả nước Việt Nam
- Viết API Thêm sửa xóa địa chỉ người dùng
- Thiết kế giao diện địa chỉ người dùng
8 22/4 – 28/4 - Viết API đổi mật khẩu
- Thiết kế giao diện với các nút có thể xem/ ẩn mật khẩu
- Thiết kế giao diện header footer
- Xây dựng API upload ảnh
9 29/4 – 5/5 - Thiết kế trang quản lý sản phẩm
- Viết API thêm sửa xóa sản phẩm, tích hợp upload ảnh
- Thêm tính năng lọc sản phẩm, tìm sản phẩm cho admin
- Nghiên cứu database lưu sản phẩm với nhiều thuộc tính
10 6/5 – 12/5 - Sửa database theo cấu trúc magento, nhưng thất bại
- Làm trang giao diện sản phẩm
- Viết API lấy thông tin sản phẩm
- Cấu trúc lại toàn bộ thư mục Angular, phân nhiều module, lazyloading, tìm hiểu routing
11 13/5 – 19/5 - Tìm hiểu animation angular, áp dụng vào chỉnh sửa thông tin
- Viết API quản lý giỏ hàng
- Thiết kế giao diện giỏ hàng với responsive
- Viết API quản lý đơn hàng cho admin
12 20/5 – 26/5 - Tìm hiểu guard bảo vệ tuyến đường
- Quản lý đơn hàng cho người dùng
- API nhận xét, bình luận sản phẩm, thiết kế giao diện
- Sửa lại toàn bộ API với custom response
- Viết API nhập hàng, thiết kế giao diện
- Phân quyền quản lý nhân viên
- Tìm hiểu interceptor Angular, áp dụng vào ứng dụng
- Viết API danh mục sản phẩm (truy vấn lồng rất nhiều)
- Hiển thị cấu trúc danh mục sản phẩm với ngTemlateOutlet Angular
- Chuyển đổi thành phân trang dữ liệu trên server
- Hiển thị trình chiếu lên trang chủ
- Viết API thêm, xóa trình chiếu
- Viết API thống kê và triển khai giao diện
- Chuẩn bị bài thuyết trình
- Chỉnh sửa lại toàn bộ giao diện, làm đẹp
- Thêm thông báo popup, process khi tương tác dữ liệu
- Viết thuật toán tìm kiếm sản phẩm
- Gợi ý sản phẩm ngẫu nhiên thay đổi qua ngày
- Hoàn thiện bài thuyết trình
- Kiểm thử và sửa lỗi ứng dụng
- Thêm dữ liệu cho sản phẩm
18 1/7 – 7/7 - Đẩy code lên Github tất cả thành viên chốt phiên bản
- Hoàn tất các công việc làm CD
- Quay video demo và video hướng dẫn sử dụng
- Hoàn thiện các báo cáo theo yêu cầu của Khoa và GVHD
- Báo cáo giảng viên hướng dẫn
- Chỉnh sửa theo yêu cầu Ý kiến giáo viên hướng dẫn TP Hồ Chí Minh, ngày … tháng … năm 2019
(Ký và ghi rõ họ tên) Người viết đề cương
Em xin chân thành cảm ơn Khoa Công nghệ Thông tin trường Đại học Sư phạm Kỹ thuật TP.HCM cùng các thầy cô đã tận tình giảng dạy và hỗ trợ chúng em trong quá trình học tập Đặc biệt, em xin bày tỏ lòng biết ơn sâu sắc đến thầy Nguyễn Minh Đạo, người đã trực tiếp hướng dẫn và tạo điều kiện thuận lợi cho em trong việc thực hiện đề tài Những kiến thức quý báu mà em tiếp thu từ thầy không chỉ là nền tảng cho khóa luận mà còn là hành trang giúp em tự tin bước vào cuộc sống.
Em xin gửi lời cảm ơn chân thành đến các bạn học cùng đã luôn động viên, khích lệ và hỗ trợ em trong suốt quá trình thực hiện bài Tiểu luận chuyên ngành, giúp em hoàn thành tốt nhất có thể.
Mặc dù nhóm đã nỗ lực rất nhiều, tiểu luận của chúng em vẫn còn nhiều thiếu sót Chúng em rất mong nhận được sự góp ý từ thầy cô và các bạn để cải thiện bài viết.
Em xin gửi lời chúc sức khỏe và thành công đến quý thầy, cô trong Khoa Công nghệ Thông tin và Trường Đại học Sư phạm Kỹ thuật TP.HCM.
1.TÍNH CẤP THIẾT CỦA ĐỀ TÀI 1
4.ĐỐI TƯỢNG, PHẠM VI NGHIÊN CỨU 2
5.PHÂN TÍCH NHỮNG WEBSITE BÁN HÀNG ONLINE TRÊN THỊ TRƯỜNG 2
6.KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC 4
2.1.1 Yêu cầu chức năng nghiệp vụ 18
2.1.2 Yêu cầu chức năng hệ thống 19
2.2 YÊU CẦU PHI CHỨC NĂNG 20
2.2.1 Yêu cầu liên quan đến người dùng 20
2.2.2 Yêu cầu liên quan đến lập trình viên 20
3.1.1 Lược đồ Use Case Tổng quát 21
3.1.2 Lược đồ Use Case Quản lý thông tin cá nhân 22
3.1.3 Lược đồ Use Case Quản lý đơn hàng bán 23
3.1.4 Lược đồ Use Case Quản lý giỏ hàng 24
3.1.5 Lược đồ Use Case Quản lý nhập hàng 25
3.1.6 Lược đồ Use Case Quản lý phân quyền 26
3.1.7 Lược đồ Use Case Quản lý sản phẩm 26
3.1.8 Lược đồ Use Case Thống kê 27
3.1.9 Lược đồ Use Case Tra cứu sản phẩm 27
3.1.10 Lược đồ Use Case Quản lý trình chiếu 28
3.2 MÔ HÌNH HÓA YÊU CẦU 29
3.2.3 Nghiệp vụ chỉnh sửa thông tin cá nhân 33
3.2.4 Nghiệp vụ tra cứu sản phẩm 33
3.2.5 Nghiệp vụ xem danh mục sản phẩm 34
3.2.6 Nghiệp vụ xem thông tin sản phẩm 35
3.2.7 Nghiệp vụ quản lý giỏ hàng 36
3.2.9 Nghiệp vụ đánh giá sản phẩm 38
3.2.11 Nghiệp vụ quản lý nhập hàng 41
3.2.12 Nghiệp vụ quản lý sản phẩm 43
3.2.13 Nghiệp vụ duyệt đơn hàng 45
3.2.15 Nghiệp vụ trình chiếu quảng cáo 46
3.2.16 Nghiệp vụ quản lý phân quyền 47
4.1 LƯỢC ĐỒ CƠ SỞ DỮ LIỆU SQL SERVER 49
5.1 SƠ ĐỒ LỚP CỦA ỨNG DỤNG 63
5.5 MÀN HÌNH XEM THÔNG TIN SẢN PHẨM 72
5.8 MÀN HÌNH TRANG QUẢN LÝ ADMIN 76
5.8.1 Màn hình quản lý đơn hàng 76
6.1 KẾ HOẠCH KIỂM THỬ CHUNG 78
6.2 CHI TIẾT TEST CASE ĐÃ KIỂM THỬ 78
2.NHỮNG ƯU ĐIỂM VÀ NHƯỢC ĐIỂM KHI THỰC HIỆN 82
3.HƯỚNG PHÁT TRIỂN CHO TƯƠNG LAI 82
Hình 1.2: MVC trong AspNet Core 12
Hình 3.1: Lược đồ Use Case tổng quát 21
Hình 3.2: Lược đồ Use Case quản lý thông tin cá nhân 22
Hình 3.3: Lược đồ Use Case quản lý đơn hàng bán 23
Hình 3.4: Lược đồ Use Case quản lý giỏ hàng 24
Hình 3.5: Lược đồ Use Case quản lý nhập hàng 25
Hình 3.6: Lược đồ Use Case quản lý phân quyền 26
Hình 3.7: Lược đồ Use Case quản lý sản phẩm 26
Hình 3.8: Lược đồ Use Case thống kê 27
Hình 3.9: Lược đồ Use Case tra cứu sản phẩm 27
Hình 3.10: Lược đồ Use Case quản lý trình chiếu 28
Hình 3.11: Lược đồ hoạt động nghiệp vụ Đăng ký 29
Hình 3.12: Lược đồ tuần tự nghiệp vụ Đăng ký 30
Hình 3.13: Lược đồ hoạt động nghiệp vụ Đăng nhập 31
Hình 3.14: Lược đồ tuần tự nghiệp vụ Đăng nhập 32
Hình 3.15: Lược đồ hoạt động nghiệp vụ Chỉnh sửa thông tin 33
Hình 3.16: Lược đồ tuần tự nghiệp vụ Chỉnh sửa thông tin 33
Hình 3.17: Lược đồ hoạt động nghiệp vụ Tra cứu sản phẩm 33
Hình 3.18: Lược đồ tuần tự nghiệp vụ Tra cứu sản phẩm 34
Hình 3.19: Lược đồ hoạt động nghiệp vụ Xem danh mục sản phẩm 34
Hình 3.20: Lược đồ tuần tự nghiệp vụ Xem danh mục sản phẩm 35
Hình 3.21: Lược đồ hoạt động nghiệp vụ Xem thông tin sản phẩm 35
Hình 3.22: Lược đồ tuần tự nghiệp vụ Xem thông tin sản phẩm 36
Hình 3.23: Lược đồ hoạt động nghiệp vụ Quản lý giỏ hàng 36
Hình 3.24: Lược đồ tuần tự nghiệp vụ Quản lý giỏ hàng 37
Hình 3.25: Lược đồ hoạt động nghiệp vụ Đặt hàng 37
Hình 3.26: Lược đồ tuần tự nghiệp vụ Đặt hàng 38
Hình 3.27: Lược đồ hoạt động nghiệp vụ Đánh giá sản phẩm 38
Hình 3.28: Lược đồ tuần tự nghiệp vụ Đánh giá sản phẩm 39
Hình 3.29: Lược đồ hoạt động nghiệp vụ Bình luận 39
Hình 3.30: Lược đồ tuần tự nghiệp vụ Bình Luận 40
Hình 3.31: Lược đồ hoạt động nghiệp vụ Quản lý nhập hàng 41
Hình 3.32: Lược đồ tuần tự nghiệp vụ Quản lý nhập hàng 42
Hình 3.33: Lược đồ hoạt động nghiệp vụ Quản lý sản phẩm 43
Hình 3.34: Lược đồ tuần tự nghiệp vụ Quản lý sản phẩm 44
Hình 3.35: Lược đồ hoạt động nghiệp vụ Duyệt đơn hàng 45
Hình 3.36: Lược đồ tuần tự nghiệp vụ Duyệt đơn hàng 45
Hình 3.37: Lược đồ hoạt động nghiệp vụ Thống kê 46
Hình 3.38: Lược đồ tuần tự nghiệp vụ Thống kê 46
Hình 3.39: Lược đồ hoạt động nghiệp vụ Trình chiếu 46
Hình 3.40: Lược đồ tuần tự nghiệp vụ Trình chiếu 47
Hình 3.41: Lược đồ hoạt động nghiệp vụ Quản lý phân quyền 47
Hình 3.42: Lược đồ tuần tự nghiệp vụ Quản lý phân quyền 48
Hình 4.1: Lược đồ tổng quát cơ sở dữ liệu 49
Hình 5.1: Sơ đồ lớp Models 63
Hình 5.2: Sơ đồ lớp Controller 64
Hình 5.3: Sơ đồ lớp Helpers 65
Hình 5.4: Sơ đồ lớp ViewModel 66
Hình 5.5: Giao diện trang chủ 67
Hình 5.6: Giao diện đăng nhập 69
Hình 5.7: Giao diện đăng ký 70
Hình 5.8: Giao diện chi tiết sản phẩm 72
Hình 5.9: Giao diện chi tiết giỏ hàng 73
Hình 5.10: Giao diện thông tin cá nhân 74
Hình 5.11: Giao diện đơn hàng cá nhân 75
Hình 5.12: Giao diện quản lý sản phẩm 76
Bảng 1.1: Lịch sử phát triển ASP.NET CORE 10
Bảng 5.1: Mô tả xử lý giao diện trang chủ 67
Bảng 5.2: Mô tả xử lý giao diện đăng nhập 69
Bảng 5.3: Mô tả xử lý giao diện đăng ký 71
Bảng 5.4: Mô tả xử lý giao diện sản phẩm 72
Bảng 5.5: Mô tả xử lý giao diện giỏ hàng 73
Bảng 5.6: Mô tả xử lý giao diện chỉnh sửa thông tin cá nhân 74
Bảng 5.7: Mô tả xử lý giao diện đơn hàng cá nhân 75
Bảng 5.8: Mô tả xử lý giao diện quản lý sản phẩm 76
Bảng 6.1: Kiểm thử người dùng 78
DANH MỤC CHỮ VIẾT TẮT VÀ TỪ TIẾNG ANH
- API: viết tắt của chữ Application Programming Interface nghĩa là giao diện lập trình ứng dụng
- Test case: mô tả một dữ liệu đầu vào (input), hành động (action) hoặc một sự kiện (event) và kết quả truy vấn (expected response)
- CSDL: viết tắt của cơ sở dữ liệu
- HTTP: Hypertext Transfer Protocol có nghĩa là giao thức truyển tải siêu văn bản
-MVC: Model View Controller là một kiến trúc phần mềm hay mô hình thiết kế
IIS (Internet Information Services) là dịch vụ máy chủ được phát triển trên hệ điều hành Windows, có chức năng cung cấp và phân phối thông tin qua mạng.
1 Tính cấp thiết của đề tài
Khi xã hội phát triển và mức sống ngày càng cao, nhu cầu mua sắm trở thành thiết yếu Tuy nhiên, việc lựa chọn sản phẩm ưng ý tại cửa hàng không hề dễ dàng, đặc biệt với những người bận rộn Vị trí địa lý cũng là một yếu tố quan trọng, cùng với khó khăn trong việc so sánh các sản phẩm tương tự trong thời gian hạn chế tại cửa hàng, hay chỉ dựa vào người tiếp thị, những người thường chỉ quan tâm đến việc bán hàng.
Thương mại điện tử đang dần thay thế hình thức bán hàng truyền thống nhờ vào sự bùng nổ của Internet, mang lại nhiều lợi ích cho người tiêu dùng Mô hình website bán hàng online không chỉ giải quyết những khó khăn của bán hàng truyền thống mà còn cho phép khách hàng xem thông tin sản phẩm rõ ràng, lựa chọn màu sắc phù hợp và so sánh các sản phẩm cùng loại để đưa ra quyết định thông minh Chỉ với vài thao tác đơn giản trên smartphone hoặc máy tính, người dùng có thể dễ dàng nhận hàng ngay tại nhà, nhanh chóng và tiện lợi.
Chủ cửa hàng có thể tiết kiệm chi phí đáng kể như tiền mặt bằng, chi phí thuê tiếp thị và trang trí cửa hàng Việc quản lý trở nên chính xác, nhanh chóng và dễ dàng thông qua website.
Nhóm quyết tâm biến đề tài khóa luận tốt nghiệp thành một sản phẩm thực tiễn và ý nghĩa, nhằm áp dụng những kiến thức tích lũy trong suốt quá trình học đại học.
- Tổng hợp cơ sở lý thuyết về Angular 7 và ASP NET Core và ứng dụng 2 nền tảng đó vào ứng dụng cụ thể thiết thực có giá trị
- Nghiên cứu thực trạng và đánh giá về thị trường website bán hàng
- Xây dựng được một ứng dụng hoàn chỉnh có thể sử dụng thực tế
- Trình bày báo cáo khoa học và hợp lý về nội dung trong đề tài khóa luận tốt nghiệp
- Đảm bảo tiếp tục phát triển ứng dụng, hoàn thiện mọi chức năng, nâng cấp đưa ra thị trường sử dụng thực tế
- Hiểu được nhu cầu mua bán hàng của mọi người và nhu cầu trải nghiệm website
3 Phương pháp nghiên cứu Để thực hiện mục tiêu và nhiệm vụ nghiên cứu, nhóm đã sử dụng các phương pháp nghiên cứu sau:
- Phương pháp nghiên cứu tài liệu: Đọc các tài liệu tham khảo, xem video cách sử dụng tính năng
Phương pháp chuyên gia bao gồm việc nhận sự góp ý, hỗ trợ và tư vấn từ giáo viên hướng dẫn cùng các giảng viên trong khoa Công nghệ thông tin của trường Đại học Sư phạm kỹ thuật TP.HCM.
4 Đối tượng, phạm vi nghiên cứu
- Cơ chế hoạt động của website bán hàng trực tuyến
- Nhu cầu, khả năng sử dụng website bán hàng trong thực tế
Về phạm vi nghiên cứu nhóm chủ yếu nghiên cứu về cách sử dụng Angular và
Asp.net core để xây dựng được một website bán hàng cơ bản có thể sử dụng được
Tương lai có thể mở rộng quy mô, ứng dụng thêm nhiều chức năng mới phù hợp với nhu cầu người dùng
5 Phân tích những website bán hàng online trên thị trường
5.1 Khảo sát website bán hàng online Lazada
+ Có thể đăng nhập bằng facebook hoặc google+
Danh mục sản phẩm được phân chia theo menu đa cấp, giúp người dùng dễ dàng tìm kiếm các ngành hàng Khách hàng có thể kiểm tra đơn hàng nhanh chóng chỉ với email và mã đơn hàng mà không cần phải đăng nhập Ngoài ra, hệ thống cho phép lựa chọn sản phẩm trong giỏ hàng để đặt hàng mà không bắt buộc phải đặt tất cả sản phẩm.
+ Không hiển thị toàn bộ sản phẩm (Cho phép xem thêm sản phẩm với nút “tải thêm” mỗi lần thêm 4 hàng)
+ Hiển thị đường dẫn đến sản phẩm (xem thêm các sản phẩm cùng ngành hàng) + Cho phép sắp xếp sản phẩm theo độ phổ biến hoặc theo giá
+ Hỗ trợ lọc sản phẩm với thương hiệu, vị trí, giá cả, đánh giá (rating),
+ Hỗ trợ chế độ xem lưới hoặc xem danh sách
+ Thêm nhiều vị trí đặt hàng, nhớ vị trí đặt hàng trước đó
+ Rating/đánh giá sản phẩm
+ Xem lại lịch sử tìm kiếm (lưu bằng cookie)
+ Gợi ý sản phẩm khác mà mọi người cũng xem khi xem sản phẩm này
+ Chat trực tiếp với người bán hàng
+ Danh sách tìm kiếm phổ biến thay đổi ngay sau khi tải lại trang => có thể chỉ là sản phẩm ngẫu nhiên
Trang adayroi.com đã khắc phục vấn đề tìm kiếm không chính xác bằng cách cung cấp tùy chọn ngành hàng, giúp người dùng dễ dàng tìm kiếm sản phẩm phù hợp Bên cạnh đó, trang cũng cải thiện trải nghiệm người dùng bằng cách cho phép xem lại những sản phẩm đã xem trước đó.
+ Mỗi câu hỏi chỉ một câu trả lời, không thể tiếp tục cuộc trò chuyện
5.2 Khảo sát website bán hàng Shopee
+ Phải nhập mã kích hoạt sms trước mỗi lần đăng nhập
+ Gợi ý sản phẩm tương tự (cùng tên hoặc cùng chức năng) thay vì gợi ý sản phẩm người khác cũng tìm kiếm thêm như lazada
Chức năng lọc đánh giá bằng sao được hiển thị rõ ràng qua nhiều nút khác nhau, giúp người dùng dễ dàng xem đánh giá một cách nhanh chóng Ngoài ra, người dùng còn có thể đánh giá sản phẩm thông qua hình ảnh, tăng tính trực quan và sinh động cho quá trình đánh giá.
+ Gợi ý từ khóa tìm kiếm ngay dưới thanh search
+ Tìm kiếm thông qua tag # nhanh và chính xác
+ Thêm nhanh sản phẩm vào giỏ hàng
+ Tải thêm danh sách sản phẩm mỗi khi trượt thanh scrollbar
+ Chat trực tiếp với người bán hàng
+ Chỉ xem được đơn hàng trong tài khoản của mình (không hỗ trợ tra cứu qua mã hóa đơn)
+ Chỉ được đánh giá sản phẩm, không được đặt câu hỏi hay bình luận
+ Không xem lại được sản phẩm đã xem trước đó (Tiki có chức năng này)
5.3 Khảo sát Thế giới di động
+ Không cần tạo tài khoản để mua hàng
+ Kinh doanh nhiều mặt hàng về thiết bị điện tử
+ Đánh giá bình luận sản phẩm khi không cần tài khoản
+ Trên header khi cuộn xuống sâu sẽ cho mình biết mình đang ở hạng mục sản phẩm nào
+ Có tính năng xem 360 độ rất hay
+ Có danh mục hỏi đáp và thào luận
+ Sắp xếp sản phẩm theo giá, tính năng, trả góp 0%
+ Khách hàng mỗi lần đặt hàng đều phải điền thông tin, không thể sử dụng thông tin cũ
+ Quảng cáo khá nhiều dễ bị rối mắt
+ Nội dung trang khá dày đặc
6 Kết quả dự kiến đạt được
- Có thể vận dụng sử dụng được Angular và Asp.net Core
- Hoàn thành cơ bản được website bán hàng, hoạt động mượt mà, giao diện đẹp
- Hiểu sâu về quy trình làm báo cáo luận văn
- Thấy được những tính năng thiết yếu đối với một trang web bán hàng
PHẦN NỘI DUNG CHƯƠNG 1: TÌM HIỂU VỀ ANGULAR + ASP.NET CORE
1.1.1 Giới thiệu về Angular 7 và nguồn gốc ra đời
Angular, thường được biết đến với tên gọi "Angular 2+" hoặc "Angular v2 trở lên", là một khung ứng dụng web mã nguồn mở sử dụng TypeScript, được phát triển bởi Nhóm Angular tại Google cùng với sự hỗ trợ từ cộng đồng cá nhân và các tổ chức Đây là một phiên bản viết lại hoàn toàn từ AngularJS, do cùng một nhóm phát triển.
XÁC ĐỊNH YÊU CẦU
YÊU CẦU PHI CHỨC NĂNG
3 Chương 3: Phân tích yêu cầu
3.2 Mô hình hóa yêu cầu
4 Chương 4: Thiết kế cơ sơ dữ liệu
4.1 Lược đồ cơ sở dữ liệu sql server
5 Chương 5: Thiết kế giao diện và xử lý
5.1 Sơ đồ lớp của ứng dụng
5.5 Màn hình xem thông tin sản phẩm
5.8 Màn hình trang quản lý admin
6 Chương 6: Kiểm thử phần mềm
6.1 Kế hoạch kiểm thử chung
6.2 Chi tiết test case đã kiểm thử
7.2 Những ưu điểm và nhược điểm khi thực hiện 7.3 Hướng phát triển cho tương lai
[1] Trang chủ Docs của Angular https://angular.io/guide/quickstart
[2] Trang chủ Docs của ASP.Net Core https://docs.microsoft.com/en-us/aspnet/core/?view=aspnetcore-2.2
[3] Nguồn tài liệu về ASP.Net Core trên Tutorialspoint https://www.tutorialspoint.com/asp.net_core/
Angular là một framework JavaScript mạnh mẽ được phát triển bởi Google, giúp xây dựng ứng dụng web đầy đủ tính năng cho cả nền tảng di động và máy tính để bàn Với sự ra mắt của Angular 2 vào năm 2016, Angular đã mang đến một bước chuyển mình lớn, cho phép lập trình viên dễ dàng hơn trong việc phát triển ứng dụng nhờ vào việc sử dụng Typescript và các tính năng mới của ECMAScript 2015 Cấu trúc rõ ràng của Angular dựa trên mô hình MVVM giúp phân tách giao diện người dùng, mã nguồn và dữ liệu, từ đó nâng cao khả năng bảo trì và phát triển ứng dụng Angular hỗ trợ mạnh mẽ việc ràng buộc dữ liệu, điều hướng linh hoạt giữa các view và tối ưu hóa kích thước ứng dụng, giúp cải thiện hiệu suất Cùng với tài liệu hướng dẫn chi tiết và cộng đồng người dùng đông đảo, Angular là lựa chọn lý tưởng cho các lập trình viên muốn phát triển ứng dụng web hiện đại và hiệu quả.
STT Thời gian Công Việc Ghi chú
1 4/3 – 10/3 - Gặp giảng viên hướng dẫn nhận yêu cầu
- Khảo sát và phân tích hiện trạng
- Lập danh sách nhiệm vụ theo tuần và thời gian thực hiện
2 11/3 – 17/3 - Phân tích các chức năng chính của ứng dụng
- Thiết kế cơ sở dữ liệu
3 18/3 – 24/3 - Cài đặt các công cụ cần thiết, thiết lập môi trường
- Thiết kế và cài đặt các Controller
4 25/3 – 31/3 - Viết API xác thực: Đăng ký, đăng nhập
5 1/4 -7/4 - Viết API đăng ký, đăng nhập qua Facebook,
6 8/4 – 14/4 - Xây dựng giao diện layout trang cá nhân
- Viết API chỉnh sửa thông tin cá nhân
- Tìm hiểu sử dụng thư việc chọn ngày tháng
7 15/4 – 21/4 - Thêm database tỉnh thành cả nước Việt Nam
- Viết API Thêm sửa xóa địa chỉ người dùng
- Thiết kế giao diện địa chỉ người dùng
8 22/4 – 28/4 - Viết API đổi mật khẩu
- Thiết kế giao diện với các nút có thể xem/ ẩn mật khẩu
- Thiết kế giao diện header footer
- Xây dựng API upload ảnh
9 29/4 – 5/5 - Thiết kế trang quản lý sản phẩm
- Viết API thêm sửa xóa sản phẩm, tích hợp upload ảnh
- Thêm tính năng lọc sản phẩm, tìm sản phẩm cho admin
- Nghiên cứu database lưu sản phẩm với nhiều thuộc tính
10 6/5 – 12/5 - Sửa database theo cấu trúc magento, nhưng thất bại
- Làm trang giao diện sản phẩm
- Viết API lấy thông tin sản phẩm
- Cấu trúc lại toàn bộ thư mục Angular, phân nhiều module, lazyloading, tìm hiểu routing
11 13/5 – 19/5 - Tìm hiểu animation angular, áp dụng vào chỉnh sửa thông tin
- Viết API quản lý giỏ hàng
- Thiết kế giao diện giỏ hàng với responsive
- Viết API quản lý đơn hàng cho admin
12 20/5 – 26/5 - Tìm hiểu guard bảo vệ tuyến đường
- Quản lý đơn hàng cho người dùng
- API nhận xét, bình luận sản phẩm, thiết kế giao diện
- Sửa lại toàn bộ API với custom response
- Viết API nhập hàng, thiết kế giao diện
- Phân quyền quản lý nhân viên
- Tìm hiểu interceptor Angular, áp dụng vào ứng dụng
- Viết API danh mục sản phẩm (truy vấn lồng rất nhiều)
- Hiển thị cấu trúc danh mục sản phẩm với ngTemlateOutlet Angular
- Chuyển đổi thành phân trang dữ liệu trên server
- Hiển thị trình chiếu lên trang chủ
- Viết API thêm, xóa trình chiếu
- Viết API thống kê và triển khai giao diện
- Chuẩn bị bài thuyết trình
- Chỉnh sửa lại toàn bộ giao diện, làm đẹp
- Thêm thông báo popup, process khi tương tác dữ liệu
- Viết thuật toán tìm kiếm sản phẩm
- Gợi ý sản phẩm ngẫu nhiên thay đổi qua ngày
- Hoàn thiện bài thuyết trình
- Kiểm thử và sửa lỗi ứng dụng
- Thêm dữ liệu cho sản phẩm
18 1/7 – 7/7 - Đẩy code lên Github tất cả thành viên chốt phiên bản
- Hoàn tất các công việc làm CD
- Quay video demo và video hướng dẫn sử dụng
- Hoàn thiện các báo cáo theo yêu cầu của Khoa và GVHD
- Báo cáo giảng viên hướng dẫn
- Chỉnh sửa theo yêu cầu Ý kiến giáo viên hướng dẫn TP Hồ Chí Minh, ngày … tháng … năm 2019
(Ký và ghi rõ họ tên) Người viết đề cương
Em xin chân thành cảm ơn khoa Công nghệ Thông tin trường Đại học Sư phạm Kỹ thuật TP.HCM và các thầy cô giáo đã tận tình giảng dạy, hỗ trợ chúng em trong quá trình học tập Đặc biệt, em xin bày tỏ lòng biết ơn sâu sắc đến thầy Nguyễn Minh Đạo, người đã trực tiếp giảng dạy và tạo điều kiện thuận lợi cho em trong việc thực hiện đề tài Những kiến thức quý báu mà em tiếp thu từ thầy không chỉ là nền tảng cho nghiên cứu khóa luận mà còn là hành trang giúp em bước vào đời với sự tự tin và vững vàng hơn.
Em xin gửi lời cảm ơn chân thành đến các bạn bè đã đồng hành và hỗ trợ em trong suốt quá trình thực hiện bài Tiểu luận chuyên ngành Sự động viên và khích lệ của các bạn đã giúp em hoàn thành bài viết một cách tốt nhất.
Mặc dù nhóm đã nỗ lực rất nhiều, tiểu luận của chúng em vẫn còn nhiều thiếu sót Chúng em rất mong nhận được ý kiến đóng góp từ thầy cô và các bạn để hoàn thiện hơn.
Em xin chúc quý thầy cô Khoa Công nghệ Thông tin và Trường Đại học Sư phạm Kỹ thuật TP.HCM sức khỏe dồi dào và thành công trong sự nghiệp cao quý của mình.
1.TÍNH CẤP THIẾT CỦA ĐỀ TÀI 1
4.ĐỐI TƯỢNG, PHẠM VI NGHIÊN CỨU 2
5.PHÂN TÍCH NHỮNG WEBSITE BÁN HÀNG ONLINE TRÊN THỊ TRƯỜNG 2
6.KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC 4
2.1.1 Yêu cầu chức năng nghiệp vụ 18
2.1.2 Yêu cầu chức năng hệ thống 19
2.2 YÊU CẦU PHI CHỨC NĂNG 20
2.2.1 Yêu cầu liên quan đến người dùng 20
2.2.2 Yêu cầu liên quan đến lập trình viên 20
3.1.1 Lược đồ Use Case Tổng quát 21
3.1.2 Lược đồ Use Case Quản lý thông tin cá nhân 22
3.1.3 Lược đồ Use Case Quản lý đơn hàng bán 23
3.1.4 Lược đồ Use Case Quản lý giỏ hàng 24
3.1.5 Lược đồ Use Case Quản lý nhập hàng 25
3.1.6 Lược đồ Use Case Quản lý phân quyền 26
3.1.7 Lược đồ Use Case Quản lý sản phẩm 26
3.1.8 Lược đồ Use Case Thống kê 27
3.1.9 Lược đồ Use Case Tra cứu sản phẩm 27
3.1.10 Lược đồ Use Case Quản lý trình chiếu 28
3.2 MÔ HÌNH HÓA YÊU CẦU 29
3.2.3 Nghiệp vụ chỉnh sửa thông tin cá nhân 33
3.2.4 Nghiệp vụ tra cứu sản phẩm 33
3.2.5 Nghiệp vụ xem danh mục sản phẩm 34
3.2.6 Nghiệp vụ xem thông tin sản phẩm 35
3.2.7 Nghiệp vụ quản lý giỏ hàng 36
3.2.9 Nghiệp vụ đánh giá sản phẩm 38
3.2.11 Nghiệp vụ quản lý nhập hàng 41
3.2.12 Nghiệp vụ quản lý sản phẩm 43
3.2.13 Nghiệp vụ duyệt đơn hàng 45
3.2.15 Nghiệp vụ trình chiếu quảng cáo 46
3.2.16 Nghiệp vụ quản lý phân quyền 47
4.1 LƯỢC ĐỒ CƠ SỞ DỮ LIỆU SQL SERVER 49
5.1 SƠ ĐỒ LỚP CỦA ỨNG DỤNG 63
5.5 MÀN HÌNH XEM THÔNG TIN SẢN PHẨM 72
5.8 MÀN HÌNH TRANG QUẢN LÝ ADMIN 76
5.8.1 Màn hình quản lý đơn hàng 76
6.1 KẾ HOẠCH KIỂM THỬ CHUNG 78
6.2 CHI TIẾT TEST CASE ĐÃ KIỂM THỬ 78
2.NHỮNG ƯU ĐIỂM VÀ NHƯỢC ĐIỂM KHI THỰC HIỆN 82
3.HƯỚNG PHÁT TRIỂN CHO TƯƠNG LAI 82
Hình 1.2: MVC trong AspNet Core 12
Hình 3.1: Lược đồ Use Case tổng quát 21
Hình 3.2: Lược đồ Use Case quản lý thông tin cá nhân 22
Hình 3.3: Lược đồ Use Case quản lý đơn hàng bán 23
Hình 3.4: Lược đồ Use Case quản lý giỏ hàng 24
Hình 3.5: Lược đồ Use Case quản lý nhập hàng 25
Hình 3.6: Lược đồ Use Case quản lý phân quyền 26
Hình 3.7: Lược đồ Use Case quản lý sản phẩm 26
Hình 3.8: Lược đồ Use Case thống kê 27
Hình 3.9: Lược đồ Use Case tra cứu sản phẩm 27
Hình 3.10: Lược đồ Use Case quản lý trình chiếu 28
Hình 3.11: Lược đồ hoạt động nghiệp vụ Đăng ký 29
Hình 3.12: Lược đồ tuần tự nghiệp vụ Đăng ký 30
Hình 3.13: Lược đồ hoạt động nghiệp vụ Đăng nhập 31
Hình 3.14: Lược đồ tuần tự nghiệp vụ Đăng nhập 32
Hình 3.15: Lược đồ hoạt động nghiệp vụ Chỉnh sửa thông tin 33
Hình 3.16: Lược đồ tuần tự nghiệp vụ Chỉnh sửa thông tin 33
Hình 3.17: Lược đồ hoạt động nghiệp vụ Tra cứu sản phẩm 33
Hình 3.18: Lược đồ tuần tự nghiệp vụ Tra cứu sản phẩm 34
Hình 3.19: Lược đồ hoạt động nghiệp vụ Xem danh mục sản phẩm 34
Hình 3.20: Lược đồ tuần tự nghiệp vụ Xem danh mục sản phẩm 35
Hình 3.21: Lược đồ hoạt động nghiệp vụ Xem thông tin sản phẩm 35
Hình 3.22: Lược đồ tuần tự nghiệp vụ Xem thông tin sản phẩm 36
Hình 3.23: Lược đồ hoạt động nghiệp vụ Quản lý giỏ hàng 36
Hình 3.24: Lược đồ tuần tự nghiệp vụ Quản lý giỏ hàng 37
Hình 3.25: Lược đồ hoạt động nghiệp vụ Đặt hàng 37
Hình 3.26: Lược đồ tuần tự nghiệp vụ Đặt hàng 38
Hình 3.27: Lược đồ hoạt động nghiệp vụ Đánh giá sản phẩm 38
Hình 3.28: Lược đồ tuần tự nghiệp vụ Đánh giá sản phẩm 39
Hình 3.29: Lược đồ hoạt động nghiệp vụ Bình luận 39
Hình 3.30: Lược đồ tuần tự nghiệp vụ Bình Luận 40
Hình 3.31: Lược đồ hoạt động nghiệp vụ Quản lý nhập hàng 41
Hình 3.32: Lược đồ tuần tự nghiệp vụ Quản lý nhập hàng 42
Hình 3.33: Lược đồ hoạt động nghiệp vụ Quản lý sản phẩm 43
Hình 3.34: Lược đồ tuần tự nghiệp vụ Quản lý sản phẩm 44
Hình 3.35: Lược đồ hoạt động nghiệp vụ Duyệt đơn hàng 45
Hình 3.36: Lược đồ tuần tự nghiệp vụ Duyệt đơn hàng 45
Hình 3.37: Lược đồ hoạt động nghiệp vụ Thống kê 46
Hình 3.38: Lược đồ tuần tự nghiệp vụ Thống kê 46
Hình 3.39: Lược đồ hoạt động nghiệp vụ Trình chiếu 46
Hình 3.40: Lược đồ tuần tự nghiệp vụ Trình chiếu 47
Hình 3.41: Lược đồ hoạt động nghiệp vụ Quản lý phân quyền 47
Hình 3.42: Lược đồ tuần tự nghiệp vụ Quản lý phân quyền 48
Hình 4.1: Lược đồ tổng quát cơ sở dữ liệu 49
Hình 5.1: Sơ đồ lớp Models 63
Hình 5.2: Sơ đồ lớp Controller 64
Hình 5.3: Sơ đồ lớp Helpers 65
Hình 5.4: Sơ đồ lớp ViewModel 66
Hình 5.5: Giao diện trang chủ 67
Hình 5.6: Giao diện đăng nhập 69
Hình 5.7: Giao diện đăng ký 70
Hình 5.8: Giao diện chi tiết sản phẩm 72
Hình 5.9: Giao diện chi tiết giỏ hàng 73
Hình 5.10: Giao diện thông tin cá nhân 74
Hình 5.11: Giao diện đơn hàng cá nhân 75
Hình 5.12: Giao diện quản lý sản phẩm 76
Bảng 1.1: Lịch sử phát triển ASP.NET CORE 10
Bảng 5.1: Mô tả xử lý giao diện trang chủ 67
Bảng 5.2: Mô tả xử lý giao diện đăng nhập 69
Bảng 5.3: Mô tả xử lý giao diện đăng ký 71
Bảng 5.4: Mô tả xử lý giao diện sản phẩm 72
Bảng 5.5: Mô tả xử lý giao diện giỏ hàng 73
Bảng 5.6: Mô tả xử lý giao diện chỉnh sửa thông tin cá nhân 74
Bảng 5.7: Mô tả xử lý giao diện đơn hàng cá nhân 75
Bảng 5.8: Mô tả xử lý giao diện quản lý sản phẩm 76
Bảng 6.1: Kiểm thử người dùng 78
DANH MỤC CHỮ VIẾT TẮT VÀ TỪ TIẾNG ANH
- API: viết tắt của chữ Application Programming Interface nghĩa là giao diện lập trình ứng dụng
- Test case: mô tả một dữ liệu đầu vào (input), hành động (action) hoặc một sự kiện (event) và kết quả truy vấn (expected response)
- CSDL: viết tắt của cơ sở dữ liệu
- HTTP: Hypertext Transfer Protocol có nghĩa là giao thức truyển tải siêu văn bản
-MVC: Model View Controller là một kiến trúc phần mềm hay mô hình thiết kế
IIS (Internet Information Services) là dịch vụ máy chủ được phát triển cho hệ điều hành Windows, giúp cung cấp và phân phối thông tin trên internet một cách hiệu quả.
1 Tính cấp thiết của đề tài
Khi xã hội phát triển và mức sống của người dân được nâng cao, nhu cầu mua sắm ngày càng trở nên thiết yếu Tuy nhiên, việc tìm kiếm sản phẩm ưng ý tại cửa hàng không hề đơn giản, đặc biệt đối với những người bận rộn Vấn đề vị trí địa lý cũng gây khó khăn cho việc lựa chọn, cùng với việc so sánh sản phẩm cùng loại trong thời gian hạn chế tại cửa hàng Hơn nữa, thông tin từ người tiếp thị thường chỉ tập trung vào việc bán hàng, không giúp khách hàng có cái nhìn toàn diện về sản phẩm.
Thời đại Internet bùng nổ đã mở ra nhiều cơ hội kinh doanh mới, đặc biệt là thương mại điện tử, nơi mô hình website bán hàng online đang dần thay thế phương thức bán hàng truyền thống Mô hình này không chỉ khắc phục những khó khăn của bán hàng truyền thống mà còn mang lại nhiều lợi ích như cung cấp thông tin sản phẩm rõ ràng, cho phép người tiêu dùng lựa chọn màu sắc phù hợp và so sánh các sản phẩm cùng loại để đưa ra quyết định thông minh Chỉ với vài thao tác đơn giản trên smartphone hoặc máy tính, người tiêu dùng có thể nhận hàng tận nhà một cách nhanh chóng và tiện lợi.
Chủ cửa hàng có thể tiết kiệm chi phí đáng kể như tiền thuê mặt bằng, chi phí tiếp thị và trang trí cửa hàng Việc quản lý trở nên chính xác, nhanh chóng và dễ dàng thông qua website.
Nhóm nghiên cứu quyết tâm ứng dụng kiến thức tích lũy trong suốt quá trình học đại học vào việc phát triển một sản phẩm thiết thực và ý nghĩa, đồng thời hoàn thành đề tài khóa luận tốt nghiệp.
- Tổng hợp cơ sở lý thuyết về Angular 7 và ASP NET Core và ứng dụng 2 nền tảng đó vào ứng dụng cụ thể thiết thực có giá trị
- Nghiên cứu thực trạng và đánh giá về thị trường website bán hàng
- Xây dựng được một ứng dụng hoàn chỉnh có thể sử dụng thực tế
- Trình bày báo cáo khoa học và hợp lý về nội dung trong đề tài khóa luận tốt nghiệp
- Đảm bảo tiếp tục phát triển ứng dụng, hoàn thiện mọi chức năng, nâng cấp đưa ra thị trường sử dụng thực tế
- Hiểu được nhu cầu mua bán hàng của mọi người và nhu cầu trải nghiệm website
3 Phương pháp nghiên cứu Để thực hiện mục tiêu và nhiệm vụ nghiên cứu, nhóm đã sử dụng các phương pháp nghiên cứu sau:
- Phương pháp nghiên cứu tài liệu: Đọc các tài liệu tham khảo, xem video cách sử dụng tính năng
Phương pháp chuyên gia bao gồm việc nhận sự góp ý và tư vấn từ giáo viên hướng dẫn cùng các giảng viên trong khoa Công nghệ thông tin của trường Đại học Sư phạm Kỹ thuật TP.HCM.
4 Đối tượng, phạm vi nghiên cứu
- Cơ chế hoạt động của website bán hàng trực tuyến
- Nhu cầu, khả năng sử dụng website bán hàng trong thực tế
Về phạm vi nghiên cứu nhóm chủ yếu nghiên cứu về cách sử dụng Angular và
Asp.net core để xây dựng được một website bán hàng cơ bản có thể sử dụng được
Tương lai có thể mở rộng quy mô, ứng dụng thêm nhiều chức năng mới phù hợp với nhu cầu người dùng
5 Phân tích những website bán hàng online trên thị trường
5.1 Khảo sát website bán hàng online Lazada
+ Có thể đăng nhập bằng facebook hoặc google+
Danh mục sản phẩm được phân chia theo menu đa cấp, giúp người dùng dễ dàng tìm kiếm ngành hàng Khách hàng có thể kiểm tra đơn hàng nhanh chóng chỉ với email và mã đơn hàng mà không cần phải đăng nhập Ngoài ra, hệ thống cho phép lựa chọn sản phẩm trong giỏ hàng để đặt hàng mà không bắt buộc phải đặt tất cả.
+ Không hiển thị toàn bộ sản phẩm (Cho phép xem thêm sản phẩm với nút “tải thêm” mỗi lần thêm 4 hàng)
+ Hiển thị đường dẫn đến sản phẩm (xem thêm các sản phẩm cùng ngành hàng) + Cho phép sắp xếp sản phẩm theo độ phổ biến hoặc theo giá
+ Hỗ trợ lọc sản phẩm với thương hiệu, vị trí, giá cả, đánh giá (rating),
+ Hỗ trợ chế độ xem lưới hoặc xem danh sách
+ Thêm nhiều vị trí đặt hàng, nhớ vị trí đặt hàng trước đó
+ Rating/đánh giá sản phẩm
+ Xem lại lịch sử tìm kiếm (lưu bằng cookie)
+ Gợi ý sản phẩm khác mà mọi người cũng xem khi xem sản phẩm này
+ Chat trực tiếp với người bán hàng
+ Danh sách tìm kiếm phổ biến thay đổi ngay sau khi tải lại trang => có thể chỉ là sản phẩm ngẫu nhiên
Trang adayroi.com đã cải thiện chức năng tìm kiếm bằng cách thêm tùy chọn ngành hàng, giúp người dùng tìm kiếm chính xác hơn Ngoài ra, trang cũng giải quyết vấn đề không xem lại được những sản phẩm đã xem, mang đến trải nghiệm mua sắm tốt hơn cho khách hàng.
+ Mỗi câu hỏi chỉ một câu trả lời, không thể tiếp tục cuộc trò chuyện
5.2 Khảo sát website bán hàng Shopee
+ Phải nhập mã kích hoạt sms trước mỗi lần đăng nhập
+ Gợi ý sản phẩm tương tự (cùng tên hoặc cùng chức năng) thay vì gợi ý sản phẩm người khác cũng tìm kiếm thêm như lazada
Chức năng lọc đánh giá bằng sao được hiển thị rõ ràng với nhiều nút khác nhau, giúp người dùng dễ dàng xem đánh giá một cách nhanh chóng Ngoài ra, người dùng còn có thể đánh giá sản phẩm thông qua hình ảnh, tạo thêm sự thuận tiện và trực quan trong việc đưa ra nhận xét.
+ Gợi ý từ khóa tìm kiếm ngay dưới thanh search
+ Tìm kiếm thông qua tag # nhanh và chính xác
+ Thêm nhanh sản phẩm vào giỏ hàng
+ Tải thêm danh sách sản phẩm mỗi khi trượt thanh scrollbar
+ Chat trực tiếp với người bán hàng
+ Chỉ xem được đơn hàng trong tài khoản của mình (không hỗ trợ tra cứu qua mã hóa đơn)
+ Chỉ được đánh giá sản phẩm, không được đặt câu hỏi hay bình luận
+ Không xem lại được sản phẩm đã xem trước đó (Tiki có chức năng này)
5.3 Khảo sát Thế giới di động
+ Không cần tạo tài khoản để mua hàng
+ Kinh doanh nhiều mặt hàng về thiết bị điện tử
+ Đánh giá bình luận sản phẩm khi không cần tài khoản
+ Trên header khi cuộn xuống sâu sẽ cho mình biết mình đang ở hạng mục sản phẩm nào
+ Có tính năng xem 360 độ rất hay
+ Có danh mục hỏi đáp và thào luận
+ Sắp xếp sản phẩm theo giá, tính năng, trả góp 0%
+ Khách hàng mỗi lần đặt hàng đều phải điền thông tin, không thể sử dụng thông tin cũ
+ Quảng cáo khá nhiều dễ bị rối mắt
+ Nội dung trang khá dày đặc
6 Kết quả dự kiến đạt được
- Có thể vận dụng sử dụng được Angular và Asp.net Core
- Hoàn thành cơ bản được website bán hàng, hoạt động mượt mà, giao diện đẹp
- Hiểu sâu về quy trình làm báo cáo luận văn
- Thấy được những tính năng thiết yếu đối với một trang web bán hàng
PHẦN NỘI DUNG CHƯƠNG 1: TÌM HIỂU VỀ ANGULAR + ASP.NET CORE
1.1.1 Giới thiệu về Angular 7 và nguồn gốc ra đời
Angular, thường được biết đến với tên gọi "Angular 2+" hoặc "Angular v2 trở lên", là một khung ứng dụng web mã nguồn mở được phát triển dựa trên TypeScript bởi Nhóm Angular tại Google cùng với sự hỗ trợ của cộng đồng cá nhân và tổ chức Đây là một phiên bản viết lại hoàn toàn từ AngularJS, nhằm cung cấp các tính năng và hiệu suất vượt trội hơn.