• Thiết kế giao diện người dùng thân thiện và dễ sử dụng cho phần mềm quản lý dự án, giúp cho người dùng có thể sử dụng phần mềm một cách hiệu quả.. JSX được sử dụng để khai báo các phần
Tổng quan về Javascript
JavaScript là ngôn ngữ lập trình hướng đối tượng và thông dịch, rất phổ biến trong phát triển website, cho phép các trang web tương tác trực tiếp với người dùng.
JavaScript, ban đầu được giới thiệu với tên LiveScript, đã được Netscape đổi tên thành JavaScript, có thể do sự ảnh hưởng của sự phổ biến của ngôn ngữ Java vào thời điểm đó Ngôn ngữ này lần đầu tiên xuất hiện trên trình duyệt Netscape phiên bản 2.0.
LiveScript, với mục đích chung là có thể tích hợp trên Netscape, Internet Explorer và các trình duyệt web khác.
ECMA-262 đã đưa ra tiêu chuẩn cốt lõi cho các phiên bản của JavaScript như sau:
• JavaScript là ngôn ngữ thông dịch và nhẹ.
• JavaScript được thiết kế để tạo ra các ứng dụng mạng.
JavaScript phía khách hàng là một trong những ứng dụng phổ biến nhất của ngôn ngữ này Mã JavaScript được liên kết với các thẻ HTML và thực thi trên trình duyệt, cho phép các trang web tương tác trực tiếp với người dùng.
Cơ chế Client-Side mang lại nhiều lợi ích cho nhà phát triển, bao gồm khả năng kiểm tra dữ liệu đầu vào trước khi gửi yêu cầu đến server Hơn nữa, JavaScript có thể lắng nghe các sự kiện từ người dùng như nhấp chuột và điều hướng, từ đó thực thi các đoạn mã tương ứng.
NodeJS
Với sự phát triển mạnh mẽ của các website, các nhà phát triển ngày càng mong muốn sử dụng JavaScript ở phía server Tuy nhiên, việc mã JavaScript chỉ có thể thực thi trên trình duyệt đã gây ra nhiều bất cập, như khó khăn trong việc đọc và ghi file cũng như kết nối với các hệ quản trị cơ sở dữ liệu Sự ra đời của NodeJS đã mở ra một con đường mới cho JavaScript, giúp giải quyết những vấn đề này.
NodeJS là nền tảng server được phát triển từ JavaScript Engine của Google Chrome, hay còn gọi là V8 Engine Nó cho phép xây dựng các trang web một cách nhanh chóng và dễ dàng mở rộng nhờ vào kiến trúc hướng sự kiện và I/O không chặn.
NodeJS là một môi trường mã nguồn mở đa nền tảng, cho phép phát triển ứng dụng mạng phía server bằng JavaScript Nó có khả năng chạy trên nhiều hệ điều hành như OS X, Microsoft Windows và Linux Bên cạnh đó, NodeJS cung cấp nhiều thư viện JavaScript, giúp đơn giản hóa quá trình phát triển ứng dụng.
NodeJS = Runtime Enviroment + JavaScript Libary
React
React là một thư viện JavaScript giúp xây dựng giao diện người dùng hiệu quả Nó cho phép phát triển các thành phần có thể tái sử dụng, với dữ liệu của từng thành phần có thể thay đổi theo thời gian.
The Document Object Model (DOM) of HTML allows for quick and easy data updates React utilizes a Virtual DOM to manage data updates efficiently, comparing the Virtual DOM with the actual DOM to implement changes on the webpage.
JSX là cú pháp mở rộng của JavaScript, được sử dụng để khai báo các phần tử trong React JSX tương tự như HTML nhưng tích hợp đầy đủ các tính năng của JavaScript.
Component trong React là các thành phần tái sử dụng, đóng vai trò quan trọng trong việc duy trì và mở rộng dự án Mọi thứ trong React đều được xây dựng dựa trên Component, giúp tối ưu hóa quy trình phát triển.
• Luồng dữ liệu một chiều - React sử dụng dữ liệu một chiều giúp nhà phát triển có thể dễ dàng kiểm soát ứng dụng của mình.
Hệ quản trị CSDL PostgreSQL
PostgreSQL là hệ quản trị cơ sở dữ liệu mã nguồn mở, được phát triển bởi cộng đồng lập trình viên toàn cầu Hệ thống này không bị kiểm soát bởi bất kỳ tập đoàn nào và hoàn toàn miễn phí cho người dùng.
PostgreSQL có khả năng triển khai trên nhiều hệ điều hành phổ biến như Linux, Unix và Windows Hệ quản trị cơ sở dữ liệu này hỗ trợ nhiều loại dữ liệu, bao gồm văn bản, hình ảnh, âm thanh và video, đồng thời cung cấp giao diện cho nhiều ngôn ngữ lập trình khác nhau.
PostgreSQL cung cấp hầu hết các tiêu chuẩn của SQL và thêm vào đó rất nhiều tính năng mới như:
• Các câu truy vấn SQL phức tạp
Kiến trúc Client-Server
Kiến trúc Client-Server là một hệ thống quản lý và cung cấp tài nguyên cho phía Client Trong mô hình này, các yêu cầu và dịch vụ được phân phối qua mạng, thường được gọi là mô hình mạng tính toán hay mạng máy chủ-máy khách.
Kiến trúc Client-Server, hay mô hình máy khách-máy chủ, là một ứng dụng mạng phân chia các tác vụ và khối lượng công việc giữa máy khách và máy chủ, có thể nằm trên cùng một hệ thống hoặc kết nối qua mạng máy tính.
Kiến trúc Client-Server bao gồm nhiều máy trạm, PC hoặc thiết bị của người dùng, kết nối với máy chủ trung tâm qua Internet hoặc mạng khác Trong mô hình này, máy khách gửi yêu cầu dữ liệu, và máy chủ sẽ tiếp nhận, xử lý và gửi lại các gói dữ liệu cần thiết cho người dùng.
Hình 1.2: Kiến trúc Client-Server
Mô hình AGILE
Phương pháp AGILE là cách tiếp cận phát triển sản phẩm dựa trên các giá trị và nguyên tắc của Tuyên ngôn AGILE trong phát triển phần mềm Mục tiêu của các phương pháp AGILE là phát triển sản phẩm đáp ứng yêu cầu của khách hàng bằng cách chia nhỏ sản phẩm thành các chức năng nhỏ hơn, cho phép khách hàng thường xuyên phản hồi và điều chỉnh khi cần thiết.
AGILE được thiết kế để khắc phục những thách thức mà phương pháp “thác nước” truyền thống gặp phải trong việc phát triển sản phẩm lớn kéo dài Phương pháp này giúp thích ứng với sự thay đổi thường xuyên của yêu cầu khách hàng, từ đó giảm bớt khó khăn trong quá trình phát triển và bàn giao sản phẩm.
Tuyên ngôn AGILE là một tuyên bố quan trọng về các giá trị và nguyên tắc cốt lõi trong phát triển phần mềm, được giới thiệu vào năm 2001 Nó bao gồm 4 quy tắc và 12 nguyên tắc thiết yếu, đóng vai trò như một hướng dẫn cho việc phát triển phần mềm nhanh chóng Tuyên ngôn này được xây dựng bởi 17 chuyên gia hàng đầu trong lĩnh vực phát triển phần mềm tại bang Utah, Hoa Kỳ, do Kent Beck triệu tập.
4 giá trị cốt lõi của tuyên ngôn AGILE
1 Cá nhân và tương tác hơn là quy trình và công cụ
2 Phần mềm hoạt động tốt hơn là tài liệu đầy đủ
3 Hợp tác với khách hàng hơn là đàm phán hợp đồng
4 Ứng phó, phần hồi với các thay đổihơn là làm theo kế hoạch
12 quy tắc của tuyên ngôn AGILE
1 Ưu tiên sự hài lòng của khách hàng thông qua việc trao đổi và bàn giao liên tục.
2 Chào đón việc thay đổi trong suốt quá trình phát triển Tránh sự chậm trễ khi có thay đổi về yêu cầu.
3 Bàn giao sản phẩm thường xuyên, từ một vài tuần đến một vài tháng, với một thời gian ngắn hơn sau mỗi lần bàn giao.
4 Khách hàng và đội phát triển phải làm việc cùng nhau hàng ngày trong suốt dự án.
Xây dựng các dự án tập trung vào những cá nhân có động lực là rất quan trọng Cần tạo ra một môi trường làm việc thuận lợi, cung cấp đầy đủ hỗ trợ cần thiết và tin tưởng vào khả năng của họ để hoàn thành công việc một cách hiệu quả.
6 Phương pháp hiệu quả nhất là truyền tải thông tin đến đội phát triển là đối thoại trực tiếp.
7 Phần mềm hoạt động tốt là thước đo của quá trình.
Các quy trình AGILE hỗ trợ sự phát triển bền vững bằng cách cho phép các nhà tài trợ, nhà phát triển và người dùng cuối duy trì một tốc độ làm việc linh hoạt và không giới hạn.
9 Luôn tập trung đến kỹ thuật xuất sắc và sự thiết kế tốt giúp nâng cao tính linh hoạt.
10 Tính đơn giản – nghệ thuật tối đa hoá khối lượng công vệc chưa hoàn thành – là điều thiết yếu.
11 Các kiến trúc, yêu cầu và thiết kế tốt nhất xuất hiện từ các nhóm tự tổ chức.
12 Định kỳ, nhóm sẽ xem xét lại quá trình và đưa ra cách làm việc hiệu quả hơn,sau đó điều chỉnh hành vi của mình cho phù hợp.
Quy trình SCRUM
So với AGILE, SCRUM là một framework hiệu quả trong việc thực hiện các nguyên lý của AGILE, bao gồm các công cụ, vai trò và quy trình phù hợp với những nguyên tắc này.
Các khái niệm trong SCRUM
• User Story- Tóm tắt chức năng của sản phẩm từ phía người dùng.
– Là người mua hàng, tôi muốn xem toàn bộ danh sách sản phẩm.
– Là người quản lý, tôi muốn thêm sản phẩm vào cửa hàng.
Story Point là đơn vị dùng để đánh giá độ phức tạp của một User Story Nhiều công ty áp dụng dãy số Fibonacci để thể hiện rõ sự khác biệt về mức độ phức tạp giữa các Story.
Sản phẩm Backlog là danh sách các công việc cần thực hiện để hoàn thành dự án, bao gồm các User Story và các nhiệm vụ kỹ thuật như thiết kế, khởi tạo cơ sở dữ liệu và tích hợp API.
Sprint là một chu kỳ làm việc trong dự án, kéo dài từ 1 đến 4 tuần Trong mỗi chu kỳ, toàn bộ đội ngũ sẽ thực hiện các công việc như thiết kế, lập trình và kiểm thử để hoàn thiện sản phẩm vào cuối Sprint.
Khi bắt đầu một Sprint, đội ngũ sẽ lựa chọn các công việc cần hoàn thành từ Product Backlog và đưa vào Sprint Backlog Những công việc này phải được hoàn tất trong thời gian của Sprint.
• Defination of Done- Định nghĩa hoàn thành Một công việc được coi là hoàn thành khi đã code, test xong hoặc khi được khách hàng duyệt.
Vai trò, vị trí trong SCRUM
• Scrum Master - Người nắm vững quy trình SCRUM và đảm bảo cả team thực hiện đúng theo quy trình.
Product Owner là người quản lý Product Backlog, có trách nhiệm quyết định các chức năng cần thêm vào hoặc loại bỏ Họ cũng giải thích ý nghĩa của các chức năng đó cho các thành viên trong đội ngũ.
• Development Team- Team tạo ra sản phẩm dựa theo các User Story Cả team sẽ tự ước lượng và phân chia công việc cho từng thành viên.
Khảo sát hệ thống 14
Vấn đề thực tế
Ngành công nghệ thông tin tại Việt Nam đang có sự phát triển mạnh mẽ Mặc dù vậy, nhiều công ty phần mềm vẫn ưu tiên áp dụng quy trình "thác nước" truyền thống trong phát triển sản phẩm, với các bước thực hiện rõ ràng.
1 Lấy yêu cầu từ khách hàng.
5 Bảo trì, sửa chữa hoặc cập nhật chức năng cho hệ thống.
Trong quy trình "thác nước", các bước sẽ được thực hiện từ đầu đến cuối Tuy nhiên, việc xác định chính xác yêu cầu của khách hàng ở giai đoạn đầu là rất khó khăn, vì khách hàng thường không nhận thức được nhu cầu của mình cho đến khi họ thấy sản phẩm.
Khi khách hàng yêu cầu thay đổi, chúng ta cần bắt đầu lại quy trình, điều này có thể dẫn đến sản phẩm không đáp ứng đúng yêu cầu hoặc gây chậm trễ trong thời gian bàn giao.
Với phương pháp AGILE/SCRUM, các công ty có thể khắc phục những hạn chế của quy trình truyền thống, từ đó đưa sản phẩm đến tay khách hàng nhanh chóng và nhận được phản hồi sớm Để triển khai hiệu quả AGILE/SCRUM, các đội phát triển cần chú ý đến một số vấn đề quan trọng.
• Quản lý các task và bug
• Quản lý trạng thái của các task
2.1.2 Quy trình quản lý dự án dựa trên mô hình AGILE/SCRUM
Trong AGILE/SCRUM, team phát triển sẽ phải tham gia các cuộc họp sau:
Cuộc họp Sprint Planning là cuộc họp đầu tiên trong một Sprint, nơi các thành viên xác định các công việc cần thực hiện và ước lượng Story Point cho từng đầu công việc.
• Daily Meeting: Mỗi ngày, cả team sẽ họp khoảng 15 phút để cập nhật tình hình dự án Trong cuộc họp, mỗi thành viên sẽ trả lời 3 câu hỏi:
– Hôm qua tôi đã làm gì?
– Hôm nay tôi sẽ làm gì?
– Tôi có gặp khó khăn gì trong quá trình làm việc không?
Cuộc họp Sprint Review diễn ra vào cuối mỗi Sprint, nơi các công việc đã hoàn thành và chưa hoàn thành được xem xét Trong cuộc họp, nhóm sẽ trình diễn các công việc đã hoàn thành cho Product Owner, và sau đó cập nhật Product Backlog.
Cuộc họp Retrospective sẽ đánh giá những thành công và thách thức trong Sprint vừa qua, từ đó đề xuất các biện pháp cải thiện hiệu suất làm việc cho Sprint tiếp theo.
Hình 2.1: Mô hình AGILE/SCRUM
Hệ thống quản lý dự án cung cấp các công cụ hỗ trợ và kiểm soát, giúp đảm bảo dự án được triển khai đúng kế hoạch Điều này cho phép người quản lý theo dõi tình hình dự án một cách trực quan và cụ thể.
• Kiểm soát công việc trong Product Backlog và Sprint Backlog
• Kiểm soát tiến độ của từng công việc
• Quản lý nhiều dự án cùng lúc
• Lập kế hoạch công việc dựa trên đường găng
Thuật toán tìm đường găng
Sử dụng Forward Pass để tìm thời gian bắt đầu và kết thúc công việc sớm nhất.
Sử dụng Backward Pass để tìm thời gian bắt đầu và kết thúc công việc muộn nhất.
Qua đó có thể nhận thấy đường Găng của dự án chính là các công việc ABDGH.
Phân tích hệ thống 24
Sơ đồ phân cấp chức năng
3.1.1 Sơ đồ phân cấp chức năng phía thành viên
3.1.2 Sơ đồ phân cấp chức năng phía người quản lý
Hình 3.2: Sơ đồ phân cấp chức năng của thành viên
Sơ đồ luồng dữ liệu
3.2.1 Biểu đồ luồng dữ liệu mức ngữ cảnh
Hình 3.3: Luồng dữ liệu mức ngữ cảnh
3.2.2 Biểu đồ luồng dữ liệu mức đỉnh
Luồng dữ liệu mức đỉnh phía thành viên
Hình 3.4: Luồng dữ liệu mức đỉnh phía thành viên
Luồng dữ liệu mức đỉnh phía quản lý
Hình 3.5: Luồng dữ liệu mức đỉnh phía quản lý
3.2.3 Biểu đồ luồng dữ liệu mức dưới đỉnh
Hình 3.6: Luồng dữ liệu dưới đỉnh quản lý issue
Hình 3.7: Luồng dữ liệu dưới đỉnh quản lý danh mục
Thiết kế và xây dựng hệ thống 33
Thiết kế bảng dữ liệu
STT Tên bảng Diễn giải
3 UserProject Bảng người dùng - dự án
4 Permission Bảng quyền người dùng
7 Assignee Bảng người chịu trách nhiệm cho issue
9 IssueStatus Bảng trạng thái issue
11 ProjectAttachment Bảng file đính kèm của project
12 SprintAttachment Bảng file đính kèm của sprint
13 IssueAttachment Bảng file đính kèm của issue
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của người dùng int Khoá chính
2 name tên người dùng varchar(50)
3 email email của người dùng varchar(50)
4 password mật khẩu của người dùng varchar(50)
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của project int Khoá chính
2 name tên của project varchar(50)
3 description mô tả của project varchar(200)
4 createdAt ngày khởi tạo project datetime
5 attachmentId id của file đính kèm Khoá ngoại
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của UserProject int Khoá chính
2 userId id của người dùng int Khoá ngoại
3 projectId id của project int Khoá ngoại
4 permissionId id của quyền người dùng int Khoá ngoại
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của quyền int Khoá chính
2 value nội dung quyền hạn varchar(50)
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của sprint int Khoá chính
2 name tên của sprint varchar(50)
3 description mô tả của sprint varchar(200)
4 startAt ngày bắt đầu sprint datetime
5 endAt ngày kết thúc sprint datetime
6 projectId id project của sprint int Khoá ngoại
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của issue int Khoá chính
2 creatorId id của người tạo issue int Khoá ngoại
3 sprintId id sprint của Issue int Khoá ngoại
4 name tên của issue varchar(100)
5 description mô tả của issue varchar(500)
6 typeId id của loại issue int Khoá ngoại
7 statusId id của trạng thái issue int Khoá ngoại
8 attachmentId id của file đính kèm int Khoá ngoại
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của loại int Khoá chính
2 value nội dung của loại varchar(50)
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của trạng thái int Khoá chính
2 value nội dung của trạng thái varchar(50)
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của người chịu trách nhiệm cho issue int Khoá chính
2 issueId id của issue int Khoá ngoại
3 userId id của người chịu trách nhiệm int Khoá ngoại
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của comment int Khoá chính
2 creatorId id của người tạo comment int Khoá ngoại
3 issueId id issue của comment int Khoá ngoại
4 content nội dung của comment varchar(500)
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của file đính kèm int Khoá chính
2 content Đường dẫn của file đính kèm text
3 name Tên của file đính kèm varchar
4 projectId id của project int Khoá ngoại
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của đường dẫn đính kèm int Khoá chính
2 content Đường dẫn gốc text
3 name Tên của đường dẫn varchar
3 projectId id của project int Khoá ngoại
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của file đính kèm int Khoá chính
2 content Đường dẫn của file đính kèm text
3 name Tên của file đính kèm varchar
4 sprintId id của sprint int Khoá ngoại
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của đường dẫn đính kèm int Khoá chính
2 content Đường dẫn gốc text
3 name Tên của đường dẫn varchar
3 sprintId id của sprint int Khoá ngoại
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của file đính kèm int Khoá chính
2 content Đường dẫn của file đính kèm text
3 name Tên của file đính kèm varchar
4 issueId id của issue int Khoá ngoại
STT Tên trường Diễn giải Kiểu dữ liệu Khoá
1 id id của đường dẫn đính kèm int Khoá chính
2 content Đường dẫn gốc text
3 name Tên của đường dẫn varchar
3 issueId id của issue int Khoá ngoại
Mô hình dữ liệu quan hệ
Hình 4.1: Mô hình dữ liệu quan hệ
Xây dựng giao diện hệ thống
• Giao diện trang đăng nhập
Hình 4.2: Giao diện đăng nhập
• Giao diện trang đăng ký
Hình 4.3: Giao diện đăng ký
• Giao diện trang danh sách dự án
Hình 4.4: Giao diện danh sách dự án
• Giao diện tạo dự án
Hình 4.5: Giao diện tạo dự án
• Giao diện sprint hiện tại
Hình 4.7: Giao diện sprint hiện tại
Hình 4.9: Giao diện báo cáo
Hình 4.10: Giao diện báo cáo
Đề tài Đồ án 1: "Xây dựng hệ thống quản lý dự án phần mềm theo mô hình AGILE/SCRUM" đã được thực hiện bằng ngôn ngữ lập trình Javascript thông qua công nghệ NodeJS và ReactJS Qua quá trình này, tôi đã nắm vững quy trình phát triển linh hoạt AGILE/SCRUM và xây dựng thành công hệ thống áp dụng quy trình này Sau khi hoàn thành Đồ án 1, tôi đã đạt được những kết quả đáng kể.
Hệ thống quản lý dự án phần mềm được xây dựng với kiến trúc Client/Server, sử dụng NodeJS và ReactJS, mang lại hiệu quả cao trong việc phát triển các dự án công nghệ thông tin linh động, đáp ứng nhanh chóng các yêu cầu thay đổi từ khách hàng.
Node.js là nền tảng phát triển phần mềm đa nền tảng, nổi bật với khả năng xử lý đồng thời, rất lý tưởng cho việc xây dựng ứng dụng web phức tạp như phần mềm quản lý dự án.
React.js là thư viện JavaScript nổi bật cho việc phát triển giao diện người dùng, nổi bật với khả năng tái sử dụng cao, từ đó nâng cao tốc độ phát triển và hiệu quả bảo trì phần mềm.
Phương pháp Critical Path là công cụ hiệu quả để tối ưu hóa thời gian và nguồn lực trong quản lý dự án, đặc biệt khi có nhiều công việc cần thực hiện đồng thời.
Trong quá trình thực hiện, không thể tránh khỏi những thiếu sót Hệ thống cần được phát triển thêm nhiều chức năng để tối ưu hóa xử lý và nâng cao trải nghiệm người dùng Do đó, hướng phát triển của đề tài là rất quan trọng.
• Tăng tốc độ xử lý của hệ thống
• Tối ưu khả năng giao tiếp giữa các thành viên trong dự án thông qua các chức năng tin nhắn, video call
• Cải thiện dữ liệu báo cáo trực quan hơn giúp người dùng dễ dàng nắm bắt được tình hình dự án
• Cải thiện bảo mật hệ thống
Qua việc thực hiện đề tài Đồ án 1, tôi đã tích lũy được nhiều kiến thức và kinh nghiệm quý giá trong phát triển hệ thống, phần mềm, kiến trúc Client/Server, cũng như ngôn ngữ lập trình Javascript.
Một lần nữa em xin được gửi lời cảm ơn đến TS Tạ Thị Thanh Mai đã tận tình hướng dẫn em hoàn thành đề tài này.