SỞ LÝ THUYẾT
ASP.NET MVC là gì?
ASP.NET MVC là một framework tuyệt vời hỗ trợ pattern MVC cho ASP.NET
Để hiểu cách thức hoạt động của ASP.NET MVC, bạn cần nắm vững mô hình MVC, viết tắt của Model-View-Controller, phân chia ứng dụng thành ba phần chính: model, controller và view.
Hình 0-1: Mô Hình ASP.NET MVC
Mô hình lưu trữ dữ liệu ứng dụng và trạng thái của nó, có thể là một cơ sở dữ liệu hoặc đơn giản chỉ là một tệp XML.
View là giao diện người dùng mà khách truy cập sử dụng để xem dữ liệu trên trang web Trong các ứng dụng ASP.NET MVC, các trang ASPX thường được sử dụng để hiển thị view.
Controller chịu trách nhiệm xử lý các tương tác của người dùng với trang web
Nó được sử dụng để xác định loại view nào cần phải được hiển thị Controller cũng được sử dụng cho mục đích giao tiếp với model
Hình 0-2:Bảng Mô Tả Các Phiên Bản Của ASP.NET MVC
Mặc dù ASP.Net MVC được ra mắt vào năm 2009, nhưng đến năm 2013, nó đã trải qua nhiều nâng cấp và phát triển, dẫn đến sự ra đời của phiên bản ASP.Net MVC mới.
5, đây cũng là 1 trong những ưu điểm của ông lớn Microsoft cập nhật công nghệ liên tục
Mới đây thì ASP.Net cũng đã cho ra đời công nghệ mới đó là ASP.Net core 1.0
Sự cập nhật thường xuyên đã giúp ASP.Net MVC phát triển mạnh mẽ, không kém cạnh gì các công nghệ lập trình web khác như Java và PHP.
Cơ chế hoạt động của ASP.NET MVC
Hình 0-3:Cơ Chế Hoạt Động của ASP.NET MVC
Dựa vào hình mô phỏng phía trên này thì mình sẽ khái quá sơ qua cơ chế hoạt động của ASP.Net MVC
1 User gửi 1 yêu cầu tới server bằng cách truyền vào 1 URL trong browser
2 Yêu cầu đó được gửi tới controller đầu tiên, controller sẽ xử lý yêu cầu, nếu yêu cầu cần truy xuất dữ liệu thì controller sẽ chuyển qua tầng model
3 Tại tầng model, dữ liệu được truy xuất từ database và sau đó truyền qua view thông qua controller
4 Controller sẽ giúp dữ liệu được chuyển từ model qua view
5 View là tầng cuối cùng giao tiếp với User, mọi dữ liệu sẽ được hiển thị cho User thông qua tầng View
Những ưu điểm của ASP.NET MVC
1 Do sử dụng mô hình MVC nên trong ASP.Net MVC đã tách biệt được các tầng trong mô hình lập trình web vì vậy giúp tối ưu ứng dụng và dễ dàng trong việc viết code, giao diện
2 Giao diện trong ASP.Net MVC sử dụng công nghệ thiết kế web HTML, CSS nền việc thiết kế giao diện trở nên dễ dàng và giúp cho designer linh hoạt trong việc thiết kế
3 ASP.Net MVC không sử dụng view state vì vậy trang web không bị tăng kích thước do đó hiệu năng hoạt động không bị bị giảm
ASP.Net MVC đã khắc phục được các nhược điểm của web forms vì vậy web forms hiện nay không còn được dùng phổ biến nữa.
So sánh ASP.NET Webform với ASP.NET MVC
ASP.NET Web Forms sử dụng ViewState để quản lý lifecycle của trang web và xử lý postback Hệ thống này dựa vào các web controls và events để thực hiện các hành động trên giao diện người dùng khi có sự tương tác từ người dùng, dẫn đến việc ASP.NET thường gặp vấn đề về hiệu suất và xử lý chậm.
Asp.net MVC Framework chia làm 3 phần: Models, Views, Controllers Mọi tương tác với Views sẽ thực hiện hành động trong Controller, không còn postback,lifecycle và các events
Kiểm tra lỗi và gỡ lỗi trong Asp.net yêu cầu chạy tất cả các tiến trình của nó, và mọi thay đổi về ID của control đều ảnh hưởng đến ứng dụng Đối với Asp.net MVC Framework, việc sử dụng unit test giúp đánh giá hiệu suất của các Controller một cách hiệu quả.
Các tính năng ASP.net WebForm ASP.net MVC
Kiến trúc mô hình WebForm –>
Kiến trúc sử dụng việc phân chia chương trình thành:
Sử dụng cú pháp của WebForm, tất cả các sự kiện và controls do server quản lý
Các sự kiện được điều khiển bởi controllers, các controls không do server quản lý
Sử dụng hầu hết các công nghệ truy cập dữ liệu trong ứng dụng
Phần lớn dùng LINQ và SQL class để tạo mô hình truy cập đối tượng
Debug Debug phải thực hiện tất cả bao gồm các lớp truy cập dữ liệu, sự hiển thị, điều khiển các controls
Debug có thể sử dụng các unit test để kiểm tra các phương thức trong controllers
Tốc độ phân tải Tốc độ phân tải chậm khi trong trang có quá nhiều các controls vì ViewState quá lớn
Phân tải nhanh hơn do không phải quản lý ViewState để quản lý các controls trong trang
Tương tác với JavaScript khó khăn vì các controls được điều khiển bởi server
Tương tác với JavaScript dễ dàng vì các đối tượng không do server quản lý điều khiển không khó
URL address Cấu trúc địa chỉ URL có dạng:
Cấu trúc địa chỉ rành mạch theo Controllers/Action/ID BẢNG 1.1 So Sánh ASP.NET Webform với ASP.NET MVC
TÍCH THIẾT KẾ HỆ THỐNG
Mô tả dự án
-Hệ thống bán đồ điện tử online bao gồm 1 trang web dành cho user và admin
Người dùng có thể truy cập trang web để xem danh sách sản phẩm được phân loại theo từng chủng loại và nhà sản xuất, đồng thời tìm kiếm sản phẩm bằng từ khóa.
+ Cho phép người dùng thêm vào giỏ hàng, quản lý giỏ hàng, chỉnh sửa số lượng, xóa giỏ hàng và hiện tổng tiền
+ Khách hàng gồm 2 vai trò: khách hàng không có tài khoản (guest) và có tài khoản (customer)
+ Nếu người dùng chưa có tài khoản thì sẽ hiện form điền thông tin khi đặt hàng
+ Người dùng đã đăng ký tài khoản để mua sản phẩm mà không cần phải điền form thông tin
+ Các admin có quyền đăng nhập và đăng ký
+ Tại trang chủ sẽ thống kê các thông tin của cửa hàng
+ Admin được phép thêm, xem, xóa, sửa quyền
+ Mỗi loại tài khoản sẽ được phân quyền khác nhau
+ Ở trang quản lý sản phẩm, các tài khoản có quyền vào được phép thêm, xem , xóa, sửa sản phẩm
+ Ở trang quản lý chủng loại sản phẩm, các tài khoản có quyền vào được phép thêm, xem , xóa, sửa chủng loại sản phẩm
+ Ở trang quản lý chủng loại sản phẩm, các tài khoản có quyền vào được phép thêm, xem , xóa, sửa nhà sản xuất.1
+ Ở trang quản lý nhập hàng, các tài khoản có quyền vào được phép thêm, xem , xóa, sửa đơn nhập hàng
Trong phần đơn đặt hàng, các tài khoản có quyền truy cập có thể theo dõi tình trạng các đơn hàng, bao gồm những đơn chưa thanh toán, đã thanh toán nhưng chưa giao, và những đơn đã thanh toán và đã giao Ngoài ra, họ cũng có khả năng duyệt đơn hàng một cách dễ dàng.
Actor và Use Cases
+ ) Xem xét Website về phía khách hàng ta thấy:
- Những người muốn mua hàng vào website để xem thông tin.Những người này là
Khách hàng tiềm năng (Guest)
- Những người đã đặt hàng vào kiểm tra đơn hàng, thanh toán v.v gọi là Khách hàng (Customer)
+ ) Về phía đơn vị bán hàng, có những người sau đây tham gia vào hệ thống:
- Người quản lý bán hàng: quyết định nhập hàng, giá bán, quản lý tồn kho, doanh thu, chính sách khuyến mãi
- Người bán hàng: Tư vấn cho khách hàng, theo dõi đơn hàng, thu tiền, theo dõi chuyển hàng cho khách
- Quản trị hệ thống: Tạo người dùng, Phân quyền, Tạo cửa hàng
Vậy, các Actor của hệ thống gồm: Khách hàng tiềm năng, khách hàng,
Người bán hàng, Quản trị hệ thống,Người quản lý bán hàng
Xét với Actor “Khách hàng tiềm năng”
- Xem các sản phẩm theo:
+ Chủng loại + Nhà sản xuất + Tìm kiếm theo văn bản gõ vào
- Xem chi tiết sản phẩm được chọn
- Đăng ký tài khoản để trở thành khách hàng
Xét Actor “Người bán hàng”
Xét Actor “Quản lý hệ thống”
- Cấp/Phân quyền cho tài khoản
- Cấu hình hệ thống thông tin
Xét Actor “Quản lý bán hàng”
- Quản lý thông tin sản phẩm,giá bán
- Quản lý số lượng sản phẩm
- Quản lý tổng số đơn hàng
Bản vẽ các USE-CASE
Xem xét và phân tích chức năng của“Khách hàng tiềm năng” ta nhận thấy:
- Chức năng xem sản phẩm có 2 cách là: chọn loại sản phẩm - nhà sản xuất hoặc gõ vào ô tìm kiếm
Nên ta tách ra làm 2 là Xem sản phẩm và Tìm kiếm
- Chức năng mua hàng, thực chất là thêm vào giỏ hàng nên có thể xem là chức năng con của quản lý giỏ hàng
Đặt chức năng và xác định các mối quan hệ, ta có thể vẽ Use Case Diagram cho Actor “Khách hàng tiềm năng” lại như sau:
Hình 0-1:Sơ đồ Use Case Khách Hàng Tiềm Năng
Xem xét và phân tích chức năng của“Khách hàng” ta nhận thấy:
- Chức năng “Thanh toán” thường thực hiện cho từng đơn hàng cụ thể nên có thể nó là chức năng con của “Quản lý đơn hàng”
– Chức năng “Đăng nhập” khách hàng có thể sử dụng chức năng “Đăng xuất” hoặc sử dụng chức năng “Đổi mật khẩu” nếu khách hàng cần
Hình 0-2:Sơ Đồ Use Case Khách Hàng
Xem xét và phân tích chức năng của“Người bán hàng” ta nhận thấy:
Chức năng “Thu tiền” cho phép thanh toán trực tiếp cho từng đơn hàng, trong khi chức năng “Theo dõi chuyển hàng” được áp dụng cho từng đơn hàng cụ thể Do đó, cả hai chức năng này có thể được xem là các tính năng con trong hệ thống “Quản lý đơn hàng”.
Hình 0-3:Sơ Đồ Use Case Người Bán Hàng
Xem xét và phân tích chức năng của“Quản lý hệ thống” ta nhận thấy:
– Chức năng “Đăng nhập”người quản lý có thể sử dụng chức năng “Đăng xuất” hoặc sử dụng chức năng “Đổi mật khẩu” nếu người quản lý cần
– Chức năng “Quản lý tài khoản”người quản lý có thể sử dụng chức năng
“Xóa tài khoản” hoặc sử dụng chức năng “Cấp(phân quyền) tài khoản” nếu người quản lý cần
Hình 0-4:Sơ Đồ Use Case Quản Lý Hệ Thống
Xem xét và phân tích chức năng của“Quản lý bán hàng” ta nhận thấy:
– Chức năng “Đăng nhập”người quản lý có thể sử dụng chức năng “Đăng xuất” hoặc sử dụng chức năng “Đổi mật khẩu” nếu người quản lý cần
Hình 0-5:Sơ Đồ Use Case Quản Lý Bán Hàng
Đặc tả USE-CASE
2.4.1.Use case “ Kh á ch h à ng ti ề m n ă ng ”
2.4.1.Use case “ Kh á ch h à ng ”
Tên USE-CASE Khách hàng
Mô tả Khách hàng đặt hoặc mua sản phẩm Điều kiện kích hoạt Tên đăng nhập và mật khẩu khớp với thông tin đăng ký
Tiền điều kiện Khách hàng đã đặt hoặc mua sản phẩm
Hậu điều kiện Khách hàng nhận hoặc không có hàng
Tên USE-CASE Khách hàng tiềm năng
Mô tả Khách hàng muốn mua,đặt hàng cần đăng ký tài khoản Điều kiện kích hoạt Khi khách hàng tiến hành mua hàng
Tiền điều kiện Khách hàng cho biết sản phẩm khách hàng cần mua
Hậu điều kiện Khách hàng có thể mua hoặc không
Luồng sự kiện chính 1 Khách hàng đăng ký tài khoản
2 Khách hàng có thể mua hoặc đặt hàng
3 Mua thành công hoặc ngược lại
4 Kết Thúc chính 2 Khách hàng có thể mua hoặc đặt hàng
3 Khách hàng có thể đổi hoặc hoàn trả
4 Mua thành công hoặc ngược lại
2.4.2.Use case “ Ng ườ i b á n h à ng ”
Tên USE-CASE Người bán hàng
Mô tả Nhân viên sẽ quản lý đơn hàng của khách hàng Điều kiện kích hoạt Tên đăng nhập và mật khẩu khớp với thông tin đăng ký
Tiền điều kiện Nhân viên thu thập thông tin khách hàng
Hậu điều kiện Khách hàng có thể mua hoặc không
Luồng sự kiện chính 1 Lập hóa đơn khi khách hàng mua hàng(thông báo cho khách biết nếu còn hàng hoặc không)
2 Cung cấp thông tin sản phẩm và chi tiết đơn hàng
2.4.3.Use case “ Qu ả n lý b á n h à ng ”
Tên USE-CASE Quản lý bán hàng
Quản lý thông tin sản phẩm, số lượng, đơn hàng và doanh thu trong hệ thống là một tính năng quan trọng Tính năng này được kích hoạt khi người dùng cập nhật thông tin bán hàng.
Tiền điều kiện Actor phải đăng nhập vào hệ thống
Hậu điều kiện Nếu thành công thông tin sản phẩm sẽ được cập nhật và ngược lại
Luồng sự kiện chính 1 Hệ thống yêu cầu chọn chức năng muốn thực hiện
2 Quản lý số lượng , đơn hàng , doanh thu
3 Quản lý thông tin về sản phẩm
2.4.4.Use case “ Qu ả n lý h ệ th ố ng ”
Tên USE-CASE Quản lý hệ thống
Mô tả Có thể cấp quyền tài khoản , cấu hình hệ thống website Điều kiện kích hoạt Đăng nhập hợp lệ
Tiền điều kiện Actor phải đăng nhập vào hệ thống
Hậu điều kiện Nếu use case thành công, thông tin được thêm, cập nhật hoặc xóa khỏi hệ thống Ngược lại, trạng thái không thay đổi
Luồng sự kiện chính 1 Hệ thống yêu cầu actor chọn chức năng muốn thực hiện (Thêm nhân viên, Cập nhật thông tin nhân viên, hoặc Xóa nhân viên)
2 Sau khi actor cung cấp thông tin được yêu cầu, một trong các luồng phụ sau được thực hiện
Nếu chọn “Thêm thông tin nhân viên”, luồng phụ Thêm nhân viên được thực hiện
Nếu chọn “Cập nhật thông tin nhân viên”, luồng phụ Cập nhât thông tin nhân viên được thực hiện
Nếu chọn “Xóa thông tin nhân viên”, luồng phụ Xóa nhân viên được thực hiện
Sơ Đồ Tuần Tự
Hình 0-6:Sơ Đồ Tuần Tự Đăng Nhập
Hình 0-7:Sơ Đồ Tuần Tự Tìm Kiếm
Hình 0-8:Sơ đồ Tuần Tự Thêm Sản Phẩm
Sơ Đồ Hoạt Động
Hình 0-10: Sơ Đồ Hoạt Động Đăng Ký
Hình 0-11: Sơ Đồ Hoạt Động Đăng Nhập
Hình 0-12:Sơ Đồ Hoạt Động Thêm Sản Phẩm
Hình 0-13:Sơ Đồ Hoạt Động Sửa Thông Tin Sản Phẩm
Hình 0-14:Sơ Đồ Hoạt Động Tìm Kiếm Sản Phẩm
Hình 0-15:Sơ Đồ Hoạt Động Xem Giỏ Hàng
Thiết kế dữ liệu
2.8.1.Hệ thống được xây dựng
ĐẶT HỆ THỐNG
Giao diện đăng nhập
Hình 0-4:Giao diện đăng nhập
Giao Diện Giỏ Hàng
Hình 0-5:Giao Diện Giỏ Hàng
Hiển thị các sản phẩm trong giỏ hàng với khả năng chỉnh sửa số lượng hoặc xóa sản phẩm Khách hàng chỉ cần bấm đặt hàng khi đã cung cấp đầy đủ thông tin hoặc đăng nhập.
Giao Diện Thống Kê của ADMIN
Giao Diện Quản Lý Khách
Hình 0-7:Giao diện quản lí khách hàng
- Hiển thị danh sách thành viên trong hệ thống và có chức năng thêm, xóa , sửa các thành viên
Trang quản lí đơn hàng
Giao diện quản lý đơn hàng hiển thị danh sách các đơn nhập hàng với các trạng thái khác nhau: chưa thanh toán, chưa giao, đã thanh toán, đã giao và đã thanh toán Ngoài ra, hệ thống còn có chức năng duyệt đơn hàng để cập nhật trạng thái của từng đơn.
TỔNG KẾT
Kết quả đạt được
+ Cơ bản nắm được các bước để xây dựng một website bán điện tử trực tuyến, thực hiện đúng yêu cầu và tiện ích đối với người dùng
+Tìm hiểu và nắm rõ về các công cụ để xây dựng website:SQL,Visual Studio
+ Xây dựng hệ thống có bố cục trang hợp lý ,tiện lợi cho khách hàng,bước đầu thực hiện được nghiệp vụ của hệ thống
Website này giúp người dùng tiết kiệm thời gian và công sức trong việc tìm kiếm sản phẩm ưng ý Nó cho phép quản lý thông tin chi tiết của người dùng, thông tin sản phẩm và đơn hàng, từ đó tạo điều kiện thuận lợi cho quá trình thanh toán và giao hàng.
+ Thực hiện kiểm thử phần mềm ở mức độ lập trình
Các chức năng đã hoàn thành
*Đồ án hiện chỉ mới được thực hiện ở giai đoạn 1:
-Thêm giỏ hàng, xóa và sửa chi tiết giỏ hàng, đặt hàng
-Hiển thị danh sách sản phẩm theo loại, theo nhà sản xuất
-Phân quyền và quản lý quyền
-Quản lý đơn đặt hàng
-Quản lí banner -Quản lí menu
-Quản lý sản phẩm, loại sản phẩm, nhà sản xuất.
Các chức năng có thể phát triển
- Thêm ưu đãi cho hội viên
- Tìm kiếm trong trang quản lý
- Xác thực 2 yếu tố qua gmail hoặc điện thoại khi đăng ký, quên mật khẩu, mã hóa mật khẩu
- Áp dụng async & await để tối ưu hóa trang web
- Thêm sơ đồ trong trang dashboard
- Dùng attribute routing để đường dẫn chuẩn seo
- Áp dụng design pattern để hệ thống dễ quản lý code và dễ mở rộng hơn.