Tổng quan đồ án

Trong thời đại 4.0 hiện nay, con người đang phải đối mặt với mật độ công việc dày đặt, tầng suất các dự án liên tục và thời gian thực hiện vô cùng gấp rút. Vì vậy việc sắp xếp và quản lý các công việc hay dự án và một kỹ năng bắt buộc đối với mỗi cá nhân hay tập thể nào đó. Các công cụ quản lý công việc từ trước đến nay gần như là giấy hay các bảng tính cơ bản khiến bản thân người dùng gặp khó khăn khi phải đối mặt với quá nhiều dự án mà không có thời gian quản lý.

Các khó khăn mà người dùng phải đối mặt khi quản lý dự án theo cách truyền thống xưa nay có thể kể ra là là:

• Các thông tin có thể bị phân tán, không tập trung lại cũng như dễ bị thất lạc hoặc nhầm lẫn khi quản lý nhiều tài liệu cùng một lúc.
• Khó khăn trong việc cập nhật tiến độ công việc.
• Khi xảy ra một sự cố hay một thay đổi trong công việc, người dùng thường gặp khó khăn khi thay đổi tiến độ.
• Mất rất nhiều thời gian để tìm kiếm thông tin dự án.
• Thụ động trong việc phổ cập thông tin đến các thành viên trong team.
• Thiếu sự tương tác trực tiếp giữa các thành viên.
• Khó bảo quản, lưu trữ, dễ hỏng hóc các tài liệu quan trọng.
• Các thông tin dễ bị thiếu sót trong quá trình đồng bộ hóa.

Vì vậy một ứng dụng giúp cá nhân và nhóm quản lý, phân công cũng như theo giỏi tiến độ công việc là một nhu cầu thiết yếu hiện nay. Đề tài Thiết kế công cụ quản lý dự án cá nhân và nhóm PTollo được nhóm chúng em thực hiện với mục tiêu là đơn giản hóa quá trình quản lý công việc của không chỉ cá nhân hay nhóm nhỏ mà còn có thể phát triển cho các mô hình công ty lớn hơn.

Mục tiêu đề tài

• Nghiên cứu, tìm hiểu và thiết kế một ứng dụng có chức năng quản lý các dự án từ nhỏ đến lớn.
• Tìm hiểu các cơ sở lý thuyết cấu thành nên một ứng dụng web.
• Xây dựng giao diện website PTollo trực quan dễ nhìn và có thể hiển thị trên nhiều thiết bị.
• Hiện thực hóa các chức năng chính và chức năng mở rộng của ứng dụng.
• Phân tích và đánh giá kết quả của ứng dụng trong môi trường thực tiễn

Cơ sở lý thuyết

1. Ngôn ngữ lập trình Javascript

Javascript là một ngôn ngữ lập trình cấp cao được sử dụng để tạo ra các tương tác cho website. Ngôn ngữ này đóng vai trò quan trọng trong việc đem lại những trải nghiệm cho người dùng. Ngày nay javascript đã phát triển mạnh mẽ để phát triển thành ứng dụng server-side thay vì chỉ là ứng dụng client-side như trước đây, nhờ đó các lập trình viên có thể sử dụng một ngôn ngữ cho cả frontend và backend. JavaScript đóng vai trò như là một thành phần quan trọng của trang web, giúp thực thi cho phép Client-side script từ phía người dùng cũng như phía máy chủ (Nodejs) tạo ra các trang web động (hay dynamic website).

2. Framework

ReactJS là một thư viện mã nguồn mở của javascript dùng để xây dựng giao diện phía người dùng dựa trên các thành phần UI đơn lẻ. ReactJS được phát triển và duy trì bởi Meta và cộng đồng các nhà phát triển và công ty cá nhân. React chỉ tập trung vào phần hiển thị giao diện (view), chứ không can thiệp vào cách sắp xếp logic nghiệp vụ hoặc cấu trúc của ứng dụng. Lập trình viên có thể tự do thiết kế giao diện so với các framework khác. Tuy nhiên vì vậy mà React trở nên khó học hơn đối với người mới bắt đầu lập trình hay khi phải quản lý các ứng dụng lớn.

React được xây dựng trên kiến trúc component, có nghĩa là các thành phần có thể được tái sử dụng giúp ích cho việc tái sử dụng và duy trì hoạt động của ứng dụng. Lập trình viên có thể phát triển ứng dụng thành các quy mô lớn hơn bằng việc chia nhỏ các thành phần và tái sử dụng chúng mà không gặp vấn đề.

Thành phần chính của ReactJS là JSX thường được hiểu là một cú pháp mở rộng cho phép lập trình viên viết các mã giống với HTML. Thay vì phải viết Javascript với HTML riêng thì với React ta có thể kết hợp chúng trong cùng một mã nguồn giúp lập trình viên dễ dàng quản lý. React xử lý các sự kiện bằng cách sử dụng cú pháp camelCase và truyền hàm sự kiện trực tiếp trong JSX.

Express.js là một framework quan trong được xây dựng trên nền tảng của Node.js, framework này cung cấp hỗ trợ giao thức HTTP, quản lý định tuyến (routing) và midleware tạo ra các APIs giúp ích cho việc phát triển ứng dụng web.

Tailwindcss là một Css framework utility-first hay còn được hiểu là ưu tiên tiện ích nhằm mục tiêu cung cấp các tiện ích cấp thấp giúp tối ưu cho việc xây dựng hay thiết kế giao diện một cách hiệu quả. Tailwindcss có nhiều class với nhiều thuộc tính Css khác nhau giúp việc mở rộng class từ chính những class này được thực hiện một cách dễ dàng.

Thiết kế và phân tích sơ đồ hệ thống

Sơ đồ Usecase mô tả chức năng tổng thể của toàn bộ hệ thống với 2 vai trò chính là Leader và User. Trong đó Leader có vai trò cao hơn, có quyền quản lý thành viên và kiểm soát cũng như tổ chức hệ thống. Trong khi đó User tức người dùng người dùng sẽ hoạt động dưới quyền chủ nhóm hay leader và được thực hiện các chức năng trong bảng và chỉnh sửa các công việc được phân công. Sơ đồ Usecase cung cấp cái nhìn tổng thể về toàn bộ hệ thống, các tác vụ và chức năng của một người dùng có thể thực hiện. Hệ thống hỗ trợ sự hợp tác, tổ chức công việc theo nhóm, và quản lý dự án một cách linh hoạt.

Leader là người có quyền cao nhất trong một nhóm hay một dự án, vai trò của leader không chỉ quản lý mà còn phải đảm bảo thành viên thực hiện đúng tiến độ công việc. Leader có 2 chức năng chính đó là quản lý danh sách các thành viên như thêm xóa sửa thành viên và chức năng thứ 2 là gán quyền xem hay sửa cho từng thành viên.

Sơ đồ này mô tả chức năng đăng nhập và đăng xuất của User, cụ thể như sau:

• Người dùng được phép lựa chọn đăng nhập hoặc đăng ký khi tiến hành vào trang web. Khi lựa chọn chức năng đăng ký người dùng sẽ thực hiện nhập các thông tin như tên đăng nhập, số điện thoại, email, … Sau đó một đoạn mã xác nhận sẽ được gửi vào gmail. Sau khi người dùng xác nhận, tài khoảng đã được đăng ký thành công hệ thống sẽ trả về cửa sổ đăng nhập.
• Chức năng quên mật khẩu được sinh ra để người dùng có thể lấy đặt lại mật khẩu của mình trong trường hợp họ không nhớ.
• Sau khi hoàn thành công việc người dùng có thể chọn đăng suất để kết thúc công việc.

Hiện thực hệ thống

Kết luận

Đánh giá kết quả

Mở rộng tính năng AI cho phép hệ thống gợi ý những người dùng phù hợp cho từng loại dự án khác nhau, từ đó chủ công ty hay leader các nhóm làm việc có thể chọn được các nhân viên phù hợp với dự án của mình.

Thông qua quá trình thực hiện đồ án, nhóm đã xây dựng được một trang web có thể giúp cho người dùng cá nhân, nhóm làm việc hay một công ty có thể quản lý công việc một cách nhanh chóng hiệu quả chỉ bằng cách kéo thả.

Ứng dụng giúp người dùng chia được các công việc ra thành từng phần nhỏ, sắp xếp chúng sao cho đúng thứ tự nhờ đó tiết kiệm được khá nhiều thời gian cho việc quản lý công việc bản thân.

Các chức năng như chatbox và video call hoạt động ổn định, giúp các thành viên trong team có thể tương tác với nhau thuận lợi trao đổi trong quá trình làm việc.

Chức năng upload đính kèm tệp tin hay gửi hình ảnh đem lại cho người dùng khả năng chia sẽ các file liên quan đến dự án.

Website Ptollo hoàn thành được 100% mục tiêu cơ bản đề ra. Giao diện ứng dụng đúng như thiết kế trước đó. Các chứng năng cơ bản của ứng dụng đang hoạt động rất tốt.

Hạn chế

Do thời gian gấp rút các chức năng mở rộng với AI như thu thập thông tin người dùng cùng dự án để gợi ý dự án cho người dùng vẫn chưa được thực hiện.

Giao diện vẫn chưa thật sự tối ưu đối với đại đa số người dùng, có thể cải thiện hơn trong tương lai. Các template có sẵn còn hạn chế số lượng, chưa đa dạng.

Cần bổ sung một số chức năng khác cung cấp cho người dùng nhiều tiện ích hơn như lọc các bảng theo các thông số như tên, kích thước hay những thông tin khác.

Hướng phát triển

Thiết kế lại giao diện sao cho tối ưu hơn với đại đa số người dùng, làm giao diện trở nên đẹp và dễ tiếp cận hơn.

Tạo thêm chức năng bộ lọc bảng, thiết kế hệ thống cho phép người dùng khác đăng tải các template khác nhau để người dùng khác có thể áp dụng.