Bối cảnh và vấn đề nghiên cứu

Trong bối cảnh công nghệ thông tin và tin học hóa phát triển, việc ứng dụng các nền tảng trực tuyến trở thành giải pháp hỗ trợ hoạt động của các tổ chức, doanh nghiệp và cửa hàng thương mại. Sự hiện diện của các website giới thiệu sản phẩm và bán hàng trực tuyến giúp khắc phục các hạn chế về khoảng cách địa lý và quy trình trao đổi truyền thống, đồng thời hỗ trợ cập nhật thông tin sản phẩm, thông báo, dịch vụ và tư vấn khách hàng. Đối với lĩnh vực kinh doanh linh kiện xe hơi, nhu cầu tìm kiếm, thay thế, nâng cấp phụ tùng và đồ chơi công nghệ đòi hỏi một hệ thống có khả năng giới thiệu chi tiết danh mục hàng hóa, tích hợp giỏ hàng và xử lý đơn đặt hàng trực tuyến.

Đề tài "Xây dựng website bán hàng online" (với tên ứng dụng thực tế là "Website Linh kiện Và Phụ Tùng Xe Hơi") được sinh viên Chu Doãn Đức, chuyên ngành Khoa Học Dữ Liệu thuộc Khoa Công Nghệ Thông Tin, Trường Đại học Nguyễn Tất Thành thực hiện trong khuôn khổ đồ án môn học Lập trình Web vào tháng 12 năm 2021, dưới sự hướng dẫn của giảng viên Nguyễn Mai Huy.

Mục tiêu và nhiệm vụ nghiên cứu của đồ án bao gồm:

  1. Nghiên cứu cơ sở lý thuyết về mẫu thiết kế Model-View-Controller (MVC) và nền tảng phát triển ứng dụng web ASP.NET MVC Framework của Microsoft.
  2. Tìm hiểu cơ chế ánh xạ URL (URL routing), cú pháp Razor, các đối tượng truyền dữ liệu (ViewBag, ViewData, TempData) và thư viện hỗ trợ kết xuất giao diện (HTML Helpers).
  3. Nghiên cứu kỹ thuật tương tác dữ liệu thông qua công cụ Object-Relational Mapping (ORM), cụ thể là Microsoft ADO.NET Entity Framework và ngôn ngữ truy vấn tích hợp LINQ (Language Integrated Query).
  4. Khảo sát nhu cầu người dùng, phân tích đối tượng sử dụng hệ thống (khách hàng, người quản lý, nhân viên) để xác định các yêu cầu chức năng cho phân hệ người dùng (Public) và phân hệ quản trị (Private).
  5. Thiết kế và cài đặt cơ sở dữ liệu quan hệ gồm 7 bảng trên hệ quản trị Microsoft SQL Server 2018.
  6. Xây dựng mã nguồn website bằng công cụ Microsoft Visual Studio 2017, tích hợp mẫu giao diện web có sẵn và đưa hệ thống lên máy chủ lưu trữ (hosting) thực tế.

Đối tượng nghiên cứu của đồ án là quy trình xây dựng website thương mại điện tử phục vụ kinh doanh phụ tùng và đồ chơi xe hơi bằng mô hình MVC. Phạm vi nghiên cứu giới hạn trong phạm vi môn học Lập trình Web, tập trung vào việc hiện thực hóa các chức năng bán hàng cơ bản, quản lý danh mục và duyệt bài viết/sản phẩm mà chưa đi sâu vào các giải pháp thanh toán điện tử phức tạp hay cơ chế bảo mật nâng cao.

Cơ sở lý thuyết và phương pháp

Đề tài áp dụng các lý thuyết kiến trúc phần mềm và công nghệ phát triển web hướng đối tượng của hệ sinh thái Microsoft .NET:

  • Mẫu thiết kế Model-View-Controller (MVC): Kiến trúc phân tách ứng dụng thành ba thành phần độc lập:
    • Model: Đại diện cho cấu trúc dữ liệu và logic nghiệp vụ, quản lý trạng thái ứng dụng trong bộ nhớ và tương tác với kho lưu trữ.
    • View: Thành phần giao diện người dùng, hiển thị dữ liệu từ Model và tiếp nhận tương tác của người dùng.
    • Controller: Tiếp nhận các yêu cầu HTTP (HTTP Requests) thông qua các phương thức hành động (Action Methods), tương tác với Model để xử lý nghiệp vụ và lựa chọn View thích hợp kèm dữ liệu trả về cho trình duyệt.
  • ASP.NET MVC Framework: Khung phát triển ứng dụng web của Microsoft xây dựng trên .NET Framework, cung cấp bộ định tuyến URL (URL Routing) để ánh xạ các yêu cầu URL vào lớp Controller và chuyển đổi các tham số đường dẫn thành tham số của phương thức.
  • Cú pháp Razor và các đối tượng truyền tải:
    • Công cụ kết xuất giao diện dùng ký hiệu @ để nhúng mã C# trực tiếp vào HTML, hỗ trợ khối mã @{} và các thẻ @: hoặc <text> để phân định văn bản thuần.
    • Các cơ chế truyền dữ liệu giữa Controller và View bao gồm ViewData (kiểu từ điển, kiểm tra tại thời gian chạy), ViewBag (thuộc tính động, không yêu cầu ép kiểu) cùng với Session và Application State.
    • Lớp HtmlHelper hỗ trợ tạo form và thẻ điều khiển giao diện theo chương trình (Standard HTML Helpers, Strongly Typed HTML Helpers, Templated HTML Helpers) thông qua các phương thức mở rộng như BeginForm(), EndForm(), Label(), LabelFor().
  • Entity Framework và LINQ:
    • Khung ánh xạ đối tượng - quan hệ (ORM) ADO.NET Entity Framework giúp ánh xạ các lớp miền (Domain Classes) với các bảng dữ liệu quan hệ, tự động hóa các thao tác tạo, đọc, cập nhật, xóa (CRUD).
    • Mô hình dữ liệu thực thể (Entity Data Model - EDM) gồm ba tầng: mô hình khái niệm (Conceptual Model), mô hình ánh xạ (Mapping Model) và mô hình lược đồ lưu trữ (Storage Schema Model).
    • Cú pháp truy vấn tích hợp LINQ (Language Integrated Query) được sử dụng để truy xuất và thao tác dữ liệu nhất quán trên môi trường C#.

Về phương pháp thực hiện, tác giả sử dụng phương pháp xây dựng hệ thống phần mềm thực nghiệm, tiến hành phân tích yêu cầu, thiết kế lược đồ quan hệ thực thể, tạo bảng trên hệ quản trị cơ sở dữ liệu, viết mã logic xử lý trên Visual Studio và kiểm thử vận hành trực tiếp trên môi trường hosting công cộng.

Thiết kế và triển khai hệ thống

Hệ thống được phát triển và vận hành trên môi trường kỹ thuật gồm hệ điều hành Microsoft Windows 10, công cụ lập trình Microsoft Visual Studio 2017, hệ quản trị cơ sở dữ liệu Microsoft SQL Server Management Studio 18 và sử dụng bộ giao diện mẫu (template) dựng sẵn.

Cấu trúc dự án mã nguồn tuân thủ các quy ước thư mục chuẩn của ASP.NET MVC, bao gồm: App_Data (lưu trữ tập tin và dữ liệu), Content (chứa các định dạng CSS, thư viện Bootstrap), Scripts (chứa các tệp JavaScript, thư viện jQuery), cùng các thư mục Models và Controllers.

Cơ sở dữ liệu của website gồm 7 bảng quan hệ được thiết kế với các quy tắc kiểm tra ràng buộc và cơ chế tự sinh khóa chính theo chuỗi định dạng thời gian Năm-Tháng-Ngày-Giờ-Phút:

Tên bảng Số thuộc tính Khóa chính (PK) Khóa ngoại (FK) Chức năng lưu trữ dữ liệu
BaiViet 10 MaBV (Văn bản 10 ký tự, sinh tự động) TaiKhoan Lưu trữ bài viết tin tức, nội dung tóm tắt, nội dung chi tiết, trạng thái kiểm duyệt (DaDuyet kiểu Bit) và lượt đọc.
CtDonHang 5 Khóa phức hợp: SoHoaDon + MaSP SoHoaDon, MaSP Lưu chi tiết số lượng đặt, giá bán (BigInt) và tỷ lệ giảm giá (BigInt) của từng mặt hàng trong đơn hàng.
DonHang 7 SoHoaDon (Văn bản 10 ký tự, sinh tự động) MaKH, TaiKhoan Quản lý thông tin đơn hàng, trạng thái kích hoạt, ghi chú và địa chỉ nhận với thời hạn giao mặc định 2 ngày.
KhachHang 9 MaKH (Văn bản 10 ký tự, sinh tự động) Không Lưu thông tin cá nhân khách hàng (họ tên, điện thoại, email, địa chỉ, ngày sinh, giới tính, loại khách hàng VIP).
LoaiSP 3 MaLoai (Số nguyên, sinh tự động) Không Quản lý danh mục chủng loại, ngành hàng phụ tùng xe hơi kèm ghi chú chi tiết.
SanPham 13 MaSP (Văn bản 10 ký tự, sinh tự động) MaLoai, TaiKhoan Lưu trữ thông tin phụ tùng, đơn vị tính, nhà sản xuất, giá bán, giá giảm, nội dung mô tả và trạng thái duyệt.
TaiKhoan 11 TaiKhoan (Văn bản 20 ký tự) Không Quản lý danh sách tài khoản quản trị/nhân viên, mật khẩu (100 ký tự), thông tin liên hệ và trạng thái hoạt động.

Quy trình vận hành chức năng của hệ thống được chia thành hai phân hệ:

  • Phân hệ người dùng (Public): Gồm trang chủ (hiển thị danh mục sản phẩm theo tab phân loại từ bảng LoaiSP, SanPham và bài viết mới nhất từ bảng BaiViet), trang danh mục sản phẩm (sắp xếp theo ngày đăng mới nhất), trang bài viết, trang giới thiệu (About Us), trang dịch vụ, trang liên hệ (Contact Us) và quy trình giỏ hàng. Khi khách hàng bấm chọn sản phẩm, dữ liệu được ghi nhận vào vùng nhớ giỏ hàng; tại bước thanh toán (CheckOut), người dùng điền biểu mẫu thông tin cá nhân để hệ thống lưu đồng thời vào ba bảng KhachHang, DonHang và CtDonHang, sau đó xuất thông báo xác nhận đặt hàng thành công kèm thời gian giao hàng dự kiến là 2 ngày.
  • Phân hệ quản trị (Private): Yêu cầu xác thực tài khoản tại đường dẫn đăng nhập. Hệ thống quản lý bài viết và quản lý sản phẩm được tổ chức theo quy trình hai trạng thái: khi tạo mới, hệ thống tự động gán tài khoản người tạo và chuyển bài viết/sản phẩm vào danh sách "Cấm hiển thị". Người quản trị phải thực hiện thao tác kiểm duyệt thì dữ liệu mới cập nhật cột DaDuyet trong cơ sở dữ liệu và hiển thị ra giao diện người dùng bên ngoài. Phân hệ cũng cho phép thêm, sửa, xóa trực tiếp các nhóm ngành hàng trong bảng LoaiSP mà không cần thao tác thủ công trong cơ sở dữ liệu.

Hệ thống đã được tác giả xuất bản và triển khai trên máy chủ Internet tại địa chỉ http://doanduc-001-site1.com/ (tài khoản quản trị mặc định: admin, mật khẩu: abc, truy cập quản trị qua đường dẫn http://doanduc-001-site1.com/login).

Nội dung chính theo từng chương

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

Nội dung chương 1 tập trung tổng hợp cơ sở lý thuyết về mô hình lập trình và công nghệ sử dụng trong đồ án:

  • Phân tích chi tiết ba thành phần của mẫu thiết kế MVC, nêu rõ ưu điểm về khả năng hỗ trợ phát triển song song, hỗ trợ kỹ thuật không đồng bộ, tạo nhiều giao diện View cho cùng một Model và tối ưu hóa đường dẫn cho SEO. Đồng thời, tác giả cũng chỉ ra nhược điểm của MVC là độ phức tạp cao đối với các dự án nhỏ và đòi hỏi lập trình viên phải nắm vững nhiều công nghệ.
  • Trình bày kiến trúc của ASP.NET MVC Framework, nêu bật sự khác biệt giữa mẫu thiết kế (Design Pattern) và khung làm việc (Framework), cấu trúc các thư mục chuẩn trong dự án web.
  • Giải thích cơ chế ánh xạ URL động sang Controller, cách thức Action Method tiếp nhận và phản hồi các yêu cầu HTTP.
  • Giới thiệu cú pháp Razor, phân tích cơ chế hoạt động của ViewData và ViewBag, chỉ ra lý do hạn chế dùng hai đối tượng này trong thực tế do thiếu cơ chế kiểm tra lỗi kiểu dữ liệu tại thời gian biên dịch (compile-time error checking) và không có hỗ trợ nhận diện mã lệnh (IntelliSense).
  • Trình bày về lớp HtmlHelper, các phương thức dựng biểu mẫu BeginForm(), EndForm(), Label() và LabelFor().
  • Phân tích công nghệ ORM với Microsoft ADO.NET Entity Framework, cấu trúc ba phần của Entity Data Model (khái niệm, ánh xạ, lưu trữ) và cú pháp truy vấn dữ liệu thống nhất LINQ.

Chương 2: Xây dựng website bán phụ tùng ô tô

Chương 2 mô tả chi tiết quá trình phân tích, thiết kế và hiện thực hóa website:

  • Giới thiệu đề tài "Website Linh kiện Và Phụ Tùng Xe Hơi", chỉ định môi trường phát triển (Windows 10, Visual Studio 2017, SQL Server Management Studio 18) và bộ giao diện mẫu.
  • Xác định mục tiêu chức năng cho trang Public (đưa bài viết, sản phẩm từ cơ sở dữ liệu lên tự động, xử lý giỏ hàng, thanh toán và lưu hóa đơn) và trang Private (đăng bài viết, đăng sản phẩm, kiểm duyệt nội dung, lưu dữ liệu).
  • Phân tích 3 nhóm đối tượng sử dụng website: khách hàng (tìm kiếm, mua phụ tùng, đồ chơi xe, đọc tin tức thị trường xe), người quản lý (điều hành toàn bộ hệ thống website), nhân viên (tiếp cận và xử lý thông tin khách hàng, hóa đơn).
  • Trình bày sơ đồ cấu trúc dự án và sơ đồ cơ sở dữ liệu quan hệ gồm 7 bảng, phân tích chi tiết từng thuộc tính, kiểu dữ liệu, ràng buộc khóa chính và khóa ngoại của các bảng BaiViet, CtDonHang, DonHang, KhachHang, LoaiSP, SanPham và TaiKhoan.
  • Minh họa sơ đồ điều hướng giao diện cho người dùng và người quản trị.
  • Trình bày chi tiết giao diện và mã lệnh điều khiển của từng phân hệ: màn hình đăng nhập quản trị, chức năng kiểm duyệt bài viết và sản phẩm (tách biệt giữa danh sách đã duyệt và danh sách cấm hiển thị), biểu mẫu tạo bài viết và sản phẩm mới (xử lý lưu ảnh vật lý và gán tự động mã, tài khoản, ngày đăng), trang quản lý chủng loại hàng hóa, trang chủ tích hợp dữ liệu linh hoạt, các trang tĩnh (dịch vụ, giới thiệu, liên hệ), trang danh mục sản phẩm, trang giỏ hàng và biểu mẫu nhập thông tin thanh toán đơn hàng.

Chương 3: Kết luận

Chương 3 tổng kết toàn bộ quá trình thực hiện đồ án môn học:

  • Tự đánh giá ưu điểm: Giúp sinh viên tích lũy kinh nghiệm thực tế về quy trình phát triển phần mềm, hoàn thành cơ bản các chức năng cốt lõi của một website thương mại điện tử.
  • Tổng kết quy trình thực hiện đồ án qua 4 bước: lên ý tưởng; tìm kiếm và thiết kế giao diện phù hợp; triển khai các ý tưởng ban đầu; nghiên cứu và ứng dụng mô hình MVC.
  • Thừa nhận các điểm còn hạn chế của đồ án về mặt hoàn thiện giao diện, các trang con và việc thiếu hụt cơ chế bảo mật.
  • Đề xuất định hướng phát triển hệ thống trong tương lai.

Kết quả và đóng góp

Đồ án ghi nhận các kết quả cụ thể đã xây dựng và vận hành thành công:

  • Thiết kế hoàn chỉnh lược đồ cơ sở dữ liệu quan hệ gồm 7 bảng dữ liệu (BaiViet, CtDonHang, DonHang, KhachHang, LoaiSP, SanPham, TaiKhoan) đáp ứng đầy đủ các quan hệ lưu trữ giữa đơn hàng, khách hàng, sản phẩm và tin tức.
  • Xây dựng thành công cơ chế sinh khóa chính tự động theo định dạng thời gian (Năm-Tháng-Ngày-Giờ-Phút) cho các trường khóa MaBV, SoHoaDon, MaKH, MaLoai và MaSP.
  • Hiện thực hóa quy trình kiểm duyệt nội dung hai lớp tại trang quản trị: bài viết và sản phẩm khi mới đăng tải mặc định ở trạng thái cấm hiển thị, chỉ khi người quản lý duyệt lệnh thì hệ thống mới cập nhật trường DaDuyet lên cơ sở dữ liệu và hiển thị ra bên ngoài.
  • Xây dựng chức năng bán hàng trực tuyến với quy trình giỏ hàng tự động tính toán chi phí, biểu mẫu thanh toán tự động phân tách và lưu dữ liệu đồng thời vào ba bảng KhachHang, DonHang, CtDonHang kèm xác nhận thời gian giao hàng mặc định 2 ngày.
  • Đưa website thử nghiệm hoạt động thực tế trên máy chủ Internet tại địa chỉ http://doanduc-001-site1.com/.
  • Về mặt học thuật và thực tiễn cá nhân, tác giả đúc kết quy trình 4 bước hoàn thiện một đồ án ứng dụng web từ khâu ý tưởng, tích hợp template, lập trình xử lý cho đến việc làm chủ kiến trúc ASP.NET MVC.

Hạn chế và hướng nghiên cứu tiếp

Dựa trên nội dung tự đánh giá trong văn bản, đồ án tồn tại các hạn chế cụ thể sau:

  • Giao diện của website chưa thực sự hoàn thiện đồng bộ, một số thành phần hiển thị còn phụ thuộc vào mẫu có sẵn.
  • Một số chức năng nghiệp vụ và các trang thành phần nhỏ chưa được triển khai hoàn chỉnh.
  • Hệ thống hoàn toàn chưa được thiết lập các cơ chế bảo mật cho website và dữ liệu người dùng.

Tác giả đề xuất hướng phát triển tiếp theo nếu có cơ hội tiếp tục nghiên cứu:

  • Mở rộng quy mô hoạt động của website để đáp ứng khả năng quản lý chặt chẽ và chuyên nghiệp hơn.
  • Hoàn thiện toàn bộ các chức năng nghiệp vụ còn dang dở và tối ưu hóa hệ thống các trang phụ.
  • Tích hợp các giải pháp bảo mật nâng cao nhằm đảm bảo tính an toàn dữ liệu cho người sử dụng và hệ thống quản trị.

Giá trị tham khảo

Báo cáo đồ án là tài liệu tham khảo thực hành phù hợp cho sinh viên các ngành Công nghệ thông tin, Khoa học dữ liệu hoặc Kỹ thuật phần mềm đang theo học học phần Lập trình Web hoặc bắt đầu tìm hiểu về Microsoft ASP.NET MVC 5.

Các nội dung có giá trị tham khảo ứng dụng bao gồm:

  • Thiết kế cấu trúc cơ sở dữ liệu bán hàng chuẩn cho một website thương mại điện tử quy mô vừa và nhỏ gồm 7 bảng với các mối quan hệ chặt chẽ.
  • Kỹ thuật hiện thực hóa mô hình phân tách trạng thái kiểm duyệt nội dung (bài viết/sản phẩm đã duyệt và cấm hiển thị) trên trang quản trị Controller.
  • Cách thức cấu hình và tích hợp template HTML/CSS vào cấu trúc thư mục chuẩn (App_Data, Content, Scripts) của ASP.NET MVC kết hợp Entity Framework.

Câu hỏi thường gặp

1. Khóa chính của các bảng trong cơ sở dữ liệu được sinh ra theo quy tắc nào?
Trong các bảng BaiViet, DonHang, KhachHang, LoaiSP và SanPham, khóa chính được hệ thống thiết lập tự động sinh ra dựa trên chuỗi thời gian tại thời điểm tạo dữ liệu theo cấu trúc: (Năm-Tháng-Ngày-Giờ-Phút).

2. Quy trình kiểm duyệt bài viết và sản phẩm mới trên website diễn ra như thế nào?
Khi người quản trị đăng bài viết hoặc sản phẩm mới, hệ thống tự động gán tên tài khoản của người đăng và chuyển dữ liệu vào mục "Cấm hiển thị". Bài đăng chỉ được lưu chính thức vào cơ sở dữ liệu và hiển thị ra giao diện người dùng sau khi người quản lý truy cập danh sách cấm hiển thị để thực hiện thao tác kiểm duyệt.

3. Khi người dùng hoàn tất biểu mẫu thanh toán (CheckOut), hệ thống lưu dữ liệu vào những bảng nào?
Sau khi người dùng nhập đầy đủ thông tin cá nhân (họ tên, giới tính, ngày sinh, địa chỉ, số điện thoại, email, ghi chú) và xác nhận thanh toán, hệ thống sẽ thực hiện truy vấn để ghi nhận dữ liệu đồng thời vào ba bảng: KhachHang (lưu thông tin người mua), DonHang (lưu mã hóa đơn, ngày giao và địa chỉ) và CtDonHang (lưu mã sản phẩm, số lượng, giá bán và giảm giá).

4. Vì sao tác giả phân tích không nên lạm dụng ViewBag và ViewData trong các ứng dụng ASP.NET MVC chuyên nghiệp?
Cả khóa của ViewData và thuộc tính động của ViewBag đều chỉ được phân giải tại thời gian chạy (runtime), không cung cấp cơ chế kiểm tra lỗi trong quá trình biên dịch (compile-time) và không có sự hỗ trợ nhận diện mã lệnh (IntelliSense). Do đó, nếu lập trình viên viết sai chính tả tên khóa hoặc tên thuộc tính, lỗi chỉ phát sinh khi ứng dụng đang vận hành thực tế.

5. Thời gian giao hàng dự kiến được hệ thống quy định mặc định là bao lâu sau khi đặt hàng thành công?
Theo thông báo xác nhận đơn hàng sau khi lưu cơ sở dữ liệu thành công và quy định tại thuộc tính NgayGiaoHang của bảng DonHang, thời gian giao hàng được hệ thống ấn định là 2 ngày kể từ ngày khách hàng đặt hàng.

Kết luận

Đồ án "Xây dựng website bán hàng online" của sinh viên Chu Doãn Đức đã hoàn thành việc nghiên cứu cơ sở lý thuyết về mẫu thiết kế MVC, khung làm việc ASP.NET MVC cùng các công nghệ bổ trợ Entity Framework và LINQ. Hệ thống đã triển khai thực tế website thương mại điện tử chuyên ngành linh kiện và phụ tùng xe hơi với cơ sở dữ liệu quan hệ gồm 7 bảng, đáp ứng các chức năng xem hàng, quản lý giỏ hàng, thanh toán và phân hệ quản trị duyệt bài hai lớp. Mặc dù vẫn còn những mặt hạn chế về giao diện, tính hoàn thiện của một số trang chức năng và vấn đề bảo mật, đồ án đã phản ánh đầy đủ quy trình xây dựng ứng dụng web cơ bản theo chuẩn công nghệ của Microsoft.