Khóa luận xây dựng website nghe nhạc trực tuyến

ĐẠ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

PHẠM MINH VIỆT

KHĨA LUẬN TỐT NGHIỆP

XÂY DỰNG WEBSITE NGHE NHẠC TRỰC TUYẾN
BUILDING A MUSIC STREAMING WEBSITE

KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM

TP. HỒ CHÍ MINH, 2023


ĐẠ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

PHẠM MINH VIỆT – 18520398

KHÓA LUẬN TỐT NGHIỆP

XÂY DỰNG WEBSITE NGHE NHẠC TRỰC TUYẾN
BUILDING A MUSIC STREAMING WEBSITE

KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM

GIẢNG VIÊN HƯỚNG DẪN
TS. ĐỖ THỊ THANH TUYỀN
ThS. TRẦN THỊ HỒNG YẾN

TP. HỒ CHÍ MINH, 2023


THƠNG TIN HỘI ĐỒNG CHẤM KHĨA LUẬN TỐT NGHIỆP

Hội đồng chấm khóa luận tốt nghiệp, thành lập theo Quyết định số
…………………… ngày ………………….. của Hiệu trưởng Trường Đại học
Công nghệ Thông tin.


LỜI CẢM ƠN
Em xin chân thành cảm ơn tập thể quý thầy cô trường Đại học Công
nghệ Thông tin, quý thầy cô khoa Công nghệ Phần mềm, các bạn đã truyền
đạt kiến thức, tạo điều kiện hỗ trợ nhiệt tình cho em trong suốt quá trình
em theo học tại trường.
Đặc biệt, em xin gửi lời cảm ơn đến với cô Đỗ Thị Thanh Tuyền và
cô Trần Thị Hồng Yến đã tạo điều kiện cho em thực hiện đề tài khóa luận
tốt nghiệp, đồng thời giúp đỡ, giải đáp những khúc mắc có trong thời gian
thực hiện đề tài khóa luận tốt nghiệp này.
Mặc dù đã có nhiều cố gắng trong suốt q trình thực hiện đề tài,
nhưng bên cạnh đó vẫn cịn có những mặt hạn chế, thiếu sót. Em rất mong
nhận được sự góp ý của q thầy cơ và các bạn để hồn thiện kiến thức, lấy
đó làm hành trang quý báu trong chặng đường này.
Một lần nữa, em xin chân thành cảm ơn.
TP. Hồ Chí Minh, tháng 7 năm 2023
Sinh viên thực hiện đề tài

Phạm Minh Việt


MỤC LỤC
CHƯƠNG 1: TỔNG QUAN .....................................................................................17
1.1.

Lý do chọn đề tài .......................................................................................17

1.2.

Mục tiêu đề tài ...........................................................................................17

1.3.

Phạm vi ......................................................................................................17

1.4.

Đối tượng sử dụng .....................................................................................18

1.5.

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

1.6.

Kết quả mong đợi ......................................................................................18

CHƯƠNG 2: KIẾN THỨC NỀN TẢNG .................................................................19

2.1.

Công cụ quản lý và phát triển ...................................................................19

2.1.1.

Visual Studio Code ............................................................................19

2.1.2.

Visual Studio .....................................................................................20

2.1.3.

Git ......................................................................................................22

2.1.4.

Github ................................................................................................23

2.1.5.

Insomnia ............................................................................................25

2.2.

Công nghệ sử dụng....................................................................................26

2.2.1.

Vue.js .................................................................................................26

2.2.2.

Vue Audio Visual ..............................................................................26

2.2.3.

Javascript ...........................................................................................27

2.2.4.

Fuse.js ................................................................................................28

2.2.5.

LocalForage .......................................................................................28

2.2.6.

.NET Core và ASP.NET Core ...........................................................29

2.2.7.

Entity Framework ..............................................................................29

2.2.8.

PostgreSQL .......................................................................................30

2.2.9.

Azure App Services ...........................................................................31

2.2.10.

Azure Blob Storage ...........................................................................32

2.2.11.

Azure Cognitive Services ..................................................................33

CHƯƠNG 3: THIẾT KẾ ỨNG DỤNG ....................................................................34
3.1.

Phân tích yêu cầu hệ thống .......................................................................34

3.1.1.

Phân tích yêu cầu chức năng .............................................................34

3.1.1.1. Yêu cầu về lưu trữ .........................................................................34
3.1.1.2. Yêu cầu về tính năng .....................................................................34
3.1.2.

Phân tích yêu cầu phi chức năng .......................................................35

3.1.3.

Phân tích yêu cầu người dùng ...........................................................36

3.1.3.1. Mơ hình use case tồn bộ hệ thống................................................36
3.1.3.2. Danh sách các actor .......................................................................37
3.1.3.3. Danh sách các use case ..................................................................37
3.1.3.4. Đặc tả chi tiết use case ...................................................................41
3.2.

Phân tích thiết kế hệ thống ........................................................................73

3.2.1.

Thiết kế xử lý.....................................................................................73

3.2.2.

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

3.2.2.1. Lược đồ cơ sở dữ liệu ....................................................................81
3.2.2.2. Mô tả các bảng dữ liệu...................................................................82
3.2.3.

Thiết kế kiến trúc hệ thống ................................................................87

3.2.3.1. Kiến trúc tổng thể ..........................................................................87
3.2.3.2. Kiến trúc website ...........................................................................88
CHƯƠNG 4: XÂY DỰNG ỨNG DỤNG ................................................................90
4.1.

Thiết kế giao diện ......................................................................................90

4.1.1.

Danh sách các màn hình ....................................................................90

4.1.2.

Giao diện các màn hình .....................................................................92

4.2.

Triển khai hệ thống .................................................................................106

4.2.1.

Máy chủ ...........................................................................................106

4.2.2.

Lưu trữ .............................................................................................106

CHƯƠNG 5: KẾT LUẬN ......................................................................................107
5.1.

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

5.2.

Thuận lợi và khó khăn .............................................................................107

5.2.1.

Thuận lợi..........................................................................................107

5.2.2.

Khó khăn .........................................................................................108

5.3.

Hướng phát triển .....................................................................................108

TÀI LIỆU THAM KHẢO .......................................................................................109


DANH MỤC HÌNH
Hình 2.1 Visual Studio Code[1] .................................................................................19
Hình 2.2 Visual Studio[2] ...........................................................................................20
Hình 2.3 Git[3] ............................................................................................................22
Hình 2.4 Github[4] ......................................................................................................23
Hình 2.5 Insomnia[5] ..................................................................................................25
Hình 2.6 Vue.js[6] ......................................................................................................26
Hình 2.7 Vue Audio Visual[7]....................................................................................26
Hình 2.8 Javascript[8] .................................................................................................27
Hình 2.9 Fuse.js[9]......................................................................................................28
Hình 2.10 LocalForage[10] .........................................................................................28
Hình 2.11 .NET Core[11] ............................................................................................29
Hình 2.12 PostgreSQL[15] ..........................................................................................30
Hình 2.13 Microsoft Azure[16] ...................................................................................31

Hình 3.1 Mơ hình use case tồn bộ hệ thống ............................................................36
Hình 3.2 Biểu đồ tuần tự chức năng “Sign in” ........................................................73
Hình 3.3 Biểu đồ tuần tự chức năng “Sign up”.........................................................73
Hình 3.4 Biểu đồ tuần tự chức năng “Change password”.........................................74
Hình 3.5 Biểu đồ tuần tự chức năng “Search tracks” ...............................................74
Hình 3.6 Biểu đồ tuần tự chức năng “Search artist” .................................................74
Hình 3.7 Biểu đồ tuần tự chức năng “Rate”..............................................................75
Hình 3.8 Biểu đồ tuần tự chức năng “Download” ....................................................75
Hình 3.9 Biểu đồ tuần tự chức năng “Add to playlist” .............................................76
Hình 3.10 Biểu đồ tuần tự chức năng “Create playlist” ............................................76


Hình 3.11 Biểu đồ tuần tự chức năng “Edit playlist” ...............................................76
Hỉnh 3.12 Biểu đồ tuần tự chức năng “Delete playlist” ............................................77
Hỉnh 3.13 Biểu đồ tuần tự chức năng “Remove track”.............................................77
Hỉnh 3.14 Biểu đồ tuần tự chức năng “Edit information” ........................................77
Hỉnh 3.15 Biểu đồ tuần tự chức năng “Follow/unfollow user” ................................78
Hỉnh 3.16 Biểu đồ tuần tự chức năng “Create artist’s biography” ...........................78
Hình 3.17 Biểu đồ tuần tự chức năng “Upload track” ..............................................78
Hỉnh 3.18 Biểu đồ tuần tự chức năng “Edit track” ...................................................79
Hình 3.19 Biểu đồ tuần tự chức năng “Delete track” ...............................................79
Hỉnh 3.20 Biểu đồ tuần tự chức năng “Create captions” và “Edit captions” ............80
Hỉnh 3.21 Biểu đồ tuần tự chức năng “Generate captions” ......................................80
Hỉnh 3.22 Lược đồ cơ sở dữ liệu[21] .......................................................................81
Hình 3.23 Sơ đồ kiến trúc tổng thể ...........................................................................87
Hình 3.24 Sơ đồ kiến trúc website ............................................................................88
Hình 4.1 Giao diện đăng nhập...................................................................................92
Hình 4.2 Giao diện chính khi chưa đăng nhập ..........................................................93
Hình 4.3 Giao diện chính sau khi đăng nhập ............................................................94
Hình 4.4 Giao diện ‘home’........................................................................................95

Hình 4.5 Giao diện ‘discover’ ...................................................................................96
Hình 4.6 Giao diện ‘my_tracks’ ................................................................................97
Hình 4.7 Giao diện ‘my_playlists’ ............................................................................98
Hình 4.8 Giao diện ‘storage’ .....................................................................................98
Hỉnh 4.9 Giao diện thông tin người dùng chính .......................................................99
Hình 4.10 Giao diện thơng tin người dùng khác .....................................................100


Hình 4.11 Giao diện thêm vào danh sách ...............................................................100
Hỉnh 4.12 Giao diện thơng tin bài hát .....................................................................101
Hình 4.13 Giao diện thơng tin nghệ sĩ ....................................................................101
Hình 4.14 Giao diện danh sách bài hát đang chạy ..................................................102
Hình 4.15 Giao diện liên kết nghệ sĩ .......................................................................103
Hình 4.16 Giao diện tạo bài hát ..............................................................................104
Hỉnh 4.17 Giao diện chỉnh sửa bài hát ....................................................................104
Hình 4.18 Giao diện ‘welcome.txt’ .........................................................................105
Hình 4.19 Giao diện ‘about.txt’ ..............................................................................105


DANH MỤC BẢNG
Bảng 3.1 Bảng mô tả các actor của website ..............................................................37
Bảng 3.2 Bảng danh sách và mô tả các use case của website ...................................37
Bảng 3.3 Bảng đặc tả chi tiết chức năng Sign in – UC001 .......................................41
Bảng 3.4 Bảng đặc tả chi tiết chức năng Sign up – UC002 ......................................43
Bảng 3.5 Bảng đặc tả chi tiết chức năng Change password – UC003 ......................44
Bảng 3.6 Bảng đặc tả chi tiết chức năng Check profile – UC004 ............................45
Bảng 3.7 Bảng đặc tả chi tiết chức năng Edit information – UC005 ........................47
Bảng 3.8 Bảng đặc tả chi tiết chức năng Follow/unfollow user – UC006 ................48
Bảng 3.9 Bảng đặc tả chi tiết chức năng Search tracks – UC007 .............................49
Bảng 3.10 Bảng đặc tả chi tiết chức năng Search by genre – UC008 ......................50

Bảng 3.11 Bảng đặc tả chi tiết chức năng Play track – UC009 ................................51
Bảng 3.12 Bảng đặc tả chi tiết chức năng Rate – UC010 .........................................52
Bảng 3.13 Bảng đặc tả chi tiết chức năng Download – UC011................................53
Bảng 3.14 Bảng đặc tả chi tiết chức năng Add to playlist – UC012 ........................54
Bảng 3.15 Bảng đặc tả chi tiết chức năng Create playlist – UC013 .........................56
Bảng 3.16 Bảng đặc tả chi tiết chức năng Edit playlist – UC014 .............................57
Bảng 3.17 Bảng đặc tả chi tiết chức năng Remove track – UC015 ..........................58
Bảng 3.18 Bảng đặc tả chi tiết chức năng Delete playlist – UC016 .........................59
Bảng 3.19 Bảng đặc tả chi tiết chức năng Upload track – UC017 ...........................61
Bảng 3.20 Bảng đặc tả chi tiết chức năng Choose a genre – UC018........................62
Bảng 3.21 Bảng đặc tả chi tiết chức năng Link artist’s biography – UC019 ...........63
Bảng 3.22 Bảng đặc tả chi tiết chức năng Search artist – UC020 ............................64
Bảng 3.23 Bảng đặc tả chi tiết chức năng Create artist’s biography – UC021.........65


Bảng 3.24 Bảng đặc tả chi tiết chức năng Edit track – UC022.................................66
Bảng 3.25 Bảng đặc tả chi tiết chức năng Create captions – UC023 .......................68
Bảng 3.26 Bảng đặc tả chi tiết chức năng Edit captions – UC024 ...........................69
Bảng 3.27 Bảng đặc tả chi tiết chức năng Generate captions – UC025 ...................70
Bảng 3.28 Bảng đặc tả chi tiết chức năng Delete track – UC026 .............................71
Bảng 3.29 Danh sách các thuộc tính “Member” .......................................................82
Bảng 3.30 Danh sách các thuộc tính “Memberstats” ................................................83
Bảng 3.31 Danh sách các thuộc tính “Genre” ...........................................................83
Bảng 3.32 Danh sách các thuộc tính “ArtistInfo” .....................................................84
Bảng 3.33 Danh sách các thuộc tính “Playlist” ........................................................84
Bảng 3.34 Danh sách các thuộc tính “Track” ...........................................................85
Bảng 3.35 Danh sách các thuộc tính “ClosedCaption” .............................................86
Bảng 4.1 Bảng danh sách các màn hình ....................................................................90

DANH MỤC TỪ VIẾT TẮT
Nghĩa

Từ viết tắt
API

Application Programming Interface

ASP

Active Server Pages Network Enabled Technologies

CSDL

Cơ sở dữ liệu

CSS

Cascading Style Sheets

CV

Curriculum Vitae

DB

Database

DVCS

Distributed Version Control System

EF

Entity Framework

ES

ECMAScript

GB

Gigabyte

GPRS

General Packet Radio Service

HTML

Hypertext Markup Language

HTTP

Hypertext Transfer Protocol

IDE

Integrated Development Environment

IE

Internet Explorer

IoT

Internet of Things

JS

Javascript

MB

Megabyte

OS

Operating System


PHP

Hypertext Preprocessor

REST

Representational State Transfer

SPA

Single-Page Application

SQL

Structured Query Language

SSL

Secure Sockets Layer

TB

Terabyte

VCS
VS

Version Control System
Visual Studio


TÓM TẮT KHÓA LUẬN
Đề tài “Xây dựng website nghe nhạc trực tuyến” cung cấp một nền tảng
cho người dùng có thể nghe nhạc, quản lý, đăng tải bài hát từ nhiều nguồn
trên mạng Internet; bên cạnh đó gồm có các chức năng tiện ích như phân loại
thể loại bài hát, tạo phụ đề, tạo danh sách.
Phía front-end sử dụng Vue.js, một framework được xây dựng trên
HTML, CSS và Javascript, cung cấp các chức năng cho việc xây dựng giao
diện website.

Phía back-end sử dụng EF để ánh xạ các đối tượng của CSDL lên đối
tượng C#; .NET Core là một nền tảng phát triển đa mục đích, mã nguồn mở
duy trì bởi Microsoft và cộng đồng .NET trên Github; là nền tảng chéo hỗ trợ
Windows, macOS và Linux, và có thể được sử dụng để xây dựng các ứng
dụng thiết bị, đám mây, IoT...
Bên cạnh đó website chạy trên Azure App Service, một dịch vụ dựa
trên HTTP để lưu trữ các ứng dụng web, REST API và các back-end khác; và
Azure Blob Storage để lưu trữ file ảnh và âm thanh; là một dịch vụ hay đơn
giản là một công cụ cho phép lưu trữ dữ liệu trên cloud, mỗi dữ liệu đưa lên
để lưu trữ thì ta coi đó như là một object, có thể là text, dữ liệu nhị phân, các
tài liệu, file cài đặt khác, ...

15


Nội dung khóa 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ơ bộ về đề tài và lý do thực hiện.
Xác định mục tiêu, phạm vi đề tài.
- 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 khóa luận.
- Chương 03: Thiết kế ứng dụng
Phân tích yêu cầu, thiết kế.
- Chương 04: Xây dựng ứng dụng
Hiện thực và triển khai ứng dụng.
- Chương 05: Kết luận
Những thuận lợi, khó khăn trong quá trình phát triển đề tài và nêu ra
hướng phát triển trong tương lai.

16


CHƯƠNG 1: TỔNG QUAN
1.1. Lý do chọn đề tài
Hiện nay âm nhạc là một trong những nguồn giải trí tối ưu và không thể
thiếu của con người. Đặc biệt, âm nhạc cịn có thể tác động lớn đến q trình
hình thành phát triển của con người.
Âm nhạc có tác dụng phản ánh trí tuệ, tư tưởng, cũng như tác động mạnh
mẽ và sâu sắc đến cảm xúc của con người. Âm nhạc có ý nghĩa cực kỳ quan
trọng đối với hạnh phúc của con người. Nó giúp xua tan khổ đau, mang lại
niềm vui sướng, sự tươi trẻ, tràn đầy sức sống. Thưởng thức những ca khúc
yêu thích giúp con người thư thái và có rất nhiều trải nghiệm thú vị.
1.2. Mục tiêu đề tài
- Xây dựng website nghe nhạc trực tuyến đáp ứng những tính năng như
nghe nhạc, đăng tải bài hát, tạo danh sách bài hát, ...
- Xây dựng giao diện dễ nhìn, dễ sử dụng cho người dùng.
1.3. Phạm vi
Đề tài tập trung xây dựng website với các chức năng chính như sau:
- Đăng nhập, đăng ký.
- Nghe nhạc.
- Nghe nhạc offline.
- Tìm bài hát.
- Tìm nhạc sĩ.
- Quản lý bài hát.
- Quản lý danh sách các bài hát.
- Hiển thị danh sách các bài hát được nghe nhiều nhất trong ngày.

17

- Hiển thị danh sách các bài hát được nghe và yêu thích nhiều nhất theo
từng thể loại.
- Hiển thị danh sách bài hát từ người dùng đang theo dõi.
- Tải xuống bài hát.
1.4. Đối tượng sử dụng
- Những người có sở thích nghe nhạc.
- Những người có mong muốn chia sẻ, đăng tải bài hát yêu thích.
- Những người có mong muốn chia sẻ bài hát tự sáng tác.
1.5. Phương pháp thực hiện
- Tìm hiểu, nghiên cứu các website nghe nhạc trực tuyến trên thị trường,
các tính năng hiện có, các hạn chế, ...
- Phân tích các chức năng cần thực hiện.
- Phân tích, đặc tả phần mềm.
- Thiết kế kiến trúc phần mềm và cơ sở dữ liệu.
- Phát triển các chức năng.
- Thiết kế giao diện cho website.
- Kiểm tra và sửa lỗi.
- Triển khai phần mềm.
1.6. Kết quả mong đợi
Ứng dụng có thể đáp ứng được các nhu cầu:
- Yêu cầu chức năng: Đáp ứng được các yêu cầu đề ra.
- Giao diện đơn giản, dễ hiểu, dễ sử dụng.
- Hiệu năng: ít lỗi, tốc độ xử lý nhanh.

18


CHƯƠNG 2: KIẾN THỨC NỀN TẢNG
2.1. Công cụ quản lý và phát triển

2.1.1. Visual Studio Code

Hình 2.1 Visual Studio Code [1]

Visual Studio Code chính là ứng dụng cho phép biên tập, soạn thảo
các đoạn code để hỗ trợ trong quá trình thực hiện xây dựng, thiết kế
website một cách nhanh chóng. Visual Studio Code hay cịn được viết tắt
là VS Code. Trình soạn thảo này vận hành mượt mà trên các nền tảng như
Windows, macOS, Linux. Hơn thế nữa, VS Code cịn cho khả năng tương
thích với những thiết bị máy tính có cấu hình tầm trung vẫn có thể sử dụng
dễ dàng.
Visual Studio Code hỗ trợ đa dạng các chức năng Debug, đi kèm với
Git, có Syntax Highlighting. Đặc biệt là tự hồn thành mã thơng minh,
Snippets, và khả năng cải tiến mã nguồn. Nhờ tính năng tùy chỉnh, Visual
Studio Code cũng cho phép các lập trình viên thay đổi Theme, phím tắt, và
đa dạng các tùy chọn khác. Mặc dù trình soạn thảo Code này tương đối
nhẹ, nhưng lại bao gồm các tính năng mạnh mẽ.
Visual Studio Code là gì được rất nhiều người tìm hiểu. Đây cũng là
một trong các ứng dụng được dân IT “săn đón” và tải về và sử dụng rất
nhiều. Visual Studio Code cũng ln có những cải tiến và tạo ra đa dạng
các tiện ích đi kèm từ đó giúp cho các lập trình viên sử dụng dễ dàng hơn.
Trong đó có thể kể đến những ưu điểm sau:
19


• Đa dạng ngơn ngữ lập trình giúp người dùng thỏa sức sáng tạo và sử
dụng như HTML, CSS, JavaScript, C++,…
• Ngơn ngữ, giao diện tối giản, thân thiện, giúp các lập trình viên dễ
dàng định hình nội dung.
• Các tiện ích mở rộng rất đa dạng và phong phú.

• Tích hợp các tính năng quan trọng như tính năng bảo mật (Git), khả
năng tăng tốc xử lý vòng lặp (Debug),…
• Đơn giản hóa việc tìm quản lý hết tất cả các Code có trên hệ thống.
Visual Studio Code là một trong những trình biên tập Code rất phổ biến
nhất hiện nay. Ứng dụng này cũng ngày càng chứng tỏ ưu thế vượt trội của
mình khi so sánh với những phần mềm khác. Tuy bản miễn phí khơng có
nhiều các tính năng nâng cao nhưng Visual Studio Code thực sự có thể đáp
ứng được hầu hết nhu cầu cơ bản của lập trình viên.
2.1.2. Visual Studio

Hình 2.2 Visual Studio [2]

Visual Studio là một phần mềm lập trình hệ thống được sản xuất
trực tiếp từ Microsoft. Từ khi ra đời đến nay, Visual Studio đã có rất nhiều
các phiên bản sử dụng khác nhau. Điều đó, giúp cho người dùng có thể lựa
chọn được phiên bản tương thích với dịng máy của mình cũng như cấu
hình sử dụng phù hợp nhất.

20


Bên cạnh đó, Visual Studio cịn cho phép người dùng có thể tự chọn
lựa giao diện chính cho máy của mình tùy thuộc vào nhu cầu sử dụng.
Một số tính năng của phần mềm Visual Studio:
• Biên tập mã
Giống như bất kỳ một IDE khác, Visual Studio gồm có một trình
soạn thảo mã hỗ trợ tơ sáng cú pháp và hồn thiện mả bằng các sử dụng
IntelliSense khơng chỉ cho các hàm, biến và các phương pháp mà còn
sử dụng cho các cấu trúc ngôn ngữ như: Truy vấn hoặc vịng điều
khiển.

Bên cạnh đó, các trình biên tập mã Visual Studio cũng hỗ trợ cài đặt
dấu trang trong mã để có thể điều hướng một cách nhanh chóng và dễ
dàng. Hỗ trợ các điều hướng như: Thu hẹp các khối mã lệnh, tìm kiếm
gia tăng,…
Visual Studio cịn có tính năng biên dịch nền tức là khi mã đang
được viết thì phần mềm này sẽ biên dịch nó trong nền để nhằm cung
cấp thông tin phản hồi về cú pháp cũng như biên dịch lỗi và được đánh
dấu bằng các gạch gợn sóng màu đỏ.
• Trình gỡ lỗi
Visual Studio có một trình gỡ lỗi có tính năng vừa lập trình gỡ lỗi
cấp máy và gỡ lỗi cấp mã nguồn. Tính năng này hoạt động với cả hai
mã quản lý giống như ngơn ngữ máy và có thể sử dụng để gỡ lỗi các
ứng dụng được viết bằng các ngôn ngữ được hỗ trợ bởi Visual Studio.

21


2.1.3. Git

Hình 2.3 Git [3]

Git là hệ thống quản lý các phiên bản dưới dạng phân tán. Đây là hệ
thống quản lý phổ biến nhất hiện nay. Git là một phiên bản của Distributed
Version Control System – DVCS hay còn gọi là VCS. Sử dụng Git sẽ đem
tới cho các lập trình viên một kho lưu trữ, trong đó chứa đầy đủ các lịch sử
thay đổi của hệ thống.
Git là một VCS. Tuy nhiên, so với các VCS thông thường, Git cũng
có một số điểm khác biệt. Trong đó, điểm khác biệt nổi bật nhất của Git đó
là cách đọc và lưu trữ dữ liệu của phần mềm này.
Về mặt khái niệm, hầu hết các hệ thống lưu trữ thông tin bằng cách

thay đổi dựa trên file và lưu trữ thông tin dưới dạng danh sách. Hệ thống
này sẽ tổng hợp và cập nhật thơng tin, sau đó lưu trữ dưới dạng một tập
hợp danh sách. Các file có thể thay đổi theo thời gian.
Tuy nhiên, cách hoạt động và lưu trữ thơng tin của Git lại hồn tồn
khác. Để lưu trữ thông tin, Git sẽ coi các thông tin là một tập hơn
snapshot. Đây là tập hợp toàn bộ ảnh chụp các nội dung của file thông tin
tại thời điểm.
Khi đưa ra các lệnh, git sẽ chụp lại thông tin ở thời điểm đó và tạo ra
một snapshot. Để nâng cao tính hiệu quả, Git sẽ khơng lưu trữ file nếu các
tệp khơng có sự thay đổi. Thay vào đó, phần mềm sẽ liên kết dữ liệu tới
một tệp giống với file đã được lưu trữ trước đó.
22


Nhờ vào điểm khác biệt với các VCS này, Git sẽ không tốn nhiều thời
gian xem xét các thông tin, các bản giải mã của phiên bản/hệ thống trước.
Thay vào đó, Git nghĩ về dữ liệu khác, giúp việc lưu trữ dễ dàng hơn. Với
cách lưu trữ thông minh này, Git giống như một hệ thống gồm nhiều tệp
nhỏ khác nhau.
2.1.4. Github

Hình 2.4 Github [4]

Github là một hệ thống quản lý dự án và phiên bản code, hoạt động
giống như một mạng xã hội cho lập trình viên. Các lập trình viên có thể
clone lại mã nguồn từ một repository và Github chính là một dịch vụ máy
chủ repository cơng cộng, mỗi người có thể tạo tài khoản trên đó để tạo ra
các kho chứa của riêng mình để có thể làm việc.
Github là một dịch vụ nổi tiếng cung cấp kho lưu trữ mã nguồn Git
cho các dự án phần mềm. Github có đầy đủ những tính năng của Git, ngồi

ra nó cịn bổ sung những tính năng về social để các developer tương tác
với nhau.
Vài thông tin về Git:
• Là cơng cụ giúp quản lý source code tổ chức theo dạng dữ liệu phân
tán.
• Giúp đồng bộ source code của team lên 1 server.
23


• Hỗ trợ các thao tác kiểm tra source code trong quá trình làm việc
(diff, check modifications, show history, merge source, …)
Github có 2 phiên bản: miễn phí và trả phí. Với phiên bản có phí
thường được các doanh nghiệp sử dụng để tăng khả năng quản lý team
cũng như phân quyền bảo mật dự án.
Cịn lại thì phần lớn chúng ta đều sử dụng Github với tài khoản miễn
phí để lưu trữ source code.
Github cung cấp các tính năng social networking như feeds, followers,
và network graph để các developer học hỏi kinh nghiệm của nhau thông
qua lịch sử commit.
Nếu một comment để mơ tả và giải thích một đoạn code. Thì với
Github, commit message chính là phần mơ tả hành động mà bạn thực hiện
trên source code.
Github trở thành một yếu tố có sức ảnh hưởng lớn trong cộng động
nguồn mở. Cùng với Linkedin, Github được coi là một sự thay thế cho CV
của lập trình viên. Các nhà tuyển dụng cũng rất hay tham khảo Github
profile để hiểu về năng lực coding của ứng viên.
Giờ đây, kỹ năng sử dụng git và Github từ chỗ ưu thích sang bắt buộc
phải có đối với các ứng viên đi xin việc.
Github được coi là một mạng xã hội dành cho lập trình viên lớn nhất và
dễ dùng nhất với các tính năng cốt lõi như:

• Wiki, issue, thống kê, đổi tên project, project được đặt vào
namespace là user.

24


• Watch project: theo dõi hoạt động của project của người khác. Xem
quá trình người ta phát triển phầm mềm thế nào, project phát triển ra
sao.
• Follow user: theo dõi hoạt động của người khác.
Có 2 cách tiếp cận Github: Tạo project của riêng mình Contribute cho
project có sẵn: fork project có sẵn của người khác, sửa đổi, sau đó đề nghị
họ cập nhật sửa đổi của mình (tạo pull request).
2.1.5. Insomnia

Hình 2.5 Insomnia [5]

Insomnia là một ứng dụng máy tính đa nền tảng giúp các lập trình viên
làm việc với giao thức HTTP một các thuận tiện. Giao diện sử dụng của
Insomnia rất đơn giản mà lại không nhàm chán. Trong lĩnh vực Internet of
Things hoặc Embedded System thì chúng ta thường làm việc với các module
Wifi , Ethernet, GPRS, 3G để truyền nhận dữ liệu với Server thông qua giao
thức HTTP bằng các phương thức phổ biến như GET, POST.

25