Bối cảnh và vấn đề nghiên cứu
Trong bối cảnh công nghệ thông tin ngày càng khẳng định vị trí then chốt và được ứng dụng sâu rộng vào công tác quản lý, lưu trữ, xử lý thông tin cũng như mọi mặt của đời sống kinh tế – xã hội, việc chuyển đổi các mô hình thương mại truyền thống sang nền tảng số là xu thế tất yếu. Cùng với sự phát triển của đời sống, nhu cầu tiêu thụ và cung ứng thực phẩm hàng ngày của người dân không ngừng tăng cao, đòi hỏi các giải pháp mua sắm nhanh gọn, tiện lợi và tiết kiệm thời gian thông qua mạng Internet.
Nhằm giải quyết bài toán thực tiễn này, đồ án môn học chuyên ngành Công nghệ phần mềm tại Trường Đại học Công nghệ TP.HCM (HUTECH) đã lựa chọn đề tài xây dựng website bán thực phẩm mang tên "ShoppingFood" dựa trên mô hình ASP.NET Core MVC. Hệ thống được thiết kế nhằm trực tiếp tạo ra đơn hàng, hỗ trợ người tiêu dùng mua sắm trực tuyến thuận tiện và hỗ trợ đơn vị kinh doanh quản lý bán hàng hiệu quả.
Về mục tiêu và nhiệm vụ nghiên cứu, đề tài xác định 5 nhiệm vụ cụ thể:
- Nghiên cứu tổng quan cơ sở lý thuyết về các ngôn ngữ lập trình web cơ bản (HTML, CSS, JavaScript, C#) và công nghệ nền tảng ASP.NET Core.
- Khảo sát thực tế các mô hình website thương mại điện tử thực phẩm tiêu biểu trên thị trường (Bách hóa xanh, VinMart, GoodFood).
- Phân tích yêu cầu hệ thống, xác định luồng hoạt động và phân cấp chức năng chi tiết cho hai nhóm tác nhân: Người dùng (User/Customer) và Quản trị viên (Admin).
- Thiết kế hệ thống thông tin, bao gồm sơ đồ Use Case, sơ đồ Class, sơ đồ quan hệ thực thể (ERD) và xây dựng cấu trúc cơ sở dữ liệu quan hệ hoàn chỉnh gồm 15 bảng dữ liệu.
- Triển khai thực nghiệm giao diện website phía người dùng và giao diện quản trị, đáp ứng quy trình từ xem sản phẩm, quản lý giỏ hàng, đặt hàng đến xử lý đơn hàng và thống kê.
Về đối tượng và phạm vi nghiên cứu:
- Đối tượng nghiên cứu: Quy trình phân tích, thiết kế và xây dựng hệ thống website thương mại điện tử bán thực phẩm trực tuyến.
- Phạm vi không gian và học thuật: Đồ án môn Lập trình Web thuộc Khoa Công nghệ thông tin, Chuyên ngành Công nghệ phần mềm, Trường Đại học Công nghệ TP. Hồ Chí Minh (HUTECH).
- Phạm vi thời gian: Đồ án được hoàn thành và nghiệm thu vào tháng 07 năm 2022.
Cơ sở lý thuyết và công nghệ áp dụng
Đề tài vận dụng tổng hợp các kiến trúc và công nghệ phát triển ứng dụng web hiện đại, phân định rõ ràng giữa tầng giao diện người dùng (Front-end) và tầng xử lý nghiệp vụ, quản trị cơ sở dữ liệu (Back-end).
Ngôn ngữ lập trình Front-end
- HTML (Hypertext Markup Language): Ngôn ngữ đánh dấu siêu văn bản do W3C chuẩn hóa, đóng vai trò định hình khung cấu trúc của trang web thông qua các thẻ khối (block-level tags như
<div>, <p>, <h1>-<h6>) và thẻ nội dòng (inline tags như <a>, <img>).
- CSS (Cascading Style Sheets): Ngôn ngữ định kiểu giao diện do W3C phát triển từ năm 1996, giúp tách biệt phần định dạng thẩm mỹ (màu sắc, bố cục, phông chữ) khỏi cấu trúc HTML, giảm thiểu sự trùng lặp mã nguồn và tối ưu hóa quản lý giao diện.
- JavaScript: Ngôn ngữ kịch bản hướng đối tượng thực thi tại phía trình duyệt (client-side), đảm nhiệm việc can thiệp, biến đổi các đối tượng HTML/CSS trong mô hình DOM, xử lý sự kiện, kiểm tra tính hợp lệ của dữ liệu đầu vào (input validation) và cung cấp các thành phần giao diện nâng cao (Slider, Drag & Drop).
Ngôn ngữ lập trình và nền tảng Back-end
- C# (C Sharp): Ngôn ngữ lập trình hướng đối tượng do Microsoft phát triển từ năm 2000, kế thừa ưu điểm của C++ và Java đồng thời loại bỏ các cơ chế phức tạp như con trỏ hay đa kế thừa. Mã nguồn C# được biên dịch thành mã trung gian MSIL (Microsoft Intermediate Language) và thực thi thông qua môi trường Common Language Runtime (CLR).
- ASP.NET Core MVC: Khung ứng dụng mã nguồn mở, đa nền tảng (chạy trên Windows, macOS, Linux) do Microsoft phát triển. Nền tảng này tối ưu hóa mô hình kiến trúc MVC (Model - View - Controller), cung cấp công cụ Razor View Engine, Tag Helpers, Model Binding tự động ánh xạ tham số từ HTTP Request và cơ chế Model Validation tích hợp kiểm tra dữ liệu đồng thời ở cả client và server.
Bảng tổng hợp so sánh giữa ASP.NET truyền thống và ASP.NET Core được trình bày như sau:
| Tiêu chí so sánh |
ASP.NET truyền thống |
ASP.NET Core |
| Môi trường hệ điều hành |
Chỉ xây dựng dành cho hệ điều hành Windows |
Xây dựng và vận hành đa nền tảng (Windows, macOS, Linux) |
| Hiệu năng hệ thống |
Hiệu suất tiêu chuẩn |
Hiệu suất xử lý cao hơn |
| Nền tảng thực thi (.NET) |
Chạy trên .NET Framework (Full .NET) |
Chạy trên cả .NET Core và .NET Framework |
| Mô hình hỗ trợ |
Hỗ trợ Web Forms, ASP.NET MVC, Web API |
Tối ưu cho ASP.NET Core MVC, Web API; loại bỏ Web Forms |
| Phụ thuộc máy chủ web |
Phụ thuộc hoàn toàn vào IIS và System.Web |
Không phụ thuộc IIS; hỗ trợ Kestrel, Nginx, Apache, Docker |
| Ngôn ngữ phát triển |
C#, VB, WCF, WPF, WF |
C#, F#, VB; không hỗ trợ trực tiếp WCF, WPF, WF |
| Tệp cấu hình hệ thống |
Sử dụng Web.config và Global.asax |
Sử dụng tệp cấu hình chuẩn JSON (Appsettings.json) |
| Hỗ trợ Container hóa |
Hạn chế trong việc triển khai vùng chứa |
Hỗ trợ tối ưu cho triển khai Container (Docker) và Cloud |
| Cơ chế biên dịch khi sửa mã |
Yêu cầu biên dịch lại toàn bộ sau khi đổi mã |
Hỗ trợ tự động biên dịch và thực thi khi làm mới trình duyệt |
Thiết kế và triển khai hệ thống
Kiến trúc phân cấp người dùng
Hệ thống website ShoppingFood phân định hai cấp quyền truy cập chính:
- Tác vụ Quản trị viên (Admin): Đăng nhập xác thực, quản trị toàn bộ hệ thống, quản lý tài khoản người dùng, quản lý danh mục sản phẩm, quản lý thông tin sản phẩm (thêm, sửa, xóa, tìm kiếm, lọc), quản lý đơn đặt hàng (trạng thái, người nhận, hình thức thanh toán), quản lý khách hàng, quản lý giao diện, quản lý các trang tĩnh (Page), quản lý tin tức/bài viết, quản lý quyền truy cập và thống kê báo cáo doanh thu.
- Tác vụ Khách hàng (User): Đăng ký tài khoản mới, đăng nhập hệ thống, duyệt trang chủ, xem thông tin giới thiệu cửa hàng, xem danh mục và chi tiết sản phẩm, tìm kiếm sản phẩm theo tên, thêm sản phẩm vào giỏ hàng, cập nhật số lượng hoặc xóa sản phẩm trong giỏ hàng, đặt hàng trực tuyến, tra cứu thông tin liên hệ và đọc các bài viết hướng dẫn, tin tức dinh dưỡng, công thức nấu ăn.
Thiết kế cơ sở dữ liệu quan hệ
Cơ sở dữ liệu của hệ thống được chuẩn hóa gồm 15 bảng dữ liệu quan hệ:
| STT |
Tên bảng |
Tên trường khóa chính |
Các trường dữ liệu chính |
Chức năng lưu trữ |
| 1 |
Accounts |
AccountID (int) |
Phone, Email, Password, Salt, Active, Fullname, RoleID, LastLogin, CreateDate |
Quản lý tài khoản quản trị và nhân viên hệ thống |
| 2 |
Attribute |
AttributeID (int) |
Name |
Quản lý các thuộc tính mở rộng của sản phẩm |
| 3 |
AttributesPrice |
AttributesPriceID (int) |
AttributeID, ProductID, Price, Active |
Quản lý mức giá tương ứng theo từng thuộc tính sản phẩm |
| 4 |
Categories |
CatID (int) |
CatName, Description, ParentID, Levels, Ordering, Published, Thumb, Title, Alias, MetaDesc, MetaKey, Cover, SchemaMarkup |
Phân loại danh mục sản phẩm theo cấp bậc và hỗ trợ SEO |
| 5 |
Customers |
CustomerID (int) |
Fullname, Birthday, Avatar, Address, Email, Phone, LocationID, District, Ward, CreateDate, Password, Salt, LastLogin, Active |
Quản lý hồ sơ và thông tin định danh của khách hàng |
| 6 |
Locations |
LocationID (int) |
Name, Type, Slug, NameWithType, Parent, Levels |
Quản lý dữ liệu địa giới hành chính (tỉnh/thành, quận/huyện, phường/xã) |
| 7 |
OrderDetails |
OrderDetailID (int) |
OrderID, ProductID, OrderNumber, Discount, TotalMoney, CreateDate, Amount, Price |
Lưu vết chi tiết từng mặt hàng và số lượng trong đơn hàng |
| 8 |
Orders |
OrderID (int) |
CustomerID, OrderDate, ShipDate, TransactStatusID, Deleted, Paid, PaymentDate, PaymentID, Note, TotalMoney, Address, LocationID, District, Ward |
Quản lý thông tin tổng quan, trạng thái thanh toán và giao nhận của đơn hàng |
| 9 |
Pages |
PageID (int) |
PageName, Contents, Thumb, Published, Title, MetaDesc, MetaKey, Alias, CreatedDate, Ordering |
Quản lý nội dung các trang thông tin tĩnh trên website |
| 10 |
Products |
ProductID (int) |
ProductName, ShortDesc, Description, CatID, Price, Discount, Thumb, Video, DateCreated, DateModified, BestSellers, HomeFlag, Active, Tags, Title, Alias, MetaDesc, MetaKey, UnitslnStock |
Lưu trữ toàn bộ thuộc tính, mô tả, tồn kho và trạng thái của sản phẩm thực phẩm |
| 11 |
QuangCao |
QuangCaoID (int) |
SubTitle, Title, ImageBG, ImageProduct, UrlLink, Active, CreateDate |
Quản lý thông tin các banner và chương trình quảng cáo |
| 12 |
Roles |
RoleID (int) |
RoleName, Description |
Định nghĩa các nhóm quyền hạn truy cập trong hệ thống |
| 13 |
Shippers |
ShipperID (int) |
ShipperName, Phone, Company, ShipDate |
Quản lý thông tin đơn vị và nhân viên giao vận |
| 14 |
Posts |
PostID (int) |
Title, SContents, Contents, Thumb, Published, Alias, CreatedDate, Author, AccountID, Tags |
Quản lý bài viết tin tức, cẩm nang nấu ăn, khuyến mại |
| 15 |
TransactStatus |
TransactStatusID (int) |
Status, Description |
Định nghĩa các trạng thái giao dịch và vòng đời của đơn hàng |
Nội dung chính theo từng chương
Chương 1: Ngôn ngữ lập trình
Chương này phân tích cơ sở lý thuyết của 4 ngôn ngữ cốt lõi được áp dụng trong xây dựng trang web. Tác giả làm rõ khái niệm, cơ chế hoạt động dạng mô hình cây (DOM) của HTML, nguyên lý khai báo vùng chọn (Selector) và khối thuộc tính của CSS nhằm tối ưu hóa giao diện. Đồng thời, chương trình bày chi tiết về C# với mô hình thực thi mã nguồn qua MSIL và CLR trên nền .NET, cùng vai trò của JavaScript trong việc xử lý tương tác bất đồng bộ và kiểm tra dữ liệu phía máy khách.
Chương 2: Công nghệ liên quan
Chương 2 tập trung luận giải về ASP.NET Core – phiên bản cải tiến từ ASP.NET truyền thống. Tác giả phân tích các lợi ích kỹ thuật nổi bật như: xây dựng giao diện Web UI và Web API trên mô hình MVC, tính năng Razor View, Tag Helper hỗ trợ kết xuất HTML từ máy chủ, cơ chế Model Binding và Model Validation tự động. Điểm nhấn của chương là bảng đối sánh kỹ thuật chi tiết chỉ ra khả năng hoạt động đa nền tảng, tính độc lập với máy chủ IIS và khả năng tích hợp vùng chứa Docker của ASP.NET Core.
Chương 3: Khảo sát đề tài
Nội dung chương ghi nhận kết quả khảo sát thực tế từ 3 hệ thống bán lẻ thực phẩm đang hoạt động: Bách hóa xanh, VinMart và GoodFood. Từ việc đánh giá nhu cầu mua sắm thực phẩm online của người tiêu dùng, nhóm tác giả định hình các yêu cầu chức năng cho website ShoppingFood, bao gồm: trang chủ với banner chuyển động (slider), trang giới thiệu, trang danh mục sản phẩm, trang giỏ hàng với đầy đủ nghiệp vụ chỉnh sửa số lượng, trang tin tức và trang liên hệ.
Chương 4: Phân tích đề tài
Chương 4 thiết lập cấu trúc phân tích nghiệp vụ của hệ thống ShoppingFood. Nội dung mô tả chi tiết quy trình vận hành từ khi người dùng truy cập, tìm kiếm món hàng, thêm vào giỏ, nhập thông tin giao nhận đến khi Admin tiếp nhận, xử lý trạng thái giao dịch và lập hóa đơn. Tác giả phân chia hệ thống thành hai nhánh tác vụ độc lập: nhánh tác vụ của người dùng thông thường và nhánh tác vụ quản trị vận hành toàn diện.
Chương 5: Thiết kế Database
Chương 5 cung cấp thiết kế kỹ thuật chi tiết của hệ thống. Tác giả đặc tả cấu trúc bảng dữ liệu của 15 thực thể, nêu rõ tên trường, kiểu dữ liệu, kích thước và ràng buộc khóa chính. Ngoài ra, chương tổng hợp các mô hình hóa nghiệp vụ thông qua hệ thống sơ đồ Use Case tổng quát, Use Case quản lý tài khoản, Use Case quản lý sản phẩm, Use Case quản lý đơn đặt hàng, sơ đồ lớp (Class Diagram) và sơ đồ quan hệ thực thể (ERD).
Chương 6: Kết quả thực nghiệm
Chương 6 trình bày kết quả hiện thực hóa phần mềm thông qua các giao diện thực tế. Đối với phân hệ người dùng (User), hệ thống hiển thị hoàn chỉnh Trang chủ, Trang thông tin cửa hàng, Trang mua hàng, Trang chi tiết sản phẩm và Trang tin tức. Đối với phân hệ quản trị (Admin), hệ thống cung cấp các màn hình quản lý Danh mục, quản lý Khách hàng, quản lý Sản phẩm và quản lý Bài viết tin tức.
Chương 7: Kết luận và định hướng
Chương cuối tổng kết mức độ hoàn thành của đồ án dựa trên các mục tiêu ban đầu và đề xuất các phương hướng nâng cấp, hoàn thiện phần mềm trong tương lai.
Kết quả và đóng góp
Kết quả kỹ thuật đạt được
- Xây dựng hoàn chỉnh website thương mại điện tử "ShoppingFood" ứng dụng công nghệ ASP.NET Core MVC, đáp ứng các tiêu chuẩn về giao diện thân thiện và khả năng tương thích trên các trình duyệt web phổ biến.
- Thiết kế và chuẩn hóa thành công cơ sở dữ liệu quan hệ 15 bảng, đảm bảo tính toàn vẹn dữ liệu cho mọi quy trình từ quản lý sản phẩm, quản lý phân loại địa chỉ 3 cấp (tỉnh, huyện, xã) đến theo dõi trạng thái giao dịch đơn hàng.
- Hiện thực hóa đầy đủ các luồng chức năng nghiệp vụ bán lẻ thực phẩm: lọc sản phẩm nổi bật, sản phẩm bán chạy, tìm kiếm theo tên, quản lý giỏ hàng linh hoạt, tạo đơn đặt hàng và quản trị nội dung.
Đóng góp và phân công nhiệm vụ
Kết quả của đồ án được hoàn thành thông qua sự phối hợp và phân công trách nhiệm cụ thể giữa 4 thành viên trong nhóm nghiên cứu:
| STT |
Thành viên thực hiện |
MSSV & Lớp |
Nội dung công việc đảm nhiệm |
Tỷ lệ & Điểm tự đánh giá |
| 1 |
Lư Hùng Bảo |
1911060668
(19DTHA5) |
Thực hiện đăng nhập/đăng xuất; Triển khai (deploy) website; Viết báo cáo; Thiết kế và vẽ sơ đồ Use Case, Class Diagram, ERD. |
25%
(7.5 điểm) |
| 2 |
Đinh Quốc An Khang |
1911060808
(19DTHA4) |
Phân loại sản phẩm; Phân chia layout người dùng; Viết báo cáo; Mô tả, phân tích và khảo sát đề tài. |
20%
(7.0 điểm) |
| 3 |
Trần Xuân Thắng |
1911067480
(19DTHA5) |
Thực hiện phân trang; Tìm kiếm sản phẩm; Quản lý khách hàng; Hỗ trợ liên kết phần mềm; Nhập (import) dữ liệu; Viết báo cáo kết luận và định hướng. |
20%
(7.0 điểm) |
| 4 |
Lê Minh Quân |
1911060536
(19DTHA5) |
Thiết kế và xây dựng cơ sở dữ liệu; Phân chia layout Admin; Quản lý danh mục, sản phẩm, trang tĩnh (page); Xây dựng chức năng giỏ hàng, lọc sản phẩm; Tổng hợp báo cáo. |
35%
(8.0 điểm) |
Hạn chế và hướng nghiên cứu tiếp
Hạn chế của hệ thống
- Hệ thống được triển khai trong phạm vi đồ án môn học, các kiểm thử nghiệp vụ và hiệu năng chủ yếu thực hiện trong môi trường cục bộ, chưa có dữ liệu đo lường tải thực tế khi có lượng truy cập đồng thời lớn.
- Các hạn chế kỹ thuật cố hữu của JavaScript phía client (như nguy cơ bảo mật, sự không đồng nhất giữa các phiên bản trình duyệt cũ và thiếu cơ chế đa luồng) đòi hỏi phải có các giải pháp bảo vệ nâng cao hơn ở tầng máy chủ.
- Nhóm tác giả tự đánh giá quá trình thực hiện còn một số thiếu sót do kinh nghiệm thực tế và kiến thức chuyên sâu còn hạn chế.
Hướng nghiên cứu và phát triển tiếp
- Tích hợp thêm các cổng thanh toán trực tuyến phổ biến để đa dạng hóa phương thức thanh toán ngoài chuyển khoản và nhận hàng trả tiền (COD).
- Tối ưu hóa hiệu năng hệ thống trên các máy chủ đám mây, ứng dụng Docker container để triển khai đa nền tảng linh hoạt hơn.
- Nâng cấp mô đun thống kê, báo cáo doanh thu tự động theo tháng/năm và tối ưu hóa trải nghiệm người dùng trên các thiết bị di động.
Giá trị tham khảo
Tài liệu đồ án mang lại giá trị tham khảo thiết thực cho các nhóm đối tượng sau:
- Sinh viên ngành Công nghệ thông tin và Công nghệ phần mềm: Là tài liệu mẫu về quy trình thực hiện đồ án môn học Lập trình Web, từ bước khảo sát thực tế, phân tích nghiệp vụ, mô hình hóa sơ đồ (Use Case, Class, ERD) đến tổ chức mã nguồn theo mô hình ASP.NET Core MVC.
- Người nghiên cứu và phát triển website thương mại điện tử: Cung cấp bản thiết kế cơ sở dữ liệu chuẩn gồm 15 bảng quan hệ cho các hệ thống bán lẻ (đặc biệt là cách thiết kế phân cấp danh mục, bảng địa chỉ 3 cấp và chi tiết đơn hàng).
- Lập trình viên bắt đầu tiếp cận công nghệ .NET: Bảng so sánh giữa ASP.NET và ASP.NET Core là tài liệu tóm lược hữu ích về sự dịch chuyển công nghệ và ưu thế của kiến trúc phần mềm hiện đại.
Câu hỏi thường gặp
1. Đề tài website bán thực phẩm ShoppingFood sử dụng mô hình kiến trúc phần mềm nào?
Hệ thống được xây dựng trên mô hình kiến trúc ASP.NET Core MVC (Model - View - Controller), cho phép tách biệt rõ ràng giữa tầng dữ liệu, tầng giao diện Razor View và tầng điều hướng logic.
2. Cơ sở dữ liệu của website ShoppingFood được tổ chức gồm bao nhiêu bảng dữ liệu?
Cơ sở dữ liệu của hệ thống được thiết kế hoàn chỉnh với 15 bảng quan hệ, bao gồm: Accounts, Attribute, AttributesPrice, Categories, Customers, Locations, OrderDetails, Orders, Pages, Products, QuangCao, Roles, Shippers, Posts và TransactStatus.
3. Vì sao nhóm tác giả chọn ASP.NET Core thay vì ASP.NET truyền thống?
Dựa trên phân tích kỹ thuật của đồ án, ASP.NET Core có hiệu năng cao hơn, là mã nguồn mở, hoạt động đa nền tảng (Windows, macOS, Linux), không bị phụ thuộc vào máy chủ IIS/System.Web, sử dụng cấu hình JSON hiện đại và hỗ trợ tối ưu cho việc triển khai trên nền tảng đám mây và Docker.
4. Nhóm tác giả đã khảo sát những website thực tế nào trước khi thiết kế hệ thống?
Nhóm tác giả đã tiến hành khảo sát và tham khảo mô hình hoạt động của 3 website thương mại điện tử thực phẩm thực tế bao gồm Bách hóa xanh, VinMart và GoodFood.
5. Trong đồ án, quy trình đặt hàng của người dùng (User) diễn ra qua các bước nào?
Khách hàng tìm kiếm hoặc chọn sản phẩm theo danh mục -> xem thông tin chi tiết -> thêm vào giỏ hàng -> tùy chỉnh số lượng -> nhấn nút Mua/Đặt hàng -> điền thông tin cá nhân, địa chỉ giao hàng và chọn phương thức thanh toán -> xác nhận Đặt hàng để hệ thống lưu đơn và chuyển cho Admin xử lý.
Kết luận
Đồ án môn Lập trình Web với đề tài "Website bán thực phẩm" (ShoppingFood) do nhóm sinh viên Khoa Công nghệ thông tin – Trường Đại học Công nghệ TP.HCM thực hiện đã hoàn thành các mục tiêu đề ra về mặt lý thuyết lẫn thực nghiệm. Đề tài đã phân tích và ứng dụng thành công nền tảng ASP.NET Core MVC kết hợp cùng C#, HTML, CSS, JavaScript để thiết kế một hệ thống thương mại điện tử hoàn chỉnh với 15 bảng cơ sở dữ liệu và hai phân hệ người dùng - quản trị rõ ràng. Toàn bộ cấu trúc báo cáo phản ánh quy trình xây dựng phần mềm bài bản, cung cấp nguồn tư liệu học thuật và thiết kế kỹ thuật hữu ích cho sinh viên chuyên ngành Công nghệ phần mềm.
