ĐỒ án xây DỰNG WEBSITE CHIA sẻ VIDEO

ĐẠI HỌC QUỐC GIA TP. HỒ CHÍ MINH
TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN
KHOA CÔNG NGHỆ PHẦN MỀM

ĐỒ ÁN 2
XÂY DỰNG WEBSITE CHIA SẺ VIDEO
GIẢNG VIÊN HƯỚNG DẪN
Thạc sĩ:Hoàng Văn Hà

Sinh viên thực hiện:
Nguyễn Trọng Tài-1751002
Trần Đình Thiện-17521080

TP. HỒ CHÍ MINH, ngày 9 tháng 1 năm 2021

1


LỜI CẢM ƠN
Trên thực tế, khơng có sự thành cơng nào mà không gắn liền với những sự hỗ trợ, giúp đỡ
dù ít hay nhiều, dù trực tiếp hay gián tiếp của người khác. Trong suốt thời gian từ khi bắt đầu
học tập ở giảng đường đại học đến nay, chúng em đã nhận được rất nhiều sự quan tâm, giúp
đỡ của q thầy cơ, gia đình và bạn bè.
Với lòng biết ơn sâu sắc nhất, chúng em xin gửi đến quý thầy cô ở khoa Công nghệ phần
mềm – Trường Đại học Công nghệ thông tin, những người đã cùng với tri thức và tâm huyết
của mình đã truyền đạt lại vốn kiến thức quý báu cho chúng em suốt thời gian học tập tại
trường. Và đặc biệt, trong học kỳ này, khoa đã tổ chức cho em được tiếp cận với môn Đồ Án
2, môn học mà theo chúng em là rất hữu ích đối với khoa Cơng nghệ phần mềm.
Chúng em xin chân thành cảm ơn Ths. Hoàng Văn Hà, người thầy đã tận tâm hướng dẫn
chúng em từ những bước đi đầu tiên cũng như những góp ý chân thành để chúng em có thể
cải thiện đồ án một cách tốt nhất . Nếu khơng có những lời hướng dẫn, dạy bảo của thầy thì

chúng em nghĩ đồ án này sẽ khó mà hồn thành được. Một lần nữa, chúng em xin chân thành
cảm ơn thầy.

Thành phố Hồ Chí Minh, ngày 9 tháng 1 năm 2021
Trần Đình Thiện
Nguyễn Trọng Tài

2


Nhận xét của giáo viên hướng dẫn
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………………………………

…………………………………………………………………………………………………
…………………………………………………………………………………………………
…………………………………………………………………………
Tp.HCM, ngày tháng năm 2021
Giáo viên hướng dẫn
Th.S Hoàng Văn Hà

3


Mục lục
Chương 1. Giới thiệu đề tài.............................................................................................................5

1.

Hiện trạng tổ chức....................................................................................5

2.

Giới hạn/ phạm vi.....................................................................................6
a)

Bài toán................................................................................................6

b)

Nhận xét bài toán:...............................................................................6

3.

Các nội dung thực hiện............................................................................7

4.

Kết quả hướng tới.....................................................................................7

Chương 2. Các kiến thức/ công nghệ nền tảng................................................................................8

1.

Giới thiệu công nghệ sử dụng..................................................................8
a.

Framework Vuejs..................................................................................8

b.

Nodejs...................................................................................................8

c.

Yarn.......................................................................................................8

d.

MongoDb..............................................................................................8

e.

Firebase storage....................................................................................9

Chương 3. Xây dựng ứng dụng.....................................................................................................10

1.

Tổng quan khảo sát các ứng dụng liên quan..........................................10

2.

Phân tích.................................................................................................11

3.

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

4.

Cài đặt phần mềm...................................................................................26

4


5.

Các áp dụng chính của framework/ lib đã tìm hiểu vào trong ứng dụng
26

Chương 4. Thử nghiệm, đánh giá..................................................................................................28

1.

Môi trưởng thử nghiệm..........................................................................28

2.

Kết quả thực nghiệm..............................................................................28

3.

Đánh giá kết quả sản phẩm....................................................................28

Chương 5. Kết luận và hướng phát triển.......................................................................................29

1.

Kết quả đạt được....................................................................................29

2.

Hạn chế và hướng phát triển..................................................................29

Tài liệu tham khảo.........................................................................................................................31

Chương 1. Giới thiệu đề tài
1. Hiện trạng tổ chức
Chúng ta đang sống trong kỷ ngun cơng nghệ 4.0 tồn cầu, đang ngày càng bùng
nổ về mạng máy tính và các ứng dụng của nó, con người có thể nhanh chóng giao tiếp
và kết nối với nhau thông qua nhiều ứng dụng trên Interne.Đi kèm với đó là sự phát
triển mạnh mẽ của các nền tảng giải trí.Trong đó xem video,xem live stream là những
nhu cầu giải trí khơng thể thiếu trong cuộc sống ngày nay.Từ những video chúng ta có

thể tích lũy thêm kiến thức về nhiều lĩnh vực khác nhau cũng như có những giây phút
thư giãn sau những giờ làm việc căng thẳng.
Trên thị trường hiện nay, có rất nhiều ứng dụng chia sẻ video cũng như những trang
web hay mạng xã hội video rất nổi tiếng được rất nhiều người tin dùng và sử dụng .
Do đó, để tiếp nối thành cơng ấy, nhóm chúng em cũng muốn được góp phần cơng
sức của mình để tạo ra một cộng đồng cho những người có đam mê về quay
phim,chụp hình tạo trend và cũng là một nơi để mọi người cùng nhau chia sẻ ý kiến
cá nhân hay những góp ý để cùng nhau phát triển hơn.Không những vậy trang web
cịn là một mơi trường tuyệt vời để mọi người có thể tích lũy thêm kiến thức từ nhiều
lĩnh vực khác nhau từ nhiều con người khác nhau.

5


2. Giới hạn/ phạm vi
a) Bài toán
Drago Zero là một trong những trang web đặc thù áp dụng công nghệ thông tin vào
hoạt động: chia sẻ video qua mạng và sau này sẽ có xu hường mở rộng. Drago Zero là
một website dành cho những nhà sáng tạo cũng như là một nền tảng giải trí hay một nơi
trau dồi kiến thức bằng những video.Mục tiêu của việc xây dựng trang web này nhằm
giúp cho người dùng có thể chia sẻ hay xem những video trực tiếp từ xa thông qua
mạng internet phổ biến. Người dùng ở nhà hay tại cơng ty vẫn có thể dễ dàng truy cập
lựa chọn những video hay bổ ích phù hợp với nhu cầu cá nhân, giúp việc giải trí tại chỗ
một cách nhanh chóng, tiện lợi, tiết kiệm thời gian, đáp ứng được nhu cầu thực tế. Hệ
thống tìm kiếm dễ dàng, giao diện thân thiện. Chỉ cần đăng nhập vào hệ thống với tài
khoản đã có (nếu người dùng đã là thành viên của website) hay chỉ cần vài thao tác
đăng kí đơn giản là người dùng có thể dễ dàng xem những video mới nhất từ các kênh
mình u thích cũng như sáng tạo ra những video để có thể chia sẻ với cộng đồng.
b) Nhận xét bài toán:
Phạm vi của đồ án sẽ là một website giúp cho người dùng có thể thực hiện những

tác vụ sau:
 Xem video
 Tìm kiếm video
 Đăng video
 Like/Dislike/Comment (thể hiện quan điểm cá nhân)
 Chia sẻ Video
 Live stream
 Báo cáo nội dung video
 Đề xuất video
 Lưu trữ video
 Quản lý kênh cá nhân (xem,sửa,xóa,tìm kiếm)
 Đăng kí/Hủy đăng kí kênh
 Xem và xóa lịch sử tìm kiếm,lịch sử theo dõi
 Tạo kênh cá nhân

3. Các nội dung thực hiện

Nội dung nghiên cứu:
Xu hướng UI/UX của các website chia
sẻ video hiện nay

6

Thực hiện:
Lên kế hoạch thiết kế UI/UX cho đề tài


Các chức năng của một website chia sẻ
video
Công nghệ VueJS

Công nghệ NodeJs
Công nghệ Yarn
Hệ cơ sở dữ liệu MongoDB

Lên kế hoạch thiết kế chức năng cho đề
tài
Xây dựng giao diện website
Xây dựng backend cho toàn hệ thống
Giúp cho việc quản lý dự án, cài đặt dễ
dàng hơn
Xây dựng cơ sở dữ liệu cho toàn hệ
thống

4. Kết quả hướng tới






Giao diện thân thiện đẹp mắt,dễ nhìn
Khả năng truy xuất cao
Website có đầy đủ các tính năng cơ bản của một website chia sẻ video
Đáp ứng đầy đủ nhu cầu của người dùng
Là một nền tảng chia sẻ video cũng như một nơi lưu trữ video được nhiều
người tin dùng

7

Chương 2. Các kiến thức/ công nghệ nền tảng
1. Giới thiệu công nghệ sử dụng
a. Framework Vuejs
- Vue.js, gọi tắt là Vue, là một framework linh động dùng để xây dựng
giao diện người dùng (user interfaces - UI). Khác với các framework
nguyên khối, Vue được thiết kế từ đầu theo hướng cho phép và
khuyến khích việc phát triển ứng dụng theo các bước. Khi phát triển
lớp giao diện, người dùng chỉ cần dùng thư viện lõi (core library) của
Vue, vốn rất dễ học và tích hợp với các thư viện hoặc dự án có sẵn.
Cùng lúc đó, nếu kết hợp với những kĩ thuật hiện đại như SFC
(single file components) và các thư viện hỗ trợ, Vue cũng đáp ứng
được dễ dàng nhu cầu xây dựng những ứng dụng đơn trang (SPA Single Page Applications) với độ phức tạp cao
b. Nodejs
- Nodejs là một môi trường chạy Javascript ( Javascript runtime
environment) bên ngồi trình duyệt. Nodejs cũng bao gồm các thành
phần , thư viện khác để nó có thể hoạt động như một Web
Application Server.
c. Yarn
-

Để có thể quản lý dự án của bạn một cách dễ dàng thì khơng thể
không nhắc đến yarn. Yarn giúp chúng ta cài đặt và chia sẻ code của

mình với người khác dễ khác.
d. MongoDb
- Vue.js, gọi tắt là Vue, là một framework linh động dùng để xây dựng
giao diện người dùng (user interfaces - UI). Khác với các framework
nguyên khối, Vue được thiết kế từ đầu theo hướng cho phép và
khuyến khích việc phát triển ứng dụng theo các bước. Khi phát triển
lớp giao diện, người dùng chỉ cần dùng thư viện lõi (core library) của

Vue, vốn rất dễ học và tích hợp với các thư viện hoặc dự án có sẵn.
Cùng lúc đó, nếu kết hợp với những kĩ thuật hiện đại như SFC
(single file components) và các thư viện hỗ trợ, Vue cũng đáp ứng
được dễ dàng nhu cầu xây dựng những ứng dụng đơn trang (SPA -

Single Page Applications) với độ phức tạp cao
NoSQL là 1 dạng CSDL mã nguồn mở không sử dụng Transact-SQL
để truy vấn thông tin. NoSQL viết tắt bởi: None-Relational SQL, hay

8


có nơi thường gọi là Not-Only SQL. CSDL này được phát triển trên
Javascript Framework với kiểu dữ liệu JSON. (Cú pháp của JSON là
“key:value”) NoSQL ra đời như là 1 mảnh vá cho những khuyết
điểm và thiếu xót cũng như hạn chế của mơ hình dữ liệu quan hệ
RDBMS về tốc độ, tính năng, khả năng mở rộng, memory cache,...
e. Firebase storage
- Cloud Storage được xây dựng cho các nhà phát triển ứng dụng,
những người cần lưu trữ và phân phát nội dung do người dùng tạo,
-

chẳng hạn như ảnh hoặc video.
Cloud Storage cho Firebase là một dịch vụ lưu trữ đối tượng mạnh
mẽ, đơn giản và tiết kiệm chi phí được xây dựng cho quy mơ của
Google. SDK Firebase cho Bộ nhớ đám mây bổ sung tính năng bảo
mật của Google cho các tệp tải lên và tải xuống cho ứng dụng
Firebase của bạn, bất kể chất lượng mạng như thế nào. Bạn có thể sử
dụng SDK của chúng tơi để lưu trữ hình ảnh, âm thanh, video hoặc
nội dung do người dùng tạo khác. Trên máy chủ, bạn có thể sử

dụng Google Cloud Storage , để truy cập các tệp giống nhau.

9


Chương 3. Xây dựng ứng dụng
1. Tổng quan khảo sát các ứng dụng liên quan

Các ứng
dụng liên
quan:

TikTok

Kết quả khảo sát tổng quan:














Youtube







UI/UX đẹp mắt
Có đầy đủ cả web và mobile app
Tích hợp âm nhạc vào video clip
Đi đầu trong việc tạo xu hướng,viral
Có các tính năng chỉnh sửa video để người dùng có thể thao
tác mà khơng cần phải qua một phần mềm thứ ba
Tạo những video ngắn có tích hợp nhạc nền
Có những tính năng cơ bản của một nền tảng chia sẻ video
như like,share,comment,….
Người dùng có thể chọn lọc ra video hay chủ đề mình muốn
xem
Đang là một trong những cộng đồng phát triển nhất hiện nay
Đề xuất từ lịch sử hoạt động hay tìm kiếm của người dùng
UI/UX đẹp mắt
Có đầy đủ cả web và mobile app
Có những tính năng cơ bản của một nền tảng chia sẻ video
như like,share,comment,….
Có thể lưu trữ những video dài cũng như chỉnh chất
lượng,tốc độ,….
Chuyển video thành gift
Là một cộng đồng lớn và lâu đời
Có nhiều chủ đề cho người dùng lựa chọn
Đề xuất từ lịch sử hoạt động hay tìm kiếm của người dùng

2. Phân tích
a) Sơ đồ usecase
Primary Actor
Guest

Use Cases





Log In
Register
Forgot password
Watch Video

10


User



Search









Watch Video
Search
Studio Manager
Your Channel
History
Subscriptions

Tên ký hiệu
Actor

Ký hiệu

Use case
Association
Dependency
Include use case
Extend use case

11


Hình 1.Sơ đồ usecase tổng quát

12


Hình 2.Sơ đồ usecase xem video

13


Hình 3.Sơ đồ usecase quản lý kênh cá nhân

Hình 4.Sơ đồ usecase xem lịch sử tìm kiếm và hoạt động

14


b) Đặc tả usecase
ID and Name: UC-1 Login
Created By: Nguyễn Trọng Tài

Date Created: 20/11/2020

Primary Actor: Guest

Secondary Không
Actors:

Description: Use-case cho phép actor đăng nhập vào hệ thống với vai trò là user

Trigger: Guest muốn đăng nhập với vai trò là user
Preconditions: PRE-1: Guest muốn đăng nhập với trò là User
PRE-2. Tài khoản đã được Log out
Postconditions: POST-1: Tài khoản chính xác
Normal Flow:

Alternative
Flows:

Exceptions:



Actor chọn chức năng “đăng nhập ”.



Hệ thống hiển thị form gồm tên đăng nhập và mật khẩu.



Actor chọn đăng nhập.



Hệ thống kiểm tra tên đăng nhập và mật khẩu, xác nhận là đúng và

cho phép actor đăng nhập vào hệ thống
 Actor chọn chức năng “Connect with Google”
 Hệ thống hiển thị form đăng nhập bằng gmail
 Actor chọn đăng nhập bằng tài khoản gmail của mình.
 Hệ thống yêu cầu actor xác thực gmail và cho phéo actor đăng
nhập vào hệ thống.
Nếu actor nhập tên và mật khẩu khơng đúng thì hệ thống sẽ báo lỗi.

Priority: High

Frequency of
Use:
Business Rules:
Other
Information:
Assumptions:

ID and Name: UC-2 Register
Created By: Nguyễn Trọng Tài

Date Created: 20/11/2020

Primary Actor: Guest

Secondary Không

15


Actors:
Description: Use-case này cho phép actor đăng ký tài khoản để trở thành user
Trigger:
Preconditions:
Postconditions:
Normal Flow: Chức năng giúp actor đăng kí để trở thành tài khoản user
Actor nhấn “Sign up” để đăng ký tài khoản
Actor điền thông tin tài khoản mình muốn đăng kí và xác nhận
Hệ thống xác thực và lưu thông tin người dùng vào CSDL
Alternative Không
Flows:

Exceptions: Không
Priority: High
Business Rules: Không
Other Hệ thống yêu cầu người dùng phải nhập chính xác thơng tin nếu như nhập
sai hệ thống sẽ hiện thơng báo lỗi.
Information:
Actor bắt buộc phải đăng kí bằng email của mình

ID and Name: UC-3 Forgot password
Created By: Nguyễn Trọng Tài

Date Created: 20/11/2020

Primary Actor: Guest

Secondary
Actors:

Description: Use-case này cho phép actor thực hiện việc reset password khi actor gặp
vấn đề tài khoản

Trigger:
Preconditions:
Postconditions:

16


Normal Flow: Chức năng này được dùng khi actor cần reset password
Hệ thống yêu cầu actor nhập thông tin tài khoản và xác nhận “reset

password”
Hệ thống sẽ gửi email xác thực về tài khoản email đã đăng kí
Actor mở gmail và xác thực đó là mình và thực hiện điền password mới
Hệ thống gửi mail về xác nhận và lưu thông tin vào CSDL

Alternative
Flows:
Exceptions:
Priority: high
Business Rules:
Other Nếu actor không điền đầy đủ các thông tin bắt buộc và không xác thực
Information: email thì hệ thống sẽ khơng cho reset password

ID and Name: UC-4 Search
Created By: Nguyễn Trọng Tài

Date Created: 20/10/2020

Primary Actor: User

Secondary Actors: Guest

Description: Use-case cho phép actor tìm kiếm videos và channels trên website
Trigger:
Preconditions:
Postconditions:
Normal Flow: Chức năng này được sử dụng để tìm kiếm thơng tin theo u cầu của
actor
Actor nhập thơng tin mình muốn tìm kiếm trên thanh công cụ
Hệ thống truy cập database và hiển thị danh sách kết quả liên quan đến

thông tin người dùng nhập

17


Alternative Flows: Nếu như thơng tin actor tìm kiếm khơng có trong database thì hệ thống sẽ
hiện thơng báo “no result for data”
Exceptions:
Priority: High
Business Rules:
Other Information: Kết quả chỉ được hiển thị là videos và channels
Nếu actor muốn xem thông tin channels sẽ bắt buộc truy cập với vai trò
user

ID and Name: UC-5 Your Channel
Created By: Nguyễn Trọng Tài

Date Created: 20/11/2020

Primary Actor: User

Secondary
Actors:

Description: Use-case này cho phép actor truy cập vào kênh cá nhân của mình
Trigger:
Preconditions: Trước khi use-case này bắt đầu thì actor phải đăng nhập vào hệ thống với
vai trị là User
Postconditions: Khơng
Normal Flow: Chức năng này cho phép actor xem các video đã được đăng lên hệ thống

của mình
Có thể xem những video mình đã đăng để test cũng như coi thơng tin của
video
Alternative Actor có thể truy cập vào “Studio Manager” từ kênh cá nhân của mình
Flows:
Exceptions:
Priority: High
Business Rules:
Other
Information:

ID and Name: UC-6 Subscriptions
Created By: Nguyễn Trọng Tài

Date Created: 20/11/2020

Primary Actor: User

Secondary Không

18


Actors:
Description: Use-case này cho phép actor xem những video từ các kênh mình đã theo
dõi
Trigger: Actor đăng nhập vào hệ thống với vai trị là user
Preconditions:
Postconditions: Khơng
Normal Flow:



Chức năng này cho phép actor theo dõi được các hoạt động
mới nhất từ các kênh đang theo dõi



Actor có thẻ theo dõi những video mới nhất của kênh mình
theo dỗi



Actor nhấn “subscriptions” để truy cập vào các kênh mình
đã đăng kí

Alternative
Flows:
Exceptions:
Priority: High
Business Rules:
Other
Information:

ID and Name: UC-7 Watch Video
Created By: Nguyễn Trọng Tài

Date Created: 20/11/2020

Primary Actor: User

Secondary Guest
Actors:

Description: Use-case cho phép actor xem các video được đăng lên cũng như thực hiện
các chức năng có trong video như:tăng âm lượng,phóng to màn hình,pause
video….
Actor cũng có thể like,comment,share,coi thơng tin chi tiết,đăng kí
kênh,dislike…
Trigger:
Preconditions:
Postconditions:

19


Normal Flow:



Actor nhấn vào video mình muốn xem để coi video,actor có thể
chọn các chức năng pause,điều chỉnh âm lượng,phóng to màn hình,
tăng tốc độ video



Actor có thể like video nếu cảm tháy yêu thích bằng cách nhấn nút
“like” hoặc “dislike” nếu như thấy khơng thích video.



Actor có thể share video bằng cách nhấn nút “share” cũng như
comment hoặc reply comment để nêu ý kiến cá nhân của mình.



Actor có thể đăng kí kênh bằng cách nhấn nút “subscribe” hoặc hủy
theo dõi bằng cách click lại nhần nữa.

Alternative
Flows:
Exceptions:
Priority: high
Business Rules:
Other



Information:

Nếu actor chưa đăng nhập với vai trị actor thì chỉ có thể xem video
cũng như thao tác các chức năng pause,điều chỉnh âm lượng,phóng
to màn hình, tăng tốc độ video



Cịn nếu actor chưa đăng nhập với vai trò là user mà muốn sử dụng
các tính năng like,comment,share,coi thơng tin chi tiết,đăng kí
kênh,dislike…thì sẽ bị trả vể trang đăng nhập

ID and Name: UC-8 Studio Manager

Created By: Nguyễn Trọng Tài

Date Created: 20/11/2020

Primary Actor: User

Secondary Không
Actors:

Description: Usecase này cho phép actor quản lý kênh cá nhân
Trigger:
Preconditions:
Postconditions:

20


Normal Flow:



Actor có thể đăng video lên website bằng cách click vào “upload
video”



Hệ thống sẽ yêu cầu actor chọn một video từ nơi lưu trữ video của
mình để đăng lên kênh cá nhân



Actor có thể xem các comments và lượt like của video bằng cách
click vào “dashboard” và click “see analyctics” hoặc “see
comments” và “recent subscribers” để xem thông tin các kênh đã
đăng kí cũng như click “unsubscriber” để hủy đăng kí kênh.



Actor có thể click “videos” để xem các video mình đã đăng lên
cũng như tìm kiếm các video của mình



Actor có thể thay đổi thơng tin cá nhân của kênh,tài khoản cá
nhân,avata bằng cách click vào “settings”.Khi actor hoàn thành
xong việc thay đổi actor nhấn vào submit để hệ thống lưu vào
CSDL.Actor cũng có thể thay đổi password trong chức năng này .

Alternative
Flows:
Exceptions:
Priority: High
Business Rules:
Other
Information:

Để thay đổi password actor phải nhập đúng password hiện tại nếu không
hệ thông sẽ không cho actor thực hiện

ID and Name: UC-9 History
Created By: Nguyễn Trọng Tài

Date Created: 20/10/2020

Primary Actor: User

Secondary Không
Actors:

Description: Use-case này cho phép actor xem lịch sử xem và tìm kiếm của mình
Trigger:
Preconditions:
Postconditions: Khơng
Normal Flow: Actor chọn các chức năng “Watch History” để coi các video mình đã từng
xem và “Search History” để coi các nội dung mình đã tìm kiếm.

21


Actor chọn”Clear History” để xóa lịch sử xem hoặc tìm kiếm tùy vào nhu
cầu của actor
Alternative
Flows:
Exceptions:
Priority: High
Business Rules:
Other
Information:

c) Mơ hình kiến trúc hệ thống

3. Thiết kế cơ sở dữ liệu
a) Sơ đồ lớp

22


b) Thiết kế cơ sở dữ liệu

23


4. Cài đặt phần mềm
a. Cài đặt
- Yarn />- Một editor bất kì như VScode, Intellij,…

24


-

Hoặc có thể truy cập vào link để
được hướng dẫn chi tiết

Hình 5. Hướng dẫn cài đặt

5. Các áp dụng chính của framework/ lib đã tìm hiểu vào trong ứng dụng

Framework/lib
Vuejs + Vuetify

Sử dụng
Front-end

Mô tả
- Hỗ trợ xây dựng giao diện
người dùng.
-Hiệu suất của Vuejs so với
Reactjs là nhanh hơn gấp
đơi.
-Hỗ trợ typescript giúp cho
việc bảo trì phần mềm sẽ dễ
dàng hơn rất nhiều.

Nodejs
Firebase storage

Back-end
Lưu trữ video, ảnh

Hỗ trợ viết code dưới server
Lưu trữ dữ liệu dạng image
và video…

25