Ptask xây dựng website quản lý dự án tùy chỉnh cho doanh nghiệp

Làm việc theo nhóm là điềucầnthiết trong thếgiới ngày nay, ảnh hưởng trực tiếp đến sựthànhcông hay thấtbại của các dựán và nhiệm vụ.Đe quảnlý làm việc nhóm hiệuquả,nhómchúng tôi xin giới

Hội nghị Khoa học trẻ ỉần 5 năm 2023(YSC2023)-ỈUH

YSC5.F027

VÕMINHPHƯƠNG1, NGUYỄN ĐỨC HUY1, NGUYỄN THỊ HẠNH1*

}Khoa Công nghệ Thông tin, TrườngĐại học Công nghiệp Thành phổ Hồ Chỉ Minh

*ngthihanh@gpỉail.com

nhiệm vụ nhỏhơn,chophép các thành viên hoặc nhóm riêng lẻ hoànthànhchúng trong khung thời gian cụ

thể, đảmbảo tổ chứchiệu quảvà kiểm soát tiến độ Đượcphát hiển bằng các côngnghệ mới nhất như

NodeJS,ASP.NET Core, AWS, Cyclic, Githubvà MongoDBCloud,PTASK là một nền tảng dựa hên web giúp tối ưu hóa việc quảnlý dự án Nó tạo điều kiện cộngtác,phân bổ nhiệm vụ và theo dõitiến độ,nâng cao năng suất và sự phối hợp tổng thể Với PTASK, doanh nghiệp được hưởng lợi từkhả nănghiển thị

nhiệm vụđượccải thiện, quỵ hìnhhợp lý hóa vàgiao tiếp nhóm nâng cao Bằng cách giao nhiệm vụ,đặt

thờihạn và theo dõi tiến độ,PTASKđảmbảomọi người đềuđược liên kết và chịu hách nhiệm Trải nghiệm

công

Từ khóa Quản lý dự án,Doanh nghiệp, Quản lý, Quá trìnhlàm việcnhóm

PTASK: BUILDING A CUSTOM PROJECT MANAGEMENT WEBSITE FOR YOUR

BUSINESS Abstract. Teamwork is essential intoday's world, dữectlỵ influencing the success orfailure of projects

managementsystem for businesses PTASK breaks downprojects into smallertasks, allowing individual

members or groups to complete them within specific timeframes, ensuring efficient organization and

1 GIỚI THIỆU TÔNG QUAN

Trong môi trườngquản lý doanh nghiệp ngày nay, quảnlýdự án đóng vai trò then chốt hongviệc đạt được

sựthành công và phát triển bền vững cho doanh nghiệp Việc theo dõi, tổ chức và điều phối các hoạt động

đã trởthànhmộtcôngcụ quan họng và không thể thiếu cho các doanhnghiệp

Website Quản lý Dự án Tùy chỉnh là một hệ thống phần mềm dự án đượcphát hiển dựa trêncông nghệ

quản lý dự án vàcác thànhviênliên quan có cái nhìn tống quan vềtình hìnhdựán và có the đuara các quyết định kịpthời đe đảm bảo tiến độ và chất luợng

án vàghi chú các chỉ định cụ the cho từng công việc Điều này giúp tăng cuờng sự rõ ràng vàđồng nhất

quyết vấn đề và phối hợp làm việc giữacác thànhviêntrong dựán

một cách hiệu quả và tránh những sự không phùhợp hoặcmấtthông tinquan trọng

2 CÁC CÔNG NGHỆ LIÊN QUAN

Hình 1: Microsoft NET [2]

2.2 S3 (Amazon Simple storage Service)

Amazon Simple Storage Service (Amazon S3) làvùng luu trữ trên Internet DùngAmazonS3 de lưutrữ

và truy xuất bất kỳ dữliệutại bấtkỳthời diemnào, từ bất cứ nơi đâu trên web Bạn có the tươngtác với

AmazonS3 dùng AWS Management Console, giao diệnwebđơn giản nhưng trực quan Tài liệu này hướng

Hội nghị Khoa học trẻ lần 5 nám 2023(YSC2023)-ỈUH

Move data Mcs« your dau to Arraxon

S5 from wherever It Irvej

-In the iloud In dpplKdtions.

or on-premites

Hình 2: S3 (Amazon Simple Storage Service) [3] [4]

A»nb(.»l

f ntell ọence (*0

Analyze data Ute AWS icd Srd pjity

service! to i'.sijre your data to 9ain inj*;bt3

2.3 Json Web Token (JWT)

JSON Web Token (JWT) là một chuẩnmở(RFC 7519) định nghĩamột cáchnhỏ gọn rà tự chứađể truyền

Authenticationsẽ xác thực và giải mãtoken

End User

JWT Authentication Workflow

Hình 3: JWT [8] [9]

2.4 Cyclic

Cyclic được xây dựngvà triểnkhai vào AWS Cyclic cungcấp trước mộtứng dụng không có máychủ bằng

dụng mã mói nhất

Hình 4: Cyclic [7]

2.5Nodejs

J NodeJ s là một nềntảng (Platform) được xâydụng trên nềntảngJavascript V8 Engine Được xây

s Phần core sử dụng Javascriptvà C++ cho phépxử lý vói hiệu năngcao

s Phù hợp vớicác ứngdụng xử lý nhanh, real time hoặc nhũng ứng dụng cần thay đỗi công nghệ

nhanh

V Thường phát triển theohướng modulehóathànhcác phần nhỏ của ứng dụng vàc ó thể thêm module

có sẵnbên ngoài thông qua NPM, yarn

Hình 5: Node Js [1]

s MongoDB là một hệ quản trị cơsởdữ liệumã nguồnmở, là c SDL thuộc NoSql và được hàngtriệu

V MongoDB là một databasehướng tài liệu (document), các dữ liệuđược lưu trtt trong document

s Với CSDL quan hệ chúng ta có khái niệmbảng, các cơ sởdữ liệu quan hệ(nhưMySQL hay SQL Server ) sử dụng các bảng để lưu dữ liệu thì với MongoDB chúng ta sẽ dùng khái niệm

MongoDB sẽ dùng cácdocument thay cho row trong RDBMS

V Các collection trong MongoDB được cấu trúcrấtlinh hoạt, cho phép các dữ liệulưu trtt khôngcần

V Thông tin liên quan được lưutrữcùng nhau để truy cập truy vấn nhanh thông qua ngôn ngữ truy vấn MongoDB

Hội nghị Khoa học trẻ lần 5 nám 2023(YSC2023)-ỈUH

▼ mongo

Hình 6: Mongo DB [5][6]

3 CÔNG CỤ PTASK

JQuery, Boostrapt, HTML/CSS, Json Chart, JSON Web Token (JWT)vàcơ sỗ' dữ liệu MongoDB.Ngoài

ra,chúng tôiđã tích họp một sốcôngnghệbênngoàinhư AWS,Fkebase Authentication, Cyclic Hệ thống

Cả ba đều có các chức năngtương tự và được thiết kế theo yêu cầu của bài toán JWT được sử dụng để mã

dịchvụđiện toán đám mây nỗi tiếng, hỗtrợđãngkývà xác thực thông qua sốđiệnthoại rà email Chúng

khác Cyclic là một côngcụhỗ trợviệc đưa websitelênhost để người dùng có thểtruy cập onlinebất cứ

khinào

ký hoặc thựchiệncáctác vụkhác trêngiao diện,yêu cầucủangười dùng sẽ được gửi đếnmáy chủ Máy

ngườidùng, cấu trúc này cho phép các thànhphần của ứng dụng hoạt động độc lập và tương tác vói nhau

Hình 7: Kiến trúc Client-Server [10]

cung cấp việcquản lý dự án từ nhỏ đến lớnnên các cá nhân hay tồ chức cónhu cầuquản lý dự án đều có

Tác nhân Mô tả tác nhân

Chủdựán Chủdự án sau khi đãng nhập vàowebsite có thểtạodự án mớivà có thể thựchiện các

chức năngnhư: Quản lý vềdựán: có thể xem thông tin, chỉnh sửa vàxoádựán Quản

án, có thểchỉnh sửa quyền của thành viêncũngnhư thêm xoá các thành viên cũng như các nhóm trong dựán Quản lý về côngviệc trongdựán: có thểxem chi tiết mọi hoạt

Nhóm trưởng Nhóm trưởngsaukhiđăng nhập vàowebsite có thể vào xem thông tin dự án và có thể

thực hiện các chức năng quản lý công việc trongdự án nhóm trưởng có thể thêm, xoá,

wen cótrongnhómcủamình, phân côngcác thànhviên vào cáccôngviệcphù hợp cũng

mà mìnhtham gia, thành viêncó thể chọn hoàn thànhcông việchay thêm các ghi chú

và 1 actor phụ là Firebase

Hội nghị Khoa học trẻ lân 5 năm 2023(YSC2023)-ỈUH

Account

•Jd O:>jedd

•ar'iari String

■password íirrmg

*gatA4Ar.ax>nt(.-aq rex)

*gelArdunĩByFma8(niq, rex)

«galArxDiin'.By<d(req, rex)

•rreaieAr.axinr'/eq rex}

•< taviga 3axxmrxti(req, res)

•óonpiPassMrrvdlnrq, rex)

Project

•jd Objarid

■nara: string

•status flootaan

•xtartTrse : Daw

•backgnr.irrl : String

•main Project Cbjectid

■taamtdx ỊObpctỉđỊ

*gaUJlPrọpd(req tn*}

•g«tPrirj>K:IB/<Vreq, res)

•gatPmjacIBySiamafreq rex)

«gatPrujadByldJxer(req, rex)

•u;xtafaPr<j»d(r<K|, RMS)

*cr<MtaPrc^wd(ra<ị res)

*ad<ưearisỊre<Ị rex}

•mmoveProjadjreq rex}

•ihnji Statux^req rex)

-fttfra: string -crea'.uld : CbjaCd -ktìửeild : Cbịuctđ

-taiMembtrt JObjecUd)

4«Te3mg }CbJect<5 J

•getAITeam0yldProjtMx;rea res}

••jtìtABMdcùerSvMPrtiie<X(rú<i raS)

•getAITeam9yld?Â>tk(req ree)

•gelAafriumbeiOrearrHreQ ree}

•gutAJrreamOrJMrtnxi rwi)

•flutTuar'iBy dfreq, I&8)

•<xea:eTúari(.<eQ n>s)

•cftangeNametieq; ree)

•roír»jvơkt> nlx.-ntt> ‘j res)

•J JCMu<'it«r(XKi res)

•addTearnlnTeanXreq ret)

•rurndveTeamlnTeamfreq rec)

•<i«C_eaJu<sCTeunXrẽM, ret)

-gul!_eadú<fCT.taìít>enreq res)

•rernjveTearnlriPwfcrctireci r«)

•jdObjedld

•name : string

•stains Pootean -startTirrw : String

anTiiw String

-taarrid Objedld

•Cretan kl <faj«dld kM rid Obịedd

•prrrjaetld : Object'd

♦gntAlVibr«Byo ar>jnctd(req, res)

•HjtdVrirr<Sytvar>a(ra<), res)

♦gelVAirkftyldJreq, res}

*T reateVfork(n»q, rex)

■HipdataTmwWortiraq rex)

+ehangaNarna'Arórfc(rar] res) +chta>guSialuxWark{req, rax}

«remưra'A<oik{req ra»}

MembQfWork -_<1 Objrxtxi

■woricld • Cbpc-ld

•rpjwnlri ' Obịoơd

UamberT-W

•jd : Object'd

•task Id Chjectid

•userid: Objedld

•_u: Ctjec-.w

■text: STrhg

•lntat|Siring|

■taBkld: Objecild

-aeaieid: COjucid

♦ge-AI.\oto(req,re«}

♦ỹe ’ l<otó3ylúfTaí*(r«ị res)

♦ặeỉKoteBylơím iw)

♦€reatoKoie}r«j res}

♦Térnơrer4oCe(réq res)

♦tipda’-eKotaireu ree)

•Jd : Objac.d

•name : String

•dexcririion: string

•xtariDay Data

•startHour ■ string Hr.xftourSuing

-wrrtkt: Object id -rrerntaws (Cbpctld|

♦gelAjrradsHyldProjecX’ e ’ l "«)

♦gatAJT ’ askWAtari.rreq res)

«g«tTaxkByld(req, res)

agelTaxkBySametreq rex)

«crealeTaà(raq, rex) -*updateTask(req, ms)

aupdataDescrplionCH] "»*)

♦changattarrrefreq, res) aremovnl ast^req, rex)

*updat»Stahisraxk(iwq, res)

o •

Hình 9: Sơ đồ Class Diagram của PTASK

3.4 Giao diện phác họa

Trong giao diện website sử dụng các công nghệ Cyclic hỗtrợviệc đưa website lên host, côngnghệ AWS

Toodựõn ũártsnhrlãu GAnđiy ■ ữ MjjyenOtr: M/y

Dư án ben tham gia

Hình 10: Giao diện quản lý dự án

-S Chọn vào avatarđể truy cập xem thôngtin người dùng hoặc đãng xuất khỏi hệthống

■ ■ qi«n Of M

Qhr»yĩi tra/n ẹ»a

[pi Own adcti cờrq'4c

g (felt! *&n nnHm M*

c TH«t> v*n llurn <ỹ»

C';1 Tbđno M cóoq

Hình 11 Giao diện tổng quan dự án của thành viên

Chọnvàobiểu tượng“!” để chỉnh sửa côngviệc

Chọn “Danh sách côngviệc” để xem đanh sách các côngviệc trong dự án

Chọn “Danh sáchnhiệm vụ” để xem danh sách nhiệm vụ trong dựán

Chọn “Thành viên tham gia” để xem danh sách tấtcả cácthànhviên có trong dự án

Chọn “Thống kê côngviệc” đểxem biểuđồ thống kê côngviệccủadự án

Hình 12: Giao diện danh sách nhiệm vụ của thành viên

Chọn vào biểutượng cây bút để xem thông tin vàtạoghi chú nhiệmvụ

Chọn “v” để hoànthành nhiệmvụ

Chọn “Tổng quan dựán” để xem tống quan thông tindựán

Chọn “Danh sách côngviệc” để xem danh sách các công việc trong dự án

Chọn “Danh sách nhiệm vụ” để xem danh sách nhiệm vụtrongdựán

Chọn “Nhóm thamgia” để xem danh sách cácnhómcó trongdựán

Chọn “Thành viên tham gia” để xem danh sách tấtcả cácthành Mên có trong dựán

Chọn “Thống kê công việc” để xem biểu đồthống kê côngviệccủadự án

Hội nghị Khoa học trẻ lần 5 nám 2023(YSC2023)-ỈUH

C41an-.ri.5u ainđ.ly

-KHAI OIÀNO NẮM HỌC

5, lingqiunaj*!

reiimttwigU ỊJ7j ữ*>*> un o2nq 4K

g t*»v> Uch rtwn

_1 TrumnenvungB ĩWgMcérgv4c

OANH SACH THANH VIÊN

va Minh pbưorg Ntsrrn tn/àrvg CIO Am nl-oí NguyénOucHvy rip ncp trưm 'An Ũ8 Am nhọc, tnuí-i Bl đột rga riM guổc ra ThÀníi viAnClB Am r*M»c

Nguyên vtet Nom TÍP nep Inarm ven CLH Am nhge OitíSn Si eớ> nga Nil qutìt ra ThannvienClB AmrHoc

Hình 13: Giao diện danh sách thành viên của thành viên

Chọn “Tổng quan dựán” để xem tống quan thông tindựán

Chọn “Danh sách côngviệc” để xem danh sách các côngviệc trong dự án

Chọn “Danh sách nhiệm vụ” để xem danh sách nhiệm vụtrongdựán

Chọn “Nhóm thamgia” để xem danh sách cácnhómcó trongdựán

Chọn “Thành viên tham gia” để xem danh sáchtất cả các thànhviêncó trong dự án

Chọn “Thống kê công việc” để xem biểu đồthống kê côngviệccủadự án

■ 5*5 NguytnOửí Huy

Taudựán DA đórèi uàii Gy>ữi>

Hình 14: Giao diện thống kê công việc

Chọn“Nhóm thamgia” đểxem đanh sách cácnhómcó trongdự án

Chọn“Thốngkê công việc” để xem biểu đồ thống kê côngviệccủadự án

dễnhìn, sử dụng

4.2 Hướng phát triển

Hoànthiệncác chức năngcònthiếu

Đưavàosử dụng trực tiếp tại các doanhnghiệp

Kết nối đăngnhập vớicác tài khoảngoogle,facebook,

Ket nốivới các công cụhỗ hợ khácnhư:Github,

Việc sắp xếp lịch hình triển khaisao cho có khoa học, lênkếhoạchchi tiết cho các công việc mộtcách

Chuẩn bị thậthoàn chỉnh vàchu đáo cácnghiệp vụ, nắm rõ phầnmềm,thaotác, quỵ hình, để hiển

khai chodoanhnghiệp

4.4 Hạn chế

gian hạn hẹp cũngnhư hình độ chuyên môn chưa cao Kỹ năng nghiệpvụ củanhóm còn yếu, chưa nắm

ở doanhnghiệp

REFERENCES

[1] https://nodeis.org/en/docs

[2] https://dotnet.microsoft.com/en-us/apps/aspnet

[3] https://aws.amazon.com/vi/s3/

[4] https://viblo.asia/p/tim-hieu-s3-aws-amazon-simple-storage-service-gDVK2QGm5L

[5] https://www.mongodb.com/docs

[6] https://mongooseis.com/docs/guide.htm

[7] https://docs.cyclic.sh

[8] https://iwt.io/

[9] https://viblo.asia/p/tim-hieu-ve-ison-web-token-ịwt-7rVRqp73v4bP

[10] Smith, J (2022) Client-Server Architecture: Concepts and Implementation ABC Publishing