Khóa luận tốt nghiệp Kỹ thuật phần mềm: Xây dựng ứng dụng ghi chú và quản lý tiến độ công việc cá nhân và nhóm

Phạm vi:Phạm vi khoá luận hướng đến việc xây dựng ứng dụng di động tập trungphát triển trên hệ điều hành iOS va Android cùng với các chức năng chính sau: — UUUX: Đầu tiên sẽ mang lại trả

ĐẠI HỌC QUOC GIA TP HO CHÍ MINH

TRUONG DAI HOC CONG NGHE THONG TIN

KHOA CONG NGHE PHAN MEM

DANG DUY BANG - 19521234

NGUYEN NHUT TAN - 19520923

KHOA LUAN TOT NGHIEP

XAY DUNG UNG DUNG GHI CHU,

QUAN LY TIEN DO CONG VIEC

CA NHAN VA NHOM

NOTES TAKING AND TASKS TRACKING MANAGEMENT

APPLICATION

KY SU NGANH KY THUAT PHAN MEM

GIANG VIEN HUONG DAN:

THS THAI THUY HAN UYEN

TP HO CHÍ MINH, 2023

LOI CAM ON

Trong quá trình học tập, nghiên cứu va phát triển dé tài “Xây dung ứng dungghi chu, quan lý tiễn độ công việc cá nhân và nhóm” chúng em đã nhận được sự giúp

đỡ, chỉ bảo nhiệt tinh của Cô dé hoàn thành đồ án này

Chúng em xin gửi lời cảm ơn chân thành đến Cô Thái Thụy Hàn Uyên vìnhững đóng góp không nhỏ trong quá trình phát triển đề tài Cô đã dành thời gian vàtâm huyết hướng dẫn, giúp đỡ về kiến thức, tài liệu cũng như phương pháp, giúp choquá trình nghiên cứu và phát triển được diễn ra một cách thuận lợi Chúng em xin ghi

nhận những ý kiến nhận xét và lời đóng góp quý báu từ Cô giúp chúng em có thêm

những ý tưởng và hướng phát triển trong tương lai

Bên cạnh đó, chúng em cũng xin được gửi lời cảm ơn đến toàn thé quý Thay,

Cô tại trường Đại học Công nghệ Thông tin, những người đã chỉ dạy nhiệt tình và

đem lại nguồn cảm hứng dé chúng em có thé lay làm động lực và phát triển trên con

đường sự nghiệp phía trước.

Mặc dù đã có nhiều cố gắng trong suốt quá trình thực hiện dé tài, nhưng bên

cạnh đó vẫn còn có những mặt hạn chế, thiếu sót Chúng em rất mong nhận được ýkiến, đóng góp của quý Thay, Cô dé có được những kinh nghiệm quý báu lấy làm

hành trang trong tương lai.

Chúng em xin trân trọng cảm ơn!

TP Hồ Chí Minh, tháng 7 năm 2023

Nguyễn Nhựt Tân

Đặng Duy Bằng

ĐHQG TP HO CHÍ MINH CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM

TRƯỜNG ĐẠI HỌC Độc Lập - Tự Do - Hạnh Phúc

CÔNG NGHỆ THÔNG TIN TP HCM, ngày tháng năm 2023

DE CƯƠNG CHI TIẾT

TEN DE TÀI: Xây dựng ứng dụng ghi chú, quản lý tiến độ công việc cá

nhân và nhóm

Cán bộ hướng dẫn: ThS Thái Thuy Hàn Uyễn

Thời gian thực hiện: Từ ngày 6/2/2023 đến ngày 25/6/2023 (20 tuần)

Sinh viên thực hiện:

Nguyễn Nhựt Tân 19520923

Đặng Duy Bằng 19521234

Nội dung đề tài:

Mục tiêu:

— Ứng dụng được xây dựng với mục đích giúp các cá nhân, nhóm nhỏ

khoảng từ 30 đến 50 người (có thé cải tiến) có thé quản lý công việccủa mình dé dàng, theo đõi tiến độ công việc và phân bồ thời gian một

cách hợp lý Tạo thói quen ghi chú công việc thường xuyên, đem lại

hiệu quả trong cách quản lý và sắp xếp công việc

— Bên cạnh đó, đối với việc quản lý các thành viên trong một nhóm có

thé đánh giá được hiệu quả và thời gian hoàn thành công việc, từ đó

người dùng có thể biết được chính xác năng lực của từng người để

phân chia công việc một cách hợp lý.

Phạm vi:

Phạm vi khoá luận hướng đến việc xây dựng ứng dụng di động tập trungphát triển trên hệ điều hành iOS va Android cùng với các chức năng chính sau:

— UUUX: Đầu tiên sẽ mang lại trải nghiệm thân thiện với người dùng

— Authentication: Đăng nhập, đăng ký,

— Note: Tạo ghi chú mới, gợi ý các mẫu ghi chú, phân loại ghi chú,

— Reminder: Tạo lịch nhắc nhở, theo dõi tiễn độ qua timeline,

— Project: Tạo dự án và quản lý công việc của nhiều thành viên, đánh

giá hiệu quả làm việc qua từng task,

— Task: Tao task cho thành viên, theo dõi tiến độ và cập nhật trang thái

liên tục, tìm kiếm, tính năng đề xuất thành viên phù hợp với công việcdựa vào chủ dé áp dung Content-based recommendation system

— Chat Group, Chatbot (Chat realtime giữa các thành thành viên và kết

hợp chatbot OpenA])

— Statistic: Thống kê lại kết qua làm việc sau thời gian được quy định,

cho điểm từng thành viên trong một dự án,

— Notification: Nhận các thông báo khi có các hoạt động mới,

Đối tượng sử dụng:

— Là những cá nhân muốn quan lý công việc một cách hiệu qua, tạo cho

mình một thói quen ghi chú hàng ngày, cần một nơi dé lưu trữ nhữngthông tin cần thiết để ghi nhớ, tạo lịch nhắc nhở cho những công việcsắp tới, làm chủ thời gian dé quản lý công việc một cách tốt nhất

— Là các tô chức, nhóm muốn quản lý công việc của nhiều người, theo

dõi tiến độ cũng như quá trình làm việc của các thành vién,

— Về số lượng người dùng tải và sử dụng ứng dụng là không giới hạn

Về số lượng người dùng đồng thời tạm thời ước tính khoảng 100 ngườidùng.

— Ứng dụng không phân chia lĩnh vực cụ thé, các tính năng quản lý, ghi

chú hầu như phù hợp cho mọi công việc, cụ thé là các công việc đòihỏi sự liên tục, tiến độ cập nhật thường xuyên Tuy nhiên về sau cóthé cải tiễn thêm cho các lĩnh vực cụ thé đi kèm thêm các nghiệm cụtương ứng với từng lĩnh vực đó dé ứng dụng có thé đi sâu vào từng

ngành nghề tìm ra các phương pháp quản lý hiệu quả hơn.

Phương pháp thực hiện:

— Tìm hiểu và tham khảo những phương pháp đã có, so sánh ưu điểm,

nhược điềm dé chon lọc

— Kế thừa và phát huy những tính năng tương tự, đề xuất các giải pháp

phù hợp.

— Nâng cấp và sáng tạo hơn trong cách xử lý, cách nhìn nhận dưới vai

tro là một người dùng ứng dụng

— Chia nhỏ các công việc để thực hiện theo từng giai đoạn, quản lý công

việc trong thư mục lớn dé dé dàng đánh giá tiến độ, tạo kế hoạch làmviệc theo từng mốc thời gian cụ thê và review chéo sau khi kết thúcmột giai đoạn và chuẩn bị kế hoạch cho bước tiếp theo

— Áp dụng mô hình tiếp cận lặp (Iterative Model) trong quá trình thực

hiện và xây dựng ứng dụng Một chuỗi quá trình thực hiện sẽ được lặp

đi lặp lại từ lúc bắt đầu đến khi hoàn thành sản phẩm và báo cáo, saumỗi chu kỳ sẽ có kết quả của quá trình đó, tiếp theo thực hiện review

sau mỗi giai đoạn cho đến khi có sản phẩm cuối cùng

Kết quả mong đợi:

— Hiểu rõ về công nghệ, năm được các kiến thức cơ bản và cách hoạt

động của công nghệ được sử dụng.

— Năm được vòng đời của một ứng dụng hiêu được cách vận hành, từ

lúc khởi động đến khi kết thúc

— Biếtsử dụng các công cụ dé phat triển, hỗ trợ trong quá trình thực hiện

— Tài liệu và quá trình làm việc được ghi lại đầy đủ và rõ ràng đáp ứng

cho việc cải tiên và sửa lỗi sau này, có thê được kê thừa bởi những TIBƯỜI sau.

Kế hoạch và phương pháp thực hiện: (Nêu lên quy trình, thứ tự thực hiện

công việc, kê hoạch phân công và nhiệm vụ của từng sinh viên tham gia)

- Tìm hiểu, nghiên cứu công nghệ thực hiện Bằng,

(React JS, framework7, Node JS, Express JS, Tan

Tìm hiểu, Typescript, NoSQL, )

- Tham khảo ứng dụng tương tự, liệt kê các chức

năng cần có, phân tích yêu cầu, mô tả chỉ tiết (2)

- Thiết kế giao diện màn hình trên figma.com,

logic các xử lý màn hình 6)

- Tạo thư mục quản lý tiễn độ, cập nhật tài liệu

liên tục trên drive

- Thiết kế database, mô tả cơ sở đữ liệu thông qua Bằng,

Phân tích yêu tool dbdiagram.io © Tan

cau - Liệt kê các API cần thiết cho ứng dung ©

Từ 20/2/2023 | - Soạn file ngôn ngữ cho ứng dụng Ở)

đến 5/3/2023 :

- Build source code frontend, backend ®

(2 tuần) pgs

- Thiết kế kiến trúc source code ©

- Vẽ use case diagram thông qua draw.io, đặc tả Bằng,Thiết kéhe | Chỉ tiết các use case (49) Tân

thống và - Vẽ sequence diagram các chức năng cơ bản

Mô ta chức _ | thông qua tool sequencediagram.org (14)

nang - Setup môi trường, server deploy, cloud, đ2)

Tur 6/3/2023 | Coding frontend, các man hình onboard,

Triển khai - Coding logic cho từng màn hình (9)

coding - Coding backend, viết các API theo danh sách

Từ 17/4/2023

đến 11/6/2023

(8 tuần)

liệt kê trước đó 7)

- Review code qua lại trong quá trình làm việc déhạn chế conflict đ8)

- Liên kết frontend với backend, map data vào ứngdụng (19)

- Hoàn thiện các chức nang cho ứng dung, tao

data mau, tao user cho ung dung (20)

- Test theo test case, fix bug 1

- Hoan thién bao cao, slide thuyét trinh, tai liéu

(22)

- Sin sang demo 23)

Bang,

Tan

Ghi chú: Các công việc được phân chia đồng đều cho các thành viên, với

mỗi công việc sẽ được một người phụ trách chính và người còn lại trong

nhóm có trách nhiệm review, góp ý, thay đôi và cải thiện (nêu có).

Xác nhận của CBHD (Ký tên và ghi rõ họ tên) Sinh viên 1

Thái Thuy Hàn Uyễn

(Ký tên và ghi rõ họ tên)

MỤC LỤC

TOM TAT KHOA LUẬN TOT NGHIIỆP 2- 5-5 s2 ©ssessesseesezsscse 1

CHƯƠNG 1: TONG QUAN 5-< 5-56 se 9s seESEseESEseExEseEsesereesersessrsee 3

1.1 — Giới thiệu đỀtải ằĂ 2 he 3

1.7 — Hiện trạng bài tốn + TS S St SH rket 7

1.7.1 Các ứng dụng liên qua1n - 5 332133 E+EEE+eeeseeerereerees 8

1.7.2 Đánh giá hiện trang và hướng giải quyết - 2-5: 11

CHƯƠNG 2: KIEN THUC NEN TÁNG -5 s°esse+resserresserresee 13

2.1 Cơng cụ quản lý và phát triển -¿-¿+++cx++z++zx+zrxrzzsee 13

2.1.1 Visual Studio Code - Sc 11+ v3 rệt 13 21.2 XCOdC 14

2.1.3 Android SfudÌlO - - c cc 1112111111111 1111111 811111111 re 15

QL vo Ä.Äố 16

"0o 9n :ÕỮ11 17 2.1.6 z na 18

2.2.4 MongoDB Atlas (noSQLL) - - - 5S SE *sksseersssrreeses 22

2.2.5 Javascript (TYpD€SCTIDẨ) - Á TS nSnnnH HH Hye 23

2.2.6 FireDase nh /.33- 24

"uy nan e 25

2.2.8 (U91 26 2.2.9 Chatbot GPT - OpenAll - cty 27

2.3 Content-Based Recommendation System : +55 +s<+++++ 28

2.3.1 Tổng quan s- St 222 EEEEEEEEE12112121711121121 11111 xe 28

2.3.2 Các khái niệm liên quan - - ¿c5 + + *+*kssEEseerrerrrrrreree 28

2.3.3 Áp dụng vào dự án -¿- 2s 2112111111121 1111 xe 28

CHƯƠNG 3: XÂY DUNG UNG DUNG °-s-cssccsscssersserserssersee 33

3.1 _ Phân tích yêu cầu hệ thống - 2 + +E+E+E+EzExerxerreres 33

3.1.1 Phân tích yêu cầu chức năng -2 ¿-+¿©++:x++ze+zx++zxe+ 333.1.2 Phân tích yêu cầu phi chức năng - 2-5 +2+sz+£+z+zxz+z 343.1.3 Phân tích yêu cầu người dùng ¿2 s+52+x++EczEerxerxerszxee 34

3.2 Phan tích thiết kế hệ thống - 2© eEE+EE+E+EeEEerxerxereee 63

3.2.1 Thiết kế xử lý 5 tt E1 1212111211211211 21111111 cxe 633.2.2 Thiết kế cơ sở dữ liệu -c:c+ccxrtrrrtrrrrrtirrrrrirrrrrirrirk 683.2.3 Thiết kế kiến trúc hệ thống 2 2 s+x+£EtzE+zEzrxerxees 793.2.4 Thiết kế giao điện - 2- s22 EEE1EE12112112112111 112111 xe 83

3.3 Triển khai hệ thống - + ©E+2E2E2EE2 1212712121211 EeEkrrei 96

3.3.1 May CHU oe 963.3.2 Ứng dụng di động - + S222 EEEEE121121121 11112111 96

41 Kết Ua No i830)10 2n “““411DỤDŨD

4.2 Thuận lợi và khó khăn - - + 22+ + +22 1x ++2EE+eEEseeeeeeeseeeee

AQ Thuan lot

4.2.2 Khó Khan cc cccccesecessecesecesssceseeeesseceseeeesseceseecsseeeeseeeesees4.3 Hướng phát trin c2 EEEE212111 211211214.4 Kếtluận 22c 2222 2122212112212 erreeTÀI LIỆU THAM KHẢO 20000000000000000000000000000000000000000000000000000000000000000000000006060000606066

DANH MỤC HÌNH

Hình 1-1: Logo ứng dụng NOfIOII (6 199 TH HH nh nành 8 Hình 1-2: Logo ứng dụng 'Ïa1O c1 31211112111 1 1118111181111 1118111811 1v rệt 9 Hình 1-3: Logo ứng dụng Redmine - - c2 3221121112113 re, 9

Hinh 1-4: Logo backlog in ố 10

Hình 2-1: logo ứng dung Visual Studio Code ee eeeeseeeeeeereesesneeeeeeeeeseeseeatens 13 Hình 2-2: Logo ứng dung Xcode cee eeccecessesssecsseesseeeeseeceseeeeseeseseeeeseeeeneeseneeeenees 14 Hình 2-3: Logo ứng dung Android Studio cc ecceccceseesseesseesseenseeseeeeeeeeseeeseeeas 15

Hinh 2-4: Logo Github 0n 16

Hình 2-5: Logo BitbucK€L ĩ1 19 Tnhh nàng HH nh nàn 17 Hình 2-6: Logo ứng dụng PoSfan - c 3322113311113 1 181111111111 rek 18 Hình 2-7: Logo ứng dụng FIØima ¿+ 22c 2221322112111 errke 19 Hình 2-8: Logo React va Fram€eWOTK7 - + 3+1 E32 133 EEEEErsrirerrrrkrrreererrke 20 Hinh 0200.000, rrrdRdđđaada).- 21

Hình 2-10: NodeJs va ExpressSS cccccccccccsccsseesscesesscessesseeeseceseesseeseesseeeseeseeeseeneeens 22 Hinh 2-11: MongoDb.u cceeccecccecccesecsceesseeneceseessecesecsseeeeeseesseeeseceseeesecneeeeseeesseees 22

Hình 2-12: JavaScript và TypeScript cccccceccecccesccescceseeeeceseeseeeseeseeeeeeeeeeaeeeeeens 23 Hình 2-13: Firebase cloud S€TVIC€S - c1 2112111111111 12 119 1 1 1 1k vn nưệt 24 Isi]i021E 5010 (c0I900 1111577 25

0 ):021n5180) i21) 11 26

Hình 2-16: Chatbot GPT — OpenẠ - ¿2c +: + S112 3112 1191111111111 1k rtke 27

Hình 2-17: Trọng số Weighted Topic Matrix - 2 + scxeE2E2E2Ecrxerxerkrree 31Hình 2-18: Độ phù hop và tương đồng của các chủ đề - ¿5c s+cs+csse2 32Hình 3-1 Sơ đồ Usecase tồn hệ thống - + 2 2 £+E£EE£EE+EE2E2EtEEeEEerxzrerree 36Hình 3-2 Sơ đồ kiến trúc tổng thỂ 2 ©2¿22S2E22EE2212211221222122112212221 22 79Hình 3-3 Sơ đồ kiến trúc ứng dụng đi động - 2: ©-2+++2++zx++zxzzxcrxree 81Hình 3-4: Man hình đăng nhập (c1 22112111211 1111111 1111118118111 E1 ke 87

Hình 3-5: Man hình dang ký - Ác 12.11211111 111119111111 111111 giết 87 Hình 3-6: Man hình xác thực emalÏ - ccccceessssccccessssssescccssessssesecessesssseeees 87

Hình 3-7: Màn hình cung cấp thông tin - ¿+ sSE+S2+E2E£EEEEEEEE2EE2EEEerkerkrree 87Hình 3-8: Man hình quên mật khau - 2-22 2++2+x++££+E+£+EE+zE++zx+zzxzrzeex 88

Hình 3-9: Màn hình danh sách các ghi chú 6 6 + St sieseeerkesrske 88

Hình 3-10: Màn hình ghi chú văn bản c2 2221121123111 88

Hình 3-11: Màn hình ghi chú hình vẽ ¿c2 2c 322112132 EEEExEeersrsrsree 88Hình 3-12: Màn hình ghi chú chỉ tiẾt 2-52 522S22EE2E££EE2EEtEEEvEEzrxrrrree 89

Hình 3-13: Màn hình danh sách mẫu ghi chú -. ¿2 + ++5++szx+zxzz+zz+zs+2 89

Hình 3-14: Màn hình danh mục phân 10a cece cecceesceeeseeeeseeeeseeeeeeeeneeeeeeeenees 89

Hình 3-15: Màn hình danh sách nhắc nhở 2: 2 225£22E+£E+£EtzEzE+zz+zzxrred 89

Hình 3-16: Man hình tạo nhắc nh0 ecssesscssseessssseeesssseesessseeseesneeseesnneeeessneesen 90

Hình 3-17: Màn hình danh sách thông báo càng ưg 90

Hình 3-18: Màn hình thống kê tiến độ của cá nhân người dùng 90

Hình 3-25:Màn hình danh sách công vIỆC - - +32 S++*+kEsksrrrsrrererrke 92

Hình 3-26: Màn hình công việc chỉ tiẾt - 2-5-2 2+S£2E£+E££E£EESEE2EE2ErEerxerxrree 92

Hình 3-27: Màn hình bình luận công VIỆC - c2 2221322332 Evssirserrsrrsree 92

Hình 3-28: Màn hình trò chuyện nhóm - +52 32+ **+*E+‡EEseEEeereeereerreerrses 93

Hình 3-29: Màn hình ghim tin nhắn 2-52 2 S+SE2EE2EE+E£EE£EE2EE2EE2EerEerxerxrxee 93

Hình 3-30: Màn hình quản lý thành viên - . c2 3211133 EEErssreree 93 Hình 3-31: Màn hình thông tin thành viên - - 5c 22c 3+ EEsexeeresrrssrsree 93 Hình 3-32: Màn hình danh sách file - c1 9H ng hưệp 94

Hình 3-33: Màn hình đánh giá thành viên SH HH nh ưp 94

Hình 3-34: Màn hình đánh giá chỉ tiẾt ¿5-2 52SE2E22EEEEEEEEEEEE2EEEEEkerkrrkrree 94

Hình 3-35: Màn hình cài đặt dự án - . 2 5 2222112122311 52111251 kererre 94

Hình 3-36: Màn hình cột mốc dự án ¿2 St St+E+E£EEEEEE+EEEEEEEESEEEEEErEeErrrrrsree 95Hình 3-37: Màn hình nhắc nhở công việc - 2-2 2s+E+2E++E++E++Exzrxerxrrez 95

Hình 3-38: Màn hình hoạt động dự án 2 5c 3+3 3S re 95 Hình 3-39: Màn hình Gantt Car 5 5 0 2112113311311 E511 81 1 vn ng Hiệp 95

DANH MỤC BẢNG

Bảng 2-1: Tập dữ liệu chủ đề các công việc của một thành viên - 29

Bảng 2-2: Input Member Ratings - - 2c 2c 12221113 1113 1119111811181 1 811 8x re, 30 Bảng 2-3: Tập đặc frưng - -.cc c1 1n 1111111111111 11111111111 HH HH HH rệt 30 Bảng 2-4: Độ phù hợp với công VIỆC - - - :+S * S12 2 11 1111111111111 1111111 Exer 31 Bang 2-5: Mã hoá công việc bằng One-hot encoding cccscsssesssesseessesstesseesseesseees 31 Bảng 3-1 Bảng mô tả Actors của Ung Ụng - - c n1 1S re 37 Bảng 3-2 Bảng mô tả các Actors trong dự án -. c c St sissirsrrssrrree 37 Bảng 3-3 Bảng danh sách và mô tả các Use case của ứng dụng 37

Bảng 3-4 Bảng đặc tả chỉ tiết chức năng đăng ký - A001 -2 5:-5 40 Bang 3-5 Bang đặc ta chỉ tiết chức năng đăng nhập - A002 2 5552552 41 Bảng 3-6 Bảng đặc tả chi tiết chức nang khôi phục mật khẩu - A003 42

Bảng 3-7 Bảng đặc tả chỉ tiết chức năng đổi mật khẩu - A004 - 43

Bảng 3-8 Bảng đặc tả chi tiết chức năng ghi nhớ tài khoản - A005 43

Bang 3-9 Bảng đặc ta chỉ tiết chức năng cập nhật thông tin cá nhân - A006 44

Bang 3-10 Bang đặc tả chi tiết chức năng quản lý ghi chú - N001 - 45

Bang 3-11 Bang đặc tả chỉ tiết chức năng sử dụng mẫu ghi chú có sẵn - NO02 46

Bang 3-12 Bảng đặc ta chi tiết chức năng phân loại ghi chú - N003 - 47

Bang 3-13 Bang đặc tả chi tiết chức năng quản lý phân loại - N004 - 48

Bảng 3-14 Bảng đặc ta chỉ tiết chức năng tìm kiếm ghi chú - N005 49

Bang 3-15 Bang đặc tả chỉ tiết chức năng quản lý lời nhắc — R001 50

Bảng 3-16 Bảng đặc tả chi tiết chức năng quản lý dự án - P001 - 51

Bang 3-17 Bảng đặc ta chỉ tiết chức năng quản lý thành viên - P002 - 52

Bang 3-18 Bang đặc ta chi tiết chức năng quản lý công việc - P003 54

Bảng 3-19 Bảng đặc ta chỉ tiết chức năng quản lý bình luận - P004 55

Bảng 3-20 Bảng đặc ta chỉ tiết chức năng quản lý tài liệu, mô tả - P005 56

Bang 3-21 Bảng đặc ta chi tiết chức năng trò chuyện nhóm — P006 - 57

Bang 3-22 Bang đặc tả chi tiết chức năng quản lý tệp tin - P007 -. 5- 58 Bảng 3-23 Bang đặc tả chỉ tiết chức năng thống kê, báo cáo — P008 59

Bang 3-24 Bảng đặc ta chi tiết chức năng quản lý cột mốc - P009 60Bang 3-25 Bang đặc tả chỉ tiết chức năng quản lý hoạt động - P010 61

Bảng 3-26 Danh sách các thuộc tính " S€T”” 6 xxx * +3 ki reerreererrke 69

Bảng 3-27 Danh sách các thuộc tính của "Verify Code'”” ccccscscxssssss 70 Bảng 3-28 Danh sách các thuộc tính của "Nof€” - ¿ c + s2 SE skEssrrsrrrses 70

Bảng 3-29 Danh sách các thuộc tính của "Caf€BOTY”” - ccc c series 71 Bang 3-30 Danh sách các thuộc tính cua "Reminder” - «+ s++xxseeseesxes 71 Bảng 3-31 Danh sách các thuộc tính của "Project" oo ee ecccccesceeeseeeeteeeeteeeeteeeeseees 72 Bảng 3-32 Danh sách các thuộc tính của "WIKI” - c cv vs sisrsrrrree 73 Bảng 3-33 Danh sách các thuộc tính của "ACfIVIẨY” cv nh hy Hg 73 Bảng 3-34 Danh sách các thuộc tính của "Milestone"” -cscc+csecsereeree 74 Bảng 3-35 Danh sách các thuộc tính của "EIÏ€'” c + c1 E+sEeeeereeeerees 74 Bảng 3-36 Danh sách các thuộc tính của "Message€'” -s-csccssssserxssresreses 75 Bảng 3-37 Danh sách các thuộc tính của '" TaSk” .s+scs + x+kEseeserreeresresee 76 Bảng 3-38 Danh sách các thuộc tính của "Commefnf” « «+ +s£+s++exseesxs 77

Bảng 3-39 Danh sách các thuộc tính của "Notificafion'” s++ss<++s<+<sss<s2 77

Bảng 3-40 Danh sách các thuộc tính của "Task R€VI€W”” -.-cscccsscxssssereses 78 Bang 3-41 Danh sách các thuộc tính “Recommend Assignee” - ‹-+› 79 Bảng 3-42 Danh sách các màn hình của ứng dụng - +++s++++++ex+sex+sx2 83

Bảng 3-43 Testcase chức năng "Đăng ký” - -.c Sc t1 v12 1 1 1x ri 97

Bảng 3-44 Testcase chức năng "Đăng nhập” - + c 33+ EEEseresrserrsrrssee 99

Bang 3-45 Testcase chức năng "Quên mật khẩu" - 2+ s+2z++cz+zxsrxerxersez 100

Bảng 3-46 Testcase chức năng "Tao ghi chúÚ'” - c5 S3 x+sveteeerseeereeesrs 102 Bảng 3-47 Testcase chức năng "Tao remInnid€T”” s5 s + ++svexseesesereese 104

Bảng 3-48 Testcase chức năng "Tạo dự áñ” - - + cc cv vn nrteiresrerves 105

Bảng 3-49 Testcase chức năng "Tạo công VIỆC)” - +: + s*sstskrsrerrrerreree 106

DANH MỤC TU VIET TAT

STT | Từ viết tat Giải thích

1 |AI Artificial Intelligence

2 | API Application Programming Interface

3 | ChatGPT Chat Generative Pre-training Transformer

4 |CDN Content Delivery Network

5 |DB Database

6 |DOM Document Object Model

7 |ERD Entity Relationship Diagram

8 | HTTP(s) Hypertext Transfer Protocol (security)

9 |IDE Integrated Development Environment

10 | JS JavaScript

II | LLMs Large Language Models

12 | MST MobX State Tree

13 | UML Unified Modeling Language

14 | UC Usecase

15 |UI/UX User Interface/User Experience

16 | SQL Structured Query Language

17 | SMTP Simple Mail Transfer Protocol

18 | SDK Software Development Kit

19 | SSL Secure Sockets Layer

20 |TS Typescript

TÓM TẮT KHOÁ LUẬN TÓT NGHIỆP

Với đề tài "Xây dựng ứng dụng ghi chú, quản lý tiến độ công việc cá nhân và

nhóm", ứng dụng nhằm mục đích cung cấp một nền tảng cho người dùng ghi chú và

quản lý công việc cá nhân cũng như công việc nhóm một cách dễ dàng và hiệu quả.

Người dùng có thể tạo ghi chú, thêm các công việc, đặt thời hạn, phân loại, thực hiệntheo dõi tiên độ va chia sẻ công việc với các thành viên trong nhóm.

Phía front-end, đề tài sử dụng Framework7, một framework di động được xây

dựng dựa trên HTML, CSS và JavaScript Framework7 cung cấp các thành phần giao

diện sẵn có và khả năng tương thích với React, một thư viện JavaScript phô biến choviệc xây dựng giao điện người dùng tương tác Kết hợp giữa framework7 và Reactgiúp tạo ra một giao diện thân thiện, trực quan và linh hoạt cho ứng dụng.

Phía back-end, dé tài sử dụng Node.js, một môi trường chạy mã JavaScript phíamáy chủ, và Express, một framework ứng dụng web đề xây dựng các API và xử lýcác yêu cầu từ phía máy khách Sử dụng Node.js và Express giúp xây dựng một cơ

sở dit liệu và các API dé quản lý ghi chú và công việc, lưu trữ thông tin và cung cấp

chức năng tương tác với phía front-end.

Tóm lại, dé tài nhằm xây dung một ứng dụng di động ghi chú và quản lý côngviệc cá nhân và nhóm, sử dụng framework7 kết hợp React cho phan giao diện người

dùng va Node.js kết hop Express cho phần xử lý logic phía máy chủ Ứng dụng nay

giúp người dùng dé dàng tạo, quản lý và chia sẻ công việc cá nhân va công việc nhóm.

Nội dung khoá luận tốt nghiệp được trình bày trong 4 chương:

— Chương 01: Tổng quan

Trình bày sơ lược và lý do thực hiện đề tài

Xác định phạm vi, mục tiêu mà đề tài hướng tới Trình bày hiện trạng, đưa ra

giải pháp cũng như hướng giải quyết tối ưu

— Chương 02: Kiến thức nền tảng

Giới thiệu các tính năng, công thức, giải thuật cũng như những công nghệ được đưa vào khoá luận.

— Chương 03: Xây dựng ứng dung

Phân tích yêu cầu, thiết kế, hiện thực và triển khai ứng dụng

— Chương 04: Kết luận

Trình bày những thuận lợi, khó khăn trong thời gian thực hiện nghiên cứu, xây

dựng đề tài và hướng phát triển trong tương lai

Kết luận

CHƯƠNG 1: TONG QUAN

1.1 Giới thiệu đề tài

Trong thời đại số hóa hiện nay, ghi chú đã trở thành một phần quan trọng củacuộc song hàng ngày Tuy nhiên, việc quan lý va theo dõi ghi chú trên nhiều nền tang

và thiết bị có thé trở nên khó khăn Mục tiêu của khoá luận này là xây dựng một hệ

thống quản lý ghi chú đơn giản và linh hoạt, giúp người dùng tổ chức và truy cập ghichú một cách hiệu quả, nhanh chóng thông qua chiếc smartphone của mình

Trong quá trình nghiên cứu, chúng em đã tiên hành các thử nghiệm Trước tiên, chúng em đã xem xét các ứng dụng và công cụ ghi chú hiện có trên thị trường đê hiêu

rõ về các tính năng và ưu điêm của chúng Sau đó, phân tích các yêu câu và nhu câu của người dùng trong việc quản lý ghi chú.

Dựa trên các nghiên cứu và phân tích trên, chúng em đã lên ý tưởng thiết kế vàtriển khai một hệ thống kết hợp các tính năng ghi chú với các tính năng quản lý côngviệc cho một nhóm, tô chức thành một ứng dụng trên điện thoại di động giúp ngườidùng có thé linh hoạt quản lý được cả công việc cá nhân và nhóm trên cùng một hệthống Ngoài ra, nó cũng cung cấp tinh năng nhac nhở và phân loại ghi chú dé giúp

người dùng tô chức công việc một cách hiệu quả, duy trì sự sắp xếp trong cuộc sống

hàng ngày.

1.2 Lý do chọn đề tài

Ghi chú là một phần không thể thiếu trong cuộc sống hàng ngày của chúng ta

Hầu hết mọi người sử dụng ghi chú để ghi lại thông tin quan trọng, tạo danh sách

công việc hoặc ghi chú ý tưởng Từ đó, tạo ra một hệ thống quản lý ghi chú hiệu quả

có thê đáp ứng nhu cầu người dùng

Công nghệ thông tin đang phát triển mạnh mẽ và đã tạo ra nhiều công cụ và ứngdụng quản lý thông tin cá nhân Áp dụng công nghệ thông tin vào quản lý ghi chú cóthể cung cấp một cách tiện lợi, linh hoạt và hiệu quả dé tổ chức va truy cập ghi chú

Mặc dù có nhiều ứng dụng ghi chú hiện có trên thị trường, nhưng vẫn còn những

thiếu sót và hạn chế Một số ứng dụng quản lý ghi chú không đủ linh hoạt hoặc không

cung cấp day đủ tính năng dé đáp ứng nhu cầu đa dạng của người dùng Do đó, việcnghiên cứu và phát trién một hệ thống quản lý ghi chú tốt hơn có thé mang lai lợi íchcho người dùng.

Và cudi cùng là sự kết hợp giữa quan lý và ghi chú, Quản lý ghi chú không chỉđơn thuần là việc ghi lại thông tin, mà còn liên quan đến việc tô chức, tìm kiếm vàtheo dõi các ghi chú Việc nghiên cứu cách kết hợp quan lý công việc và ghi chú trongmột hệ thống có thé mang lại giá tri gia tăng cho người ding Giúp người dùng vừađạt được mục tiêu cá nhân mà bên cạnh đó cũng có thé theo dõi được tiến độ côngviệc của thành viên trong nhóm.

1.3 Mục tiêu

Ứng dụng được xây dựng với mục tiêu tạo ra giao diện người dùng thân thiện

và dễ sử dụng dành cho hệ thống quản lý ghi chú Điều này giúp người dùng có thêmthiện cảm và tạo thói quen ghi chú công việc, bên cạnh đó cũng có thể quản lý côngviệc cùng nhau.

Cung cấp tính năng linh hoạt và đa dạng, các tính năng như tạo danh sách côngviệc, tạo danh mục phân loại, đặt lịch nhắc nhở, quản lý các tài liệu, liên lạc trao đôi

trực tiếp với nhau thông qua chatbot Điều này giúp người dùng tô chức công việc,

theo dõi tiên trình và tăng cường hiệu suât làm việc.

Ngoài những mục tiêu về tính ứng dụng, việc nghiên cứu, thực hiện đề tài góp

phần phát triển vào khả năng tự học, tự nghiên cứu, mong muốn được trau dồi thêmkiến thức mới, tiếp thu những tiến bộ về kỹ thuật, bắt kịp xu hướng công nghệ trong

thời đại kỹ thuật 4.0 hiện nay.

— Note Management (Tìm kiếm, thêm, xoá, cập nhật, ghi chú loại chữ và ghi chú

loại vẽ, tạo template, ghim, phân loại, tạo danh mục phân loại)

— Reminder Management (Thêm, xoá, cập nhật, đặt thông báo lặp lại theo ngày,

tuân, tháng, năm, hiên thi reminders và các tasks được assign cho người dùng

trên màn hình calendar và màn hình timeline)

— Project Management (Tìm kiém, thêm, xoá, cập nhật):

+ Wiki Management (Thêm, xoá, cập nhật các mô tả, những thông tin, tai

liệu cho dự án, nhập thông tin từ ghi chú có sẵn)

Task Management (Tim kiếm, thêm, xoá, cập nhật, ghi nhận lịch sử thay

đối, lưu trữ thông tin tiến độ, có đề xuất thành viên phù hợp với công việc

dựa vào chủ đề áp dung Content-based Recommendation System)Comment Management (Thêm, xoá, cập nhật, trao đối thông tin trong mỗitask giữa các thành viên, tag tên và thông báo đến các thành viên)

Update History Management (Tự động lưu trữ các cập nhật khi các thôngtin của task được thay đôi từ người dùng)

Member Management (Thêm, xoá, phân quyền cho các thành viên trong

dự án, giao việc cho thành viên, xem hồ sơ của thành viên)

Chat Group, Chatbot (Trò chuyện thời gian thực giữa các thành thành viên

và kết hợp chatbot OpenAI)File Management (Thêm, xoá, cập nhật các file với nhiều định dạng khác

nhau)

Weekly Report Management (Biểu đồ phân tích thống kê hoạt động của

dự án và các thành viên, từ những thông tin được lưu trữ thông qua tiễn độ

làm việc trên các task của các thành viên, tính toán thê hiển tổng quan tiến

độ hiện tại của các công việc và các thành viên có trong tuần, thông tin tiến

độ chỉ tiết của các thành viên)Personal Progress Management (Thống kê các công việc, các nhắc nhở hiện

có và đã hoàn thành trong tuần, hiển thị thời gian, tiến độ hiện tai)

App Setting Management (Cập nhật thông tin cá nhân, cai đặt ghi nhớ tai

khoản cho lần đăng nhập tới, cài đặt cho thông báo đến người dùng, tính năng

hỗ trợ người dùng)

Notification Management (Gửi thông báo đến người dùng khi có thông báo)

Phương pháp thực hiện

Nghiên cứu, tham khảo và tìm hiểu những phương pháp đã có, so sánh ưu

điểm, nhược điểm dé chon ra các công cu và công nghệ phù hợp

Kế thừa những tính năng có sẵn, từ đó phát huy dựa trên các yếu tố đã tìm

được phù hợp với dé tai, đưa ra giải pháp tốt nhất và lên ý tưởng phát trién

Nâng cấp và sáng tạo hơn trong cách xử lý, cách nhìn nhận dưới vai trò là một

người dùng ứng dụng.

Chia nhỏ các công việc dé thực hiện theo từng giai đoạn, quản lý công việc

trong thư mục lớn dé dễ dàng đánh giá tiễn độ, tạo kế hoạch làm việc theo từngmốc thời gian cụ thể và review chéo sau khi kết thúc một giai đoạn và chuẩn

bị kế hoạch cho bước tiếp theo

Áp dụng mô hình tiếp cận lặp (Iterative Model) trong quá trình thực hiện và

xây dựng ứng dụng Một chuỗi quá trình thực hiện sẽ được lặp đi lặp lại từ lúc

bắt đầu đến khi hoàn thành sản phẩm và báo cáo, sau mỗi chu kỳ sẽ có kết quảcủa quá trình đó, tiếp theo thực hiện review sau mỗi giai đoạn cho đến khi cósản phâm cuôi cùng.

— Biết sử dụng các công cụ dé phát triển, hỗ trợ trong quá trình thực hiện dự án.

— Ứng dụng có độ hoàn thiện cao, đáp ứng đủ các yêu cầu đã đề ra, người dùng

có thé sử dụng ngay lập tức

— Giao diện thân thiện, đem lại trải nghiệm tốt với người dùng, dễ sử dụng

— Tài liệu và quá trình làm việc được ghi lại day đủ và rõ ràng đáp ứng cho việc

cải tiễn và sửa lỗi sau này, có thê được kế thừa bởi những người sau

1.7 Hiện trạng bài toán

Hiện trạng của đề tài "Quản lý và ghi chú" là một lĩnh vực có nhiều ứng dụng

và công cụ hiện có Có rất nhiều ứng dụng di động và hay các phần mềm máy tính đãđược phát triển để hỗ trợ quản lý ghi chú Một số ứng dụng phố biến bao gồmEvernote, OneNote, Google Keep, Apple Notes hoặc ké đến các ứng đa nền tảng như

Notion, Trello và còn nhiều ứng dụng khác.

Các ứng dụng hiện có thường cung cấp các tính năng như tạo ghi chú văn bản,gan kết hình ảnh và tệp tin, sắp xếp ghi chú theo danh sách hoặc thẻ, và đôi khi cung

cấp tính năng đồng bộ hóa và chia sẻ Một số ứng dụng cũng cung cấp tính năng nhắc

nhở và tích hợp với các công cụ khác như lịch và email.

Tuy nhiên, mặc dù có nhiêu ứng dụng hiện có, vẫn còn một số hạn chế và thiếu

sót Một sô ứng dụng có thê hạn chê tính linh hoạt trong việc tô chức và phân loại ghi chú Ngoài ra, cũng có thê xảy ra van đê vê bảo mật và quyên riêng tư của dữ liệu ghi

chú khi sử dụng các ứng dụng của bên thứ ba.

Do đó, việc nghiên cứu và phát triển một hệ thống quản lý ghi chú tốt hơn kếthợp với việc quản lý công việc theo nhóm trên cùng một ứng dụng mà không cân

thông qua bat kỳ trung gian nao vẫn có thé tạo nên một giá trị tốt Mục tiêu là cungcấp một giải pháp linh hoạt, an toàn và dé sử dụng hơn, đáp ứng các nhu cầu đa dang

của người dùng và giúp tăng cường hiệu suất làm việc và tổ chức thông tin cá nhân

Hình 1-1: Logo ứng dung Notion"“

Ứng dụng Notion!'®! là một công cụ quản lý thông tin linh hoạt và đa năng

Notion cung cấp một giao diện dễ sử dụng và mạnh mẽ cho người dùng tô chức, ghi

chú, va làm việc với thông tin.

Notion cho phép người dùng tạo ra các trang và bảng, t6 chức chúng vào danhmục và chủ đề khác nhau Có thê tạo ghi chú văn bản, bảng tính, danh sách công việc,sắp xếp hình ảnh và tệp tin, và thậm chí nhúng các nội dung từ các nguồn bên ngoàinhư video, trang web, hay file âm thanh Bên cạnh đó, có thể tạo các mục con, đặt

thẻ, gắn kết liên kết giữa các trang và tạo mối liên kết logic giữa chúng Điều này

giúp tạo ra một mô hình tô chức thông tin phù hợp với nhu cầu cá nhân hoặc công

VIỆC.

Notion cũng hỗ trợ tính năng chia sẻ và làm việc nhóm, cho phép mời thành

viên khác tham gia và cùng chỉnh sửa nội dung Có thể tạo các dự án chung, giaonhiệm vu, và theo dõi tiền trình làm việc

Tính linh hoạt và khả năng tùy chỉnh cao làm cho Notion trở thành một công cụ

hữu ích cho nhiều mục đích, từ quản lý công việc cá nhân, ghi chú học tập, tới quản

lý dự án và hợp tác nhóm.

1.7.1.2 Taio — Markdown Editor

Hình 1-2: Logo ứng dung Taio"!

Một ứng dung hiện dai để xử lý văn ban (Markdown) trên iPhone, iPad và Mac,mang đến trải nghiệm liền mach cho các quy trình công việc văn bản, chỉnh sửa đánh

dau và bang tam Mặc dù độ phố biến của nó không được cao nhưng những tính năng

mà nó mang lại rất hữu ích cho một số ngành nghề đặc trưng

Ngoài ra Taio"! còn có thể quản lý từ các file từ những file riêng lẻ cho đến thư

mục giúp người dùng dễ dàng sắp xếp và quản lý ghi chú hiệu quả hơn Đối với phiênbản nâng cấp Taio sẽ cung cấp thêm nhiều dạng template và tính năng hữu ích hơn

để người dùng có thể sử dụng Taio như một ứng dụng ghi chú với các tính năng độcđáo nhất phù hợp với nhu cầu và tính chất công việc

1.7.1.3 Redmine - Flexible Project Management

chức và quản lý các dự án, theo dõi công việc, quản lý tài liệu, và giao tiếp trong

một môi trường làm việc tập trung.

Dưới đây là một số đặc điểm chính và tính năng của Redmine:

— Quản lý dự án: Redmine cho phép tạo và quản lý các dự án Có thê thiết lập

lịch trình, quản lý thành viên, giao nhiệm vụ, và theo dõi tiến độ dự án

— Theo dõi công việc: Redmine cung cấp các công cụ dé theo dõi và quản ly

công việc Có thể tạo và gán công việc cho các thành viên trong nhóm, theo

dõi tiến độ, đặt thời hạn và ưu tiên công việc

— Quản lý tài liệu: Redmine cho phép tạo và quản lý tai liệu trong các dự án Có

thể tạo wiki, đính kèm tệp tin, và chia sẻ thông tin với thành viên khác trong

dự án.

— Giao tiếp và phản hồi: Redmine cung cấp các công cụ giao tiếp và phản hồi

bên trong dự án Có thé tạo cuộc thảo luận, bình luận và theo dõi lịch sử thayđổi

— Theo dõi van đề: Redmine cho phép theo dõi và quan lý các van dé và lỗi Có

thé tao và gan van dé, theo dõi tiến độ giải quyết, và giao tiếp với các thành

viên khác trong nhóm.

— Tính linh hoạt và tùy chỉnh: Redmine có một cau trúc linh hoạt và cho phép

tùy chỉnh các tính năng và giao diện theo nhu câu cụ thê của dự án.

Redmine đã trở thành một công cụ phô biến trong việc quản lý dự án và pháttriển phần mềm Nó có cộng đồng người dùng rộng lớn và liên tục được cập nhật vàphát triên đê đáp ứng nhu câu của các dự án khác nhau.

1.7.1.4 Backlog - ProJect Management

Dưới đây là một số đặc điểm và tinh năng chính của Backlog iOS:

— Quan lý dự án: Backlog iOS cho phép tạo và quản lý các dự án Có thé đặt tên,

mô tả và thiết lập các thông số khác cho dự án của mình

— Tạo và giao nhiệm vụ: Có thể tạo và gan các nhiệm vụ cho thành viên trong

dự án Có thể đặt thời hạn, ưu tiên, gắn kết tệp tin và ghi chú cho từng nhiệm

vụ.

— Theo dõi tiễn độ: Backlog iOS cung cấp các công cụ và tính năng dé theo dõi

tiễn độ công việc Cho phép thay đổi và cập nhật trang thái của từng chỉ tiếtcông việc, đánh dấu và ghi lại thời gian đã dùng

— Giao tiếp và phản hồi: Backlog iOS cho phép gửi và nhận các bình luận, thông

báo và phản hồi về công việc và dự án Điều này giúp tăng cường sự giao tiếp

và hợp tác giữa các thành viên trong nhóm.

— Lịch trình và biểu đồ: Có thé xem lịch trình công việc và du án trên Backlog

iOS Nó hién thị biểu đồ Gantt và các công cụ khác dé giúp theo dõi tiến độ

và lập kế hoạch

— Tích hợp với phiên ban web: Backlog iOS có thể tích hợp và đồng bộ dữ liệu

với phiên bản web của Backlog, cho phép truy cập và cập nhật công việc từ cả

hai nên tảng.

Backlog iOS là một công cụ hữu ich cho việc quản ly dự án và công việc trên

các thiết bị đi động iOS Nó cung cấp tính năng linh hoạt và tiện lợi để theo đõi và

tổ chức công việc, tăng cường giao tiếp và hợp tác giữa các thành viên trong dự án

1.7.2, Đánh giá hiện trạng và hướng giải quyết

1.7.2.1 Đánh giá hiện trạng

Hiện nay, có rất nhiều ứng dụng và công cụ hiện có đã được phát triển dé hỗ trợ

quản lý công việc và ghi chú.

Trong lĩnh vực quản lý công việc, có nhiều ứng dụng như Asana, Trello, Jira,

Microsoft Project, và nhiêu công cụ khác Cac công cụ này cung cap các tính năngnhư tạo và giao nhiệm vụ, theo dõi tiến độ, quản lý tài liệu và giao tiếp giữa các thành

11

viên trong dự án Một số công cụ cũng cung cấp tính năng lập kế hoạch, biểu đồGantt, và tích hợp với các công cụ khác như email và lịch.

Trong lĩnh vực quản lý ghi chú, có nhiều ứng dụng như Evernote, OneNote,

Google Keep, Apple Notes và nhiều ứng dụng khác Các ứng dụng này cho phép tạo

ghi chú văn bản, gắn kết hình ảnh và tệp tin, sắp xếp ghi chú theo danh sách hoặc thẻ,

và đôi khi cung cấp tính năng đồng bộ hóa và chia sẻ Một số ứng dụng cũng có tínhnăng nhac nhở và tích hợp với các công cụ khác như lịch và email.

Tuy nhiên, mặc dù có nhiều ứng dụng và công cụ hiện có, vẫn còn một số hạn

chế và thiếu sót Một số ứng dụng có thể hạn chế tính linh hoạt trong việc tô chức vàphân loại công việc hoặc ghi chú Điều này tạo cơ hội cho việc nghiên cứu và pháttriển các hệ thống quản lý công việc và ghi chú tốt hơn Tích hợp thêm các tính năngđáp ứng các nhu cầu đa dạng của người dùng, phù hợp với mục đích của từng ngànhnghề và giúp tăng cường hiệu suất làm việc và tô chức thông tin cá nhân

1.7.2.2 Hướng giải quyết

ĐỀ giải quyết thực trạng trong việc quản lý công việc và ghi chú, có một số

hướng tiếp cận có thể được áp dụng như sau:

— Tiếp tục nghiên cứu và sử dụng các công cụ quản lý công việc và ghi chú hiện

có dé tìm ra công cụ phù hợp với nhu cầu, song song đó xem xét các tính năng,khả năng tùy chỉnh và tích hợp để đem vào phát triển

— Tạo sự liên kết giữa các công cụ quản lý công việc và ghi chú khác nhau dé

tận dụng lợi ích của từng công cụ.

— Nắm vững các phương pháp và kỹ thuật quản lý công việc và ghi chú hiệu

quả.

12

CHƯƠNG 2: KIEN THỨC NEN TANG

2.1 Công cụ quản ly và phát triển

2.1.1 Visual Studio Code

Hình 2-1: logo ứng dung Visual Studio Code”"!

[21

Trình soạn thảo mã nguồn mở Visual Studio Code"! được phat triển bởi

Microsoft Nó được thiết kế dé hỗ trợ biên tập và soạn thảo mã nguồn cho các dự án

phần mềm VS Code hỗ trợ nhiều ngôn ngữ lập trình và công nghệ, giúp người dùng

tuỳ chỉnh môi trường làm việc theo nhu câu của cá nhân.

Tính năng nồi bật:

Hỗ trợ đa nền tảng: giúp các lập trình viên có thể sử dụng trên hầu hết các hệ

điều hành hiện có

Tích hợp debug: Cung cấp các tính năng debug mạnh mẽ, cho phép theo dõi

và gỡ lỗi một cách hiệu quả.

Hỗ trợ Git: tích hợp san với Git, quản lý mã nguồn với các lệnh thực thi Git

một cách dễ dàng.

Syntax Highlighting: làm nỗi bật cú pháp giúp lập trình viên nhận biết các

thành phần khác nhau dễ dàng hơn.

Autocomplete: cung cấp tính năng tự động hoàn thành mã thông minh

(IntelliSense) giúp giảm thời gian soạn thảo và giảm sau sót.

Snippets: là các đoạn mẫu có thể sử dụng nhanh chóng và tái sử dụng để tănghiệu suất lập trình

Tuy chỉnh chủ đề và phím tắt: cho phép thay đôi giao diện bang cách chọn chủ

dé khác nhau, cá nhân hoá phím tat đề thích nghỉ với quy trình làm việc

13

Nhờ vao tính linh hoạt và khả năng mở rộng thông qua các tiện ích va plugin,

VS Code đã trở thành một trong những trình soạn thảo mã phô biến và được yêu thích

trong cộng đông lập trình viên

2.1.2 Xcode

Hình 2-2: Logo ứng dung Xcode!””!

Xcode!!! là một môi trường phát triển tích hợp (IDE) do Apple cung cấp, được

thiết kế đặc biệt dé hỗ trợ lập trình viên trong việc phát triển các ứng dụng cho hệđiều hành của Apple, bao gồm macOS, iOS, tvOS và watchOS IDE này cung cấpmột loạt các công cụ và tài nguyên phong phú, giúp nhà phát triển tạo ra các ứng

dụng di động va máy tính các nhân với chat lượng cao và hiệu suất tôi ưu.

Xcode đi kèm với trình biên dịch Swift, ngôn ngữ lập trình chính được sử dụng

dé phát triển ứng dụng trên các nền tang của Apple Ngoài Swift, Xcode cũng hỗ trợObjective-C, ngôn ngữ lập trình truyền thống của Apple

Xcode cung cấp giao điện người dùng trực quan và đa chức năng cho việc xây

dựng ứng dụng, bao gồm trình soạn thảo mã, trình biên dịch, trình gỡ lỗi, quản lý

phiên bản, và mô phỏng màn hình Nó cũng đi kèm với một bộ công cụ phong phú

dé phân tích, kiểm tra và tôi ưu hóa ứng dụng

Với Xcode, người dùng có thé phát triển ứng dung di động, ứng dụng máy tính

cá nhân, ứng dụng đồng hồ thông minh và ứng dụng truyền hình Xcode hỗ trợ việcxây dựng giao diện người dùng bằng cách sử dụng Interface Builder và hỗ trợ tạo cácchức năng phức tap bang việc sử dụng các framework của Apple

Tom lại, Xcode là một IDE mạnh mẽ và linh hoạt cho phat triển ứng dụng trêncác nên tang của Apple, mang lại sự thuận tiện và hiệu quả cho nhà phát triển trongquá trình xây dựng ứng dụng chất lượng cao

14

2.1.3 Android Studio

Hình 2-3: Logo ứng dung Android Studio!

Android Studiol'] là một Integrated Development Environment (IDE) phát triểnứng dụng di động chính thức dành cho nền tảng Android IDE này hỗ trợ và cung cấpnhiều công cụ cũng như có một lượng lớn tài nguyên phong phú, đáp ứng đầy đủ yêucầu của một nhà phát triển ứng dụng di động

Ý tưởng của Android Studio bắt nguồn từ một IDE khá phổ biến dành cho JAVA

là IntelliJ IDEA Nhiều ngôn ngữ lập trình khác nhau được nó hỗ trợ bao gồm Java,Kotlin và C++ Nó cung cấp các tính năng nồi bật như trình gỡ lỗi (debugger), trình

biên dịch (compiler), trình soạn thao (editor), va một loạt các công cụ hữu ích kháctrong việc phát triển ứng dụng android mạnh mẽ với đa đạng các tính năng

Android Studio dựa trên IntelliJ IDEA, một IDE pho biến cho Java, và nó hỗtrợ nhiều ngôn ngữ lập trình khác nhau bao gồm Java, Kotlin va C++ Nó cung cấptrình biên dịch, trình gỡ lỗi, trình soạn thảo mã và một loạt các công cụ phát triểnkhác để tạo ra các ứng dụng Android đa dạng và mạnh mẽ

Một trong những tính năng nỗi bật của Android Studio là Layout Editor, chophép nhà phát triển giao diện người dùng trực quan thông qua kéo và thả các thànhphần Nó cũng cung cấp các công cụ đề kiểm tra và tối ưu hóa hiệu năng ứng dụng,

cũng như quản lý phiên bản và tích hợp dễ dàng với các dịch vụ và thư viện của

Google.

Android Studio cũng hỗ trợ việc triển khai ứng dụng lên các thiết bị di động

thông qua Android Emulator hoặc thiết bị thực Nó cung cấp môi trường phát triển

toàn điện dé phát triển và kiểm thử ứng dụng trước khi phát hành lên Google Play

Store.

15

Tóm lại, Android Studio là một IDE mạnh mẽ và linh hoạt cho phát triển ứng

dụng Android, cung cấp các công cụ và tài nguyên dé tạo ra ứng dung đa dạng, tối

ưu và tương thích trên nền tang Android

2.1.4 Github

Hình 2-4: Logo Github”®

GitHub"! là một nền tang dựa trên web được sử dụng rộng rãi cho việc lưu trữ

mã nguôn và quản lý phiên bản Nó cho phép làm việc cùng nhau trên dự án, theo dõi

sự thay đôi và kiêm soát phiên bản của mã nguôn.

Trên GitHub, người dùng có lưu trữ mã nguồn của dự án thông qua ra các kholưu trữ (repositories) Các kho lưu trữ này có thé được chia sẻ công khai hoặc riêng

tư và có thé được sao chép (fork) bởi người khác dé đóng góp vào dự án

GitHub cung cấp các công cụ quản lý phiên bản linh hoạt, cho phép nhà pháttriển theo dõi sự thay đổi của mã nguồn qua thời gian, xem lịch sử commit và hợpnhất (merge) các thay đồi từ các nhánh (branches) khác nhau Nó cũng hỗ trợ việcquản lý van dé (issue tracking) dé theo dõi, báo cáo và giải quyết các van dé, lỗi hoặc

yêu câu tính năng.

GitHub cũng là một cộng đồng, nơi người dùng có thê tương tác, thảo luận vàđóng góp vào dự án của nhau thông qua các yêu cầu kéo (pull requests) Nó cung cấp

một giao diện web thân thiện, cùng với các tính năng như wiki, dự án, va dam mây

(cloud) dé lưu trữ tài liệu và tệp tin

Tóm lại, GitHub là một nền tảng lưu trữ mã nguồn và quản lý phiên bản mạnh

mẽ và phố biến, được sử dụng rộng rãi trong cộng đồng phát triển phan mềm dé hỗ

trợ việc làm việc nhóm, theo dõi và kiêm soát mã nguồn của dự án.

16

Với Bitbucket, người dùng có thê lưu trữ mã nguồn của dự án thông qua các

kho lưu trữ (repositories) Kho lưu trữ này có thể được chia sẻ công khai hoặc riêng

tư và hỗ trợ nhiều hệ thống quản lý phiên bản như Git và Mercurial

Bitbucket cung cấp các tính năng quản lý phiên bản mạnh mẽ, giúp theo dõi sựthay đổi của mã nguồn, tạo và quản lý nhánh (branches), hợp nhất (merge) các thayđổi và xem lịch sử commit Nó cũng hỗ trợ tính năng quản ly van dé (issue tracking)

đê theo dõi, báo cáo và giải quyêt các van dé và yêu câu tinh năng.

Bitbucket cung cấp tính năng tích hợp liên tục (continuous integration) và liêntục triển khai (continuous deployment), cho phép kiểm tra, triển khai ứng dụng và tựđộng xây dựng từ mã nguồn Nó cũng cung cấp tính năng quản lý quyền truy cập vàkiểm soát, cho phép người dùng quản lý quyền truy cập vào kho lưu trữ và các chức

năng khác.

Bitbucket là một công cụ phô biến trong việc quan ly mã nguồn và làm việcnhóm, cung cấp các tính năng mạnh mẽ và linh hoạt cho quản lý phiên bản, tích hợpliên tục và quản ly van dé trong quá trình phát triển phần mềm

17

2.1.6 Postman

Hình 2-6: Logo ứng dung Postman”?!

Postman"?! là một công cu phát triển API và kiểm thử giao diện ứng dung (APIclient) dựa trên web Nó cho phép nhà phát triển tạo, gửi và kiểm tra các yêu cầuHTTP/HTTPS đến các API và xem phản hồi từ chúng

Postman cung cấp một giao diện người dùng thân thiện, cho phép xây dựng và

tổ chức các yêu cầu API vào các bộ sưu tập (collections) dé dang Có thé tạo yêu cầu

GET, POST, PUT, DELETE và nhiều loại yêu cầu khác, cùng với tham sé, tiêu đề

và thân nội dung tùy chỉnh.

Postman cung cấp tính năng mạnh mẽ dé tùy chỉnh và kiểm tra các yêu cầu API.Người dùng có thé thay đổi các tham số, xem và phân tích phản hồi, kiểm tra hiệusuất, và thậm chí thực hiện các bước kiểm tra tự động bang cách viết các kịch bản(scripts).

Ngoài ra, Postman còn cung cấp tinh năng chia sẻ và hợp tác trong việc làmviệc nhóm Người dùng có thê chia sẻ bộ sưu tập, lưu trữ phiên bản và tương tác vớinhau trên nền tảng Postman Nó cũng tích hợp tốt với các công cụ khác như Git để

quan lý phiên ban của yêu cầu API

Tóm lại, Postman là một công cụ mạnh mẽ và linh hoạt cho phát triển API vàkiểm thử giao diện ứng dụng Nó giúp nhà phát triển xây dựng, gửi và kiểm tra yêucầu API một cách dé dàng, cung cấp tinh năng tùy chỉnh, kiểm tra hiệu suất và chia

sẻ công việc trong quá trình phát triển ứng dụng

18

2.1.7 Figma

Hình 2-7: Logo ứng dụng Figma”*“

Figmal'“ là một công cụ thiết kế giao diện người dùng (UI/UX) dựa trên web,

được sử dụng để tạo và cộng tác trên các thiết kế giao diện ứng dụng và trang web

Với Figma, người dùng có thể tạo ra các bản thiết kế giao diện tương tác và đáp

ứng, từ các phác thảo ban đầu đến các mẫu thiết kế chỉ tiết Nó cung cấp một giao

diện người dùng trực quan và môi trường làm việc linh hoạt cho các nhà thiết kế đểtạo, chỉnh sửa và tô chức các thành phần giao diện, tạo các trạng thái và chuyên động,

và áp dụng các phong cách và hướng dẫn thiết kế đồng nhất

Figma cũng cho phép người ding cộng tác trực tiếp trên cùng một thiết kế Nócung cấp tính năng chia sẻ trực tuyến, cho phép các thành viên trong nhóm làm việc

cùng nhau trên các bản thiết kế, gửi nhận phản hồi và theo dõi sự thay đổi Nó cũng

tích hợp các tính năng như bình luận và đánh dấu, giúp tăng cường quá trình phê

duyệt và sửa lỗi.

Một trong những ưu điểm nổi bật của Figma là tinh di động, cho phép người

dùng truy cập và chỉnh sửa thiết kế từ các thiết bị di động như điện thoại thông minh

và máy tính bảng.

Tóm lại, Figma là một công cụ thiết kế giao điện người dùng trực tuyến, cungcấp một môi trường làm việc linh hoạt và tính năng cộng tác để tạo và quản lý cácthiết kế giao diện ứng dụng và trang web

19

2.2 Công nghệ sử dụng

2.2.1 React (Framework7)

Hình 2-8: Logo React và Framework7"

Framework7 React!*! là một framework mã nguồn mở dựa trên ReactJS, được

sử dung dé xây dựng ứng dụng di động đa nền tang Nó kết hợp sức mạnh của ReactJSvới các thành phần giao diện người dùng (UI components) tùy chỉnh và tương tác

mượt mà của Framework7.

Framework7 React cung cấp một bộ các thành phần giao diện tương thích vớicác tiêu chuẩn thiết kế di động hiện đại Với việc sử dụng ReactJS, người dùng có thể

dễ dàng tạo, tùy biến và tái sử dụng các thành phần UI theo nhu cầu của mình

Framework7 React cung cấp các tính năng mạnh mẽ như điều hướng đa trang,chuyên đổi mượt mà giữa các trang, hiệu ứng chuyên động tinh tế và tích hợp tương

tác cảm ứng Nó cũng hỗ trợ các tính năng như định vị địa lý, thông báo đầy và quản

lý dữ liệu.

Với Framework7 React, người dùng có thé xây dựng ứng dụng di động đa nền

tang (iOS và Android) một cách dé dàng và nhanh chóng Framework này có cộng

đồng đông dao và tài liệu phong phú, giúp người dùng tìm hiểu và giải quyết van đề

nhanh chóng.

Tóm lại, Framework7 React là một framework mạnh mẽ và linh hoạt dé xâydựng ứng dung di động đa nền tang Nó kết hợp sức mạnh của ReactJS và thành phan

giao diện người dùng tùy chỉnh của Framework7, giúp người dùng tạo ra các ứng

dụng di động tuyệt vời với hiệu suất cao và giao diện đẹp mắt.

20

2.2.2 Cordova

Hình 2-9: Logo Cordova!”

Cordova!”! (trước day được gọi là PhoneGap) là một framework mã nguồn mở

Nó cho phép nhà phát triển sử dung các ngôn ngữ web phổ biến như HTML, CSS và

JavaScript để xây dung ứng dụng di động đa nền tảng như iOS, Android, Windows

Phone và nhiều hệ điều hành di động khác

Cordova cung cấp một cầu nối (bridge) giữa mã nguồn web và các API di động,

cho phép truy cập vào các tính năng thiết bị như camera, cảm biến, vị trí địa lý và

nhiều hơn nữa thông qua JavaScript Mã nguồn web được đóng gói và chạy trongmột công cụ trình duyệt có thể nhúng (webview) có sẵn trong các ứng dụng di động

Cordova cung cấp một tập hợp các plugin sẵn có để mở rộng khả năng của ứng

dụng Nhà phát triển có thé sử dụng các plugin này hoặc tao plugin tùy chỉnh dé tíchhợp các tính năng đặc biệt cho ứng dụng của mình.

Một lợi ích lớn của Cordova là khả năng phát triển ứng dụng một lần và triểnkhai trên nhiều nền tảng di động khác nhau, giảm thiêu thời gian và công sức pháttriển Đồng thời, Cordova cũng có cộng đồng đông đảo và tài liệu phong phú, giúpnhà phát triển tìm hiểu và giải quyết các van đề phát trién

Tom lại, Cordova là một framework phat trién ung dung di dong da nén tang,

cho phép sử dung mã nguồn web dé xây dựng ứng dung cho các nền tang di độngkhác nhau Nó cung cấp cầu nối giữa mã nguồn web và các API di động, và cho phép

triển khai ứng dụng một cách dé dàng

21

2.2.3 Node.JS (Express JS)

Exoressl

Hình 2-10: NodeJs'“! và ExpressJsữ

Node.js"“! là một môi trường chạy mã JavaScript phía máy chu, cho phép phát

triển các ứng dụng web đa luồng, đáp ứng với hiệu suất cao Nó sử dụng mô hìnhhướng sự kiện và không đồng bộ dé xử lý yêu cầu đồng thời và tải nặng mà không

làm chặn luồng chính Node.js có cộng đồng phát triển đông đảo và kho lưu trữmodule npm mạnh mẽ.

Express.js là một framework được sử dụng rộng rãi và phổ biến dé phát triển

ứng dụng web thông qua Node.Js Với các công cụ và tính năng đơn giản được nó

cung cấp đã mang lại sự hiệu quả và nhanh chóng trong việc xây dựng một ứng dụngweb phía máy chủ Express.js giúp quản lý và kiểm soát các tác vụ phổ biến như địnhtuyến (routing), xử lý các yêu cầu HTTP, xây dựng API, quản lý các middleware hiệu

quả.

Node.js và Express.js cùng nhau tạo thành một cặp công nghệ mạnh mẽ dé pháttriển ứng dụng web phía máy chủ Node.js cung cấp môi trường chạy mã JavaScript

và khả năng đáp ứng, trong khi Express.js cung cấp một cách dé dang và linh hoạt dé

xây dựng và quản lý các ứng dụng web phức tạp Với sự kết hợp của hai công nghệ

này, nhà phát triển có thé tận dụng sức mạnh của JavaScript dé xây dựng các ứng

dụng web nhanh chóng và hiệu quả.

2.2.4 MongoDB Atlas (noSQL)

) mongoDB Atlas

Hình 2-11: MongoDb!"*!

MongoDB"*! là một hệ quản tri co sở đữ liệu phi quan hệ (NoSQL) phổ biến

NoSQL (Not Only SQL) là một phương pháp lưu trữ và truy van dit liệu khác với mô

22

hình quan hệ truyền thống của SQL MongoDB sử dụng mô hình dữ liệu phi cấu trúc(schema-less) và lưu trữ đữ liệu dưới dạng JSON-like, gọi là BSON (Binary JSON).

Một trong những ưu điểm của MongoDB là khả năng mở rộng dé dàng Nó hỗtrợ việc phân tán dữ liệu trên nhiều máy chủ, giúp tăng khả năng chịu tải và hiệu suất.MongoDB cũng có khả năng xử lý các tác vụ thời gian thực (real-time) và có thể lưutrữ dữ liệu không cấu trúc, phù hợp với các ứng dụng web đòi hỏi tính mở rộng vàlinh hoạt cao.

NoSQL cung cấp một cách tiếp cận linh hoạt hon cho việc làm việc với dữ liệukhông cấu trúc, lưu trữ dữ liệu lớn và phân tán, và tăng cường hiệu suất Nó thườngđược sử dụng trong các ứng dụng web có khối lượng dữ liệu lớn, các ứng dụng real-time, xử ly dit liệu không đồng nhất và nhiều hơn nữa

Tom lại, MongoDB là một hệ quản tri cơ sở dữ liệu phi quan hệ được phát triển

dựa trên NoSQL NoSQL là một phương pháp lưu trữ và truy xuất dữ liệu không sử

dụng SQL, mang lại tính mở rộng và linh hoạt cho các ứng dụng web MongoDB và

NoSQL đều hỗ trợ xử lý dữ liệu không cau trúc và có khả năng mở rộng cao, phù hợp

với nhiêu ứng dụng phức tạp và yêu câu hiệu suât cao.

2.2.5 Javascript (Typescript)

Hình 2-12: JavaScript?! và TypeScript”!

JavaScript là một ngôn ngữ lập trình khá phổ biến và cũng được rất nhiều nhàphát triển ưa chuộng và sử dụng trong các dự án xây dựng và phát triển ứng dụngweb Ban đầu, JavaScript sinh ra với mục đích giúp xử lý sự kiện và cung cấp các

tương tác trên trình duyệt web Tuy nhiên, với sự phát triển và tiến bộ không ngừng,

JavaScript đã trở thành một ngôn ngữ đa mục đích, nó cho phép phát triển các ứng

dụng dynamic web, ứng dụng máy chi va ca giao diện người dùng tương tac.

23