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

Trong bối cảnh khoa học và công nghệ phát triển, sự phổ biến của các thiết bị điện tử và ứng dụng trực tuyến đã thúc đẩy sự hình thành và phát triển của ngành Công nghệ Thông tin. Mạng Internet và các nền tảng mạng lưới đóng vai trò nền tảng trong sự phát triển kinh tế - xã hội, trực tiếp hỗ trợ nâng cao chất lượng cuộc sống và tối ưu hóa các hoạt động thương mại. Xuất phát từ nhu cầu thực tiễn về ứng dụng thương mại điện tử cũng như định hướng nghề nghiệp của sinh viên chuyên ngành, đề tài "Xây dựng và quản lý trang web Teahouse" được thực hiện trong khuôn khổ đồ án môn học Công nghệ phần mềm tại Khoa Công nghệ, Trường Đại học Kinh tế Công nghiệp Long An.

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

  1. Tìm hiểu tổng quan về ngành công nghệ phần mềm, phân loại các vị trí công việc chuyên môn và ứng dụng hệ thống ngôn ngữ mô hình hóa thống nhất (UML) trong phân tích thiết kế hệ thống.
  2. Nghiên cứu và ứng dụng công cụ Trello trong việc lập kế hoạch, tổ chức và quản lý tiến độ dự án theo phương pháp trực quan.
  3. Nghiên cứu hệ thống quản lý phiên bản Git, nền tảng lưu trữ mã nguồn GitHub và quy trình tích hợp quản lý mã nguồn trực tiếp trong môi trường phát triển tích hợp Visual Studio.
  4. Tìm hiểu các phương pháp và công cụ kiểm thử phần mềm bao gồm kiểm thử đơn vị (Unit Test với xUnit), kiểm thử tự động giao diện (Selenium IDE), kiểm thử hiệu năng (Web Performance Testing với JMeter) và xây dựng bảng trường hợp kiểm thử (Test Case).
  5. Thiết kế cơ sở dữ liệu quan hệ và xây dựng giao diện hoàn chỉnh cho trang web thương mại điện tử Teahouse.

Đố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ế, quản lý mã nguồn, kiểm thử và xây dựng hệ thống website thương mại điện tử Teahouse.
  • Phạm vi không gian: Khoa Công nghệ – Trường Đại học Kinh tế Công nghiệp Long An.
  • Phạm vi thời gian: Đồ án được hoàn thành và báo cáo vào tháng 7 năm 2024 dưới sự hướng dẫn của ThS. Nguyễn Hữu Tâm.

Dự án được thực hiện bởi nhóm 5 sinh viên với bảng phân công công việc cụ thể như sau:

Thành viên thực hiện Mã số sinh viên Nhiệm vụ đảm nhiệm trong dự án
Huỳnh Thị Hồng Diễm 2252010024 Thiết kế các sơ đồ UML (Chương 1), soạn thảo văn bản Word
Ngô Trọng Phúc 2252010013 Tìm hiểu phần mềm Trello (Chương 2), thiết kế slide thuyết trình
Nguyễn Ngọc Hiếu 2252010031 Tìm hiểu phần mềm GitHub (Chương 3), thiết kế slide thuyết trình
Nguyễn Minh Triệu 2252010005 Tìm hiểu Unit Test (Chương 5), thiết kế sơ đồ ERD, thiết kế slide
Lương Vũ 2252010034 Tìm hiểu Test Case (Chương 6), tìm hiểu GitHub trên Visual Studio (Chương 4)

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

Báo cáo đồ án xây dựng nội dung dựa trên khung lý thuyết chuẩn của kỹ nghệ phần mềm và các công cụ phát triển ứng dụng hiện đại:

  • Khái niệm và vị trí nghề nghiệp trong Công nghệ phần mềm: Hệ thống hóa vai trò của chuyên ngành công nghệ phần mềm và trách nhiệm chuyên môn của các vị trí: Lập trình viên (Developer - Frontend, Backend, Data Engineering với các ngôn ngữ như Swift, Kotlin, Java), Phân tích nghiệp vụ (Business Analysis - BA), Thiết kế trải nghiệm người dùng (UX Designer), Thiết kế phần mềm (Software Designer/Tech Lead/CTO), Quản lý dự án (Project Manager), Quản trị hệ thống (System Administrator), Kiểm thử và quản lý chất lượng (Tester/QA/QC), Kỹ sư dữ liệu (Data Engineer, Data Analyst, Data Scientist) và Quản lý sản phẩm (Product Manager).
  • Hệ thống sơ đồ mô hình hóa UML (Unified Modeling Language):
    • Sơ đồ Use Case: Phân loại thành 6 nhóm gồm Use Case chính (Primary), Use Case hỗ trợ (Supporting), Use Case mở rộng (Extension), Use Case thay thế (Alternative), Use Case hệ thống (System) và Use Case người dùng (User).
    • Sơ đồ hoạt động (Activity Diagram - AD): Bao gồm 10 thành phần chuẩn: Activity, Initial Node, Final Node, Decision Node, Merge Node, Fork Node, Join Node, Control Flow, Object Flow và Swimlanes.
    • Sơ đồ tuần tự (Sequence Diagram - SD): Gồm Actors, Objects, Lifelines, Messages (Synchronous, Asynchronous, Return), Activation Bars và Combined Fragments (alt, opt, loop, par).
    • Sơ đồ lớp (Class Diagram - CD): Mô tả Classes (Tên lớp, Thuộc tính, Phương thức), Các mối quan hệ (Association, Inheritance, Dependency) và Phạm vi truy cập (Public +, Private -, Protected #).
  • Phương pháp quản lý và phối hợp kỹ thuật:
    • Quản lý công việc: Mô hình bảng Kanban thông qua phần mềm Trello (Boards, Lists, Cards, Teams).
    • Quản lý phiên bản phân tán: Nền tảng GitHub (Repository, Pull Request, Issues, GitHub Actions, GitHub Pages, Dependabot) và môi trường phát triển Microsoft Visual Studio 2017.
    • Phương pháp kiểm thử phần mềm: Kiểm thử đơn vị (Unit Test) sử dụng framework xUnit và thư viện Moq; kiểm thử chức năng tự động với Selenium IDE; kiểm thử hiệu năng hệ thống bằng công cụ Apache JMeter; phương pháp thiết kế tài liệu Test Case tiêu chuẩn.
  • Nguồn dữ liệu và tài liệu: Hệ thống văn bản hướng dẫn môn học, tài liệu kỹ thuật về kiến trúc MVC, Entity Framework Core và các tiêu chuẩn kiểm thử phần mềm.

Thiết kế và triển khai

Hệ thống trang web Teahouse được thiết kế và triển khai theo quy trình công nghệ phần mềm hoàn chỉnh, từ mô hình hóa luồng xử lý, thiết kế dữ liệu, kiểm soát mã nguồn đến kiểm thử chức năng:

1. Phân tích và thiết kế kiến trúc chức năng

Nhóm tác giả tập trung mô hình hóa chi tiết cho phân hệ xác thực người dùng (chức năng Đăng nhập) qua các sơ đồ UML:

  • Activity Diagram: Xác định luồng dữ liệu từ khi người dùng nhập thông tin tài khoản, hệ thống kiểm tra điều kiện hợp lệ qua Decision Node và điều hướng kết quả tương ứng.
  • Sequence Diagram: Biểu diễn trình tự tương tác thời gian giữa Actor (người dùng), giao diện giao tiếp, bộ điều khiển logic và cơ sở dữ liệu qua các thông điệp đồng bộ (Synchronous) và thông điệp trả về (Return).
  • Class Diagram: Định nghĩa cấu trúc lớp xử lý đăng nhập với các thuộc tính dữ liệu và phương thức kiểm tra quyền hạn.

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

Cơ sở dữ liệu của trang web Teahouse được tổ chức thành 7 bảng dữ liệu quan hệ chính phục vụ hoạt động quản lý và bán hàng:

Tên bảng dữ liệu Chức năng nghiệp vụ trong hệ thống Teahouse
Article Lưu trữ thông tin, nội dung các bài viết và tin tức trên trang web
Authorized Quản lý việc cấp quyền và phân quyền truy cập chức năng cho người dùng
Category Phân loại danh mục các sản phẩm trà và đồ uống
Group Phân nhóm tài khoản người dùng trong hệ thống
Member Lưu trữ thông tin chi tiết của khách hàng và thành viên
Product Quản lý danh mục sản phẩm trà, giá cả, hình ảnh và mô tả chi tiết
Role Định nghĩa các vai trò quản trị và phân cấp người dùng trong hệ thống

3. Quy trình tích hợp mã nguồn Visual Studio và GitHub

Quy trình thiết lập và quản lý phiên bản mã nguồn dự án được thực hiện trên Visual Studio 2017 theo các bước:

  1. Mở dự án trên Visual Studio 2017, chọn lệnh File > Add to Source Control.
  2. Mở cửa sổ Team Explorer, chọn Sync, tại mục Push to Remote Repository chọn Publish Git Repository.
  3. Khởi tạo một kho lưu trữ rỗng (Repository) mang tên WebShop trên tài khoản GitHub (không tạo sẵn tệp README).
  4. Sao chép URL của kho lưu trữ từ GitHub, dán vào mục Push to Remote Repository trong Team Explorer và nhấn Publish.
  5. Tạo và chuyển đổi nhánh làm việc: Khởi tạo nhánh first_branch từ nhánh master, thực hiện chỉnh sửa mã nguồn tại tệp Default.aspx, thực hiện Push tại mục Outgoing Commits để đồng bộ nhánh lên máy chủ GitHub.

4. Triển khai kiểm thử phần mềm

  • Kiểm thử đơn vị (Unit Test):
    • Bổ sung dự án xUnit Test Project vào Solution chung của hệ thống.
    • Sử dụng tính năng Add Project Reference để dẫn chiếu tới dự án lõi webcore (chương trình chính).
    • Cài đặt và sử dụng các không gian tên: Microsoft.Mvc, Microsoft.EntityFrameworkCore, Moq, System, webcore.EF, Xunit.
    • Xây dựng lớp kiểm thử UnitTest1 trong namespace Test1 với phương thức kiểm thử TestHomePage() gắn thuộc tính [Fact] nhằm kiểm tra tính đúng đắn của việc khởi tạo và trả về giao diện trang chủ từ HomeController.
  • Kiểm thử tự động và hiệu năng: Sử dụng Selenium IDE ghi lại kịch bản kiểm thử giao diện; sử dụng JMeter thiết lập kịch bản kiểm thử hiệu năng và độ trễ của trang web.
  • Xây dựng bảng Test Case: Soạn thảo cấu trúc bảng trường hợp kiểm thử chi tiết, điển hình là kịch bản kiểm thử đăng nhập (Test Case Login).

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

Chương 1 : Tổng quan

Chương 1 trình bày khái niệm nền tảng về ngành công nghệ phần mềm và khảo sát chi tiết 9 vị trí công việc sau khi tốt nghiệp. Phần thứ hai của chương tập trung vào lý thuyết và phương pháp vẽ 4 loại sơ đồ UML chính:

  • Use Case Diagram: Khái niệm ca sử dụng và phân loại 6 dạng use case trong hệ thống.
  • Activity Diagram (AD): Phân tích quy trình làm việc, nêu rõ định nghĩa và vai trò của 10 thành phần hình học trong sơ đồ; áp dụng vẽ sơ đồ AD cho chức năng đăng nhập của trang web.
  • Sequence Diagram (SD): Trình bày các thành phần biểu diễn tương tác thời gian giữa các đối tượng; áp dụng vẽ sơ đồ SD cho chức năng đăng nhập.
  • Class Diagram (CD): Mô tả cấu trúc các lớp, thuộc tính, phương thức, các kiểu quan hệ và 3 mức độ truy cập (+, -, #); áp dụng vẽ sơ đồ CD cho chức năng đăng nhập.

Chương 2 : Phần mềm Trello

Chương 2 phân tích nền tảng quản lý dự án trực tuyến Trello dựa trên phương pháp xem dạng Kanban:

  • Đánh giá đặc điểm: Nêu rõ 3 ưu điểm (dễ sử dụng, theo dõi trực quan, linh hoạt) và 5 nhược điểm lớn trong môi trường doanh nghiệp (hạn chế với dự án lớn, không phân cấp thành viên quản trị, thiếu tính năng nâng cao, yêu cầu cập nhật thủ công, môi trường giao tiếp còn hạn chế khi gửi bình luận).
  • Hướng dẫn thao tác thực tế: Quy trình đăng nhập (hỗ trợ liên kết tài khoản Google, Microsoft, Apple, Slack hoặc email); quy trình 4 bước tạo Bảng (Board); phương pháp tạo Danh sách (Lists - ví dụ: To Do, In Progress, Done); cách quản lý Thẻ công việc (Cards); quản trị Nhóm làm việc (Teams) và 3 bước mời thành viên tham gia cộng tác.

Chương 3 : Phần mềm GitHub

Chương 3 giới thiệu về nền tảng dịch vụ lưu trữ mã nguồn GitHub (được thành lập năm 2008 bởi Tom Preston-Werner, Chris Wanstrath, và PJ Hyett):

  • Trình bày 6 nhóm chức năng cốt lõi: Kho lưu trữ (Repository), Yêu cầu kéo (Pull Request), Quản lý vấn đề (Issues), Tự động hóa quy trình với GitHub Actions, Lưu trữ trang tĩnh GitHub Pages, Các công cụ bảo mật và quyền riêng tư (kho lưu trữ riêng tư, Dependabot).
  • Phân tích 7 nhóm lợi ích của GitHub đối với lập trình viên: Quản lý mã nguồn hiệu quả, hỗ trợ làm việc nhóm tránh xung đột code, quản lý dự án qua milestone, tự động hóa phát triển, kiểm soát bảo mật, đóng góp vào cộng đồng mã nguồn mở và nâng cao kỹ năng lập trình.

Chương 4 : GitHub trong Visual Studio

Chương 4 hướng dẫn chi tiết quy trình kết nối và đồng bộ mã nguồn giữa công cụ Visual Studio 2017 và kho lưu trữ đám mây GitHub:

  • Quy trình kết nối: Các bước thêm dự án vào hệ thống kiểm soát mã nguồn thông qua cửa sổ Team Explorer, tạo một Repository rỗng mang tên WebShop trên GitHub, xử lý URL và xuất bản (Publish) dự án.
  • Xử lý kỹ thuật: Hướng dẫn mở Command Prompt từ mục Manage Connections trong Team Explorer để giải quyết lỗi đồng bộ khi kho lưu trữ từ xa đã lỡ khởi tạo tệp README.
  • Quản lý phân nhánh: Cách khởi tạo nhánh mới first_branch, thực hiện các thay đổi mã nguồn trên tệp Default.aspx, thực hiện Push từ Outgoing Commits và kiểm tra hai nhánh song song trên giao diện web của GitHub.

Chương 5 : Unitest

Chương 5 đi sâu vào các kỹ thuật kiểm thử phần mềm đa tầng:

  • Khái niệm và vai trò của Unit Test: Định nghĩa đơn vị kiểm thử (hàm, thủ tục, lớp, phương thức), làm rõ các lợi ích của kiểm thử đơn vị trong phát hiện lỗi sớm, tiết kiệm chi phí dự án, hỗ trợ quy trình Agile và giải phóng áp lực cho đội ngũ QA.
  • Ví dụ triển khai Unit Test: Cấu hình xUnit trong Visual Studio, tham chiếu đến dự án webcore, xây dựng đoạn mã kiểm thử TestHomePage cho HomeController sử dụng các thư viện hỗ trợ Moq và Entity Framework Core.
  • Kiểm thử giao diện và hiệu năng: Giới thiệu khái niệm Selenium, công cụ Selenium IDE để kiểm tra luồng hoạt động giao diện website; giới thiệu khái niệm Performance Testing và hướng dẫn ứng dụng công cụ Apache JMeter để đo kiểm hiệu năng tải của trang web.

Chương 6 : Test Case

Chương 6 hệ thống hóa lý thuyết về tài liệu trường hợp kiểm thử (Test Case) trong quy trình bảo đảm chất lượng phần mềm:

  • Cấu trúc tiêu chuẩn của một Test Case trong dự án phần mềm.
  • Xây dựng bảng kịch bản Test Case cụ thể cho hệ thống Teahouse, trọng tâm là bảng kiểm thử chức năng Đăng nhập (Test Case Login) với các điều kiện đầu vào và kết quả kỳ vọng.

Chương 7 : Xây dựng trang Web

Chương 7 trình bày kết quả hiện thực hóa sản phẩm website bán hàng Teahouse:

  • Thiết kế cơ sở dữ liệu: Trình bày chi tiết cấu trúc dữ liệu của 7 bảng thực thể (Article, Authorized, Category, Group, Member, Product, Role).
  • Thiết kế giao diện: Xây dựng và hoàn thiện giao diện Trang chủ của website Teahouse phục vụ hiển thị sản phẩm trà, danh mục và các bài viết tin tức.

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

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

  • Nêu rõ các mặt hạn chế, thiếu sót kỹ thuật còn tồn tại trong quá trình nhóm sinh viên nghiên cứu và triển khai lần đầu.
  • Đề ra hướng phát triển trong tương lai nhằm nâng cấp tính năng hệ thống, mở rộng cơ sở dữ liệu và hoàn thiện các quy trình kiểm thử nâng cao.

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

Báo cáo đồ án đã đạt được các kết quả kỹ thuật và đóng góp cụ thể:

  • Xây dựng hoàn chỉnh tài liệu phân tích thiết kế: Hệ thống hóa các sơ đồ UML gồm Use Case Diagram, Activity Diagram, Sequence Diagram và Class Diagram cho quy trình đăng nhập của hệ thống Teahouse.
  • Ứng dụng thành công quy trình quản lý dự án và mã nguồn: Ứng dụng bảng Kanban trên Trello để phân chia nhiệm vụ cho 5 thành viên; hoàn thiện quy trình kết nối, đẩy mã nguồn và phân nhánh (master, first_branch) từ Visual Studio 2017 lên GitHub với dự án WebShop.
  • Hiện thực hóa cơ sở dữ liệu và mã nguồn website: Xây dựng cấu trúc dữ liệu 7 bảng quan hệ (Article, Authorized, Category, Group, Member, Product, Role) và hoàn thiện giao diện trang chủ của website thương mại điện tử Teahouse.
  • Xây dựng khung kiểm thử đa công cụ: Thiết lập thành công dự án kiểm thử đơn vị xUnit tích hợp thư viện Moq kiểm thử HomeController trong webcore; xây dựng kịch bản kiểm thử giao diện bằng Selenium IDE, kiểm thử hiệu năng với JMeter và bảng tài liệu Test Case đăng nhập.

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

  • Hạn chế được đề cập trong văn bản:
    • Vì là lần đầu nhóm sinh viên thực hiện đồ án môn học Công nghệ phần mềm nên việc triển khai còn gặp nhiều khó khăn, thiếu sót về mặt kinh nghiệm thực tiễn.
    • Công cụ quản lý Trello bộc lộ các hạn chế cố hữu như thiếu tính năng phân cấp quyền quản trị cho các cấp doanh nghiệp, yêu cầu cập nhật tiến độ thủ công và giao diện bình luận chưa tối ưu.
    • Quy trình kiểm thử mới dừng lại ở việc thiết lập khung mẫu (kiểm thử hàm hiển thị trang chủ và kịch bản đăng nhập), chưa bao phủ toàn diện mọi luồng nghiệp vụ phức tạp của toàn bộ trang web.
  • Hướng phát triển tiếp theo:
    • Tiếp tục phát triển và hoàn thiện các chức năng giao dịch thương mại điện tử chuyên sâu cho website Teahouse (giỏ hàng, thanh toán, quản lý đơn hàng).
    • Mở rộng hệ thống Test Case, tăng độ bao phủ mã nguồn cho Unit Test và thực hiện các bài kiểm tra tải trọng lớn bằng JMeter trước khi đưa vào môi trường thực tế.

Giá trị tham khảo

Báo cáo đồ án là tài liệu tham khảo phù hợp cho:

  • Sinh viên chuyên ngành Công nghệ thông tin và Kỹ thuật phần mềm đang chuẩn bị thực hiện đồ án môn học hoặc báo cáo thực tập về phát triển ứng dụng web.
  • Những người học cần tài liệu hướng dẫn thực hành từng bước về việc tích hợp Git/GitHub vào môi trường Visual Studio 2017 và xử lý các lỗi phát sinh trong quá trình đồng bộ mã nguồn.
  • Tài liệu tham khảo hữu ích về phương pháp thiết lập dự án kiểm thử xUnit cho ứng dụng web (tích hợp Moq và Entity Framework Core) cùng các bước cơ bản để áp dụng Selenium IDE và JMeter vào kiểm thử phần mềm.

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

1. Đồ án Teahouse sử dụng những công cụ và nền tảng phần mềm nào để hỗ trợ quá trình quản lý và phát triển?
Dự án sử dụng Trello để quản lý tiến độ công việc theo bảng Kanban; GitHub và Git tích hợp trên Visual Studio 2017 để quản lý phiên bản mã nguồn; xUnit và Moq để thực hiện kiểm thử đơn vị; Selenium IDE để kiểm thử giao diện tự động; và Apache JMeter để kiểm thử hiệu năng web.

2. Cơ sở dữ liệu của trang web Teahouse bao gồm những bảng dữ liệu nào?
Cơ sở dữ liệu của dự án được thiết kế gồm 7 bảng thực thể chính: Article (bài viết), Authorized (phân quyền), Category (danh mục), Group (nhóm người dùng), Member (thành viên/khách hàng), Product (sản phẩm) và Role (vai trò quản trị).

3. Mã nguồn Unit Test trong Chương 5 được viết để kiểm tra chức năng nào và sử dụng những thư viện gì?
Đoạn mã Unit Test trong đồ án được viết trong phương thức TestHomePage() nhằm kiểm tra tính đúng đắn khi khởi tạo HomeController và hiển thị trang chủ của dự án webcore. Đoạn mã sử dụng các thư viện: Microsoft.Mvc, Microsoft.EntityFrameworkCore, Moq, System, webcore.EF và Xunit.

4. Tệp mã nguồn nào đã được nhóm tác giả thao tác chỉnh sửa khi thực hành phân nhánh trên Visual Studio 2017?
Trong Chương 4, sau khi tạo nhánh mới có tên first_branch từ nhánh master, nhóm tác giả đã thực hiện chỉnh sửa nội dung trên tệp Default.aspx trước khi thực hiện commit và push lên kho lưu trữ GitHub.

5. Nhóm tác giả đã chỉ ra những nhược điểm nào của phần mềm Trello khi áp dụng trong quản lý dự án?
Nhóm tác giả chỉ ra 5 nhược điểm của Trello: hạn chế đối với các dự án lớn có quy mô phức tạp; không phân cấp quyền quản trị chặt chẽ cho từng cấp bậc thành viên; thiếu các tính năng báo cáo tiến độ chi tiết và lập kế hoạch nâng cao; đòi hỏi người dùng phải cập nhật thủ công; và môi trường giao tiếp còn hạn chế khi chưa hỗ trợ gửi bình luận bằng phím Enter.

Kết luận

Báo cáo đồ án môn học "Xây dựng và quản lý trang web Teahouse" của nhóm sinh viên Trường Đại học Kinh tế Công nghiệp Long An đã trình bày tổng thể các giai đoạn trong chu trình công nghệ phần mềm từ phân tích mô hình UML, quản trị tiến độ đến xây dựng sản phẩm. Đồ án đã hiện thực hóa được hệ thống website thương mại điện tử Teahouse với cấu trúc cơ sở dữ liệu 7 bảng, giao diện trang chủ và quy trình đồng bộ mã nguồn qua Git/GitHub trên Visual Studio 2017. Đồng thời, báo cáo đã thiết lập thành công quy trình kiểm thử đa diện kết hợp giữa xUnit, Selenium IDE, JMeter và hệ thống Test Case, tạo nền tảng kỹ thuật vững chắc cho việc phát triển các ứng dụng phần mềm tiếp theo.