Đồ án Xây Dựng Website đọc truyện tranh sử dụng công nghệ GitHub, Jira môn Công nghệ thông tin | Trường Đại học Lạc Hồng

MỤC LỤC . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .6
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
1.1 Giới thiệu. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
1.2 Công nghệ sử dụng. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
1.3 Kết quả dự kiến:. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
CHƯƠNG 2: SỬ DỤNG CÔNG CỤ QUẢN LÝ PHIÊN BẢN MÃ NGUỒN (GIT). . . . . . . . . . . . . .9
1.1 Giới thiệu. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
1.2 Các bước triển khai. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .9
1.2.1 Cài đặt git trên windows. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
1.2.2 Tạo tài khoản trên Github. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
1.2.3 Tạo thư mục respository local trên máy. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
1.2.4 Tạo thư mục respository trên server. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
1.2.5 Dùng lệnh git clone để sao chép respository về máy. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
1.2.6 Dùng lệnh cd để di chuyển vào thư mục ThucHanhGit. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
1.2.7 Dùng lệnh git add. để thêm tất cả các file mới vào repository. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
1.2.8 Dùng lệnh git commit -m “. .” để commit thay đổi vào repository. . . . . . . . . . . . . . . . . . . . . . . . . .11
1.2.9 Dùng lệnh git tag Tag1 để đánh dấu tag theo yêu cầu. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .11
1.2.10 Dùng lệnh git push origin Tag1 để đẩy tag gửi nội dung lên github. . . . . . . . . . . . . . . . . . . . . . . .11
1.2.11 Dùng lệnh git rm và git rm -r “. .” để xóa một vài file trong thư mục. . . . . . . . . . . . . . . . . . . . . . 12
1.2.12 Xem danh sách các trạng thái thay đổi của thư mục (log). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
1.2.13 Tạo project trên Github. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .12
1.2.14 Thử các câu lệnh: Git fetch, Git stash, VIM. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
1.2.15 Các trường hợp khác như xung đột mã nguồn, giải quyết xung đột. . . . . . . . . . . . . . . . . . . . . . . .14
CHƯƠNG 3: CÔNG CỤ QUẢN LÝ DỰ ÁN (JIRA). . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .16
3.1. Giới thiệu. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
3.2. Các tính năng. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
3.2.1. Tạo project. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17 2
3.2.2. Tạo Board. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .18
3.2.3. Tạo issues. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .18
3.2.4. Tìm issues trong Jira. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
3.2.5. Workflow trong Jira. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
3.2.6. Tạo workflow. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .22
3.3. Hướng dẫn sử dụng. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .23 3 MỤC LỤC HÌNH ẢNH
Hình 2. 1: Cài đặt git trên windows . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
Hình 2. 2: Đăng kí tài khoản Github . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
Hình 2. 3: Tạo thư mực local repository trên máy . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Hình 2. 4: Tạo thư mục repository trên server . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
Hình 2. 5: Dùng lệnh git clone để sao chép respository về máy. . . . . . . . . . . . . . 12
Hình 2. 6: Dùng lệnh cd để di chuyển vào thư mục ThucHanhGit. . . . . . . . . . . . . . . . . . 12
Hình 2. 7: Dùng lệnh git add. để thêm tất cả các file mới vào repository . . . . . . . . . . . . 12
Hình 2. 8: Dùng lệnh git commit -m “. .” để commit thay đổi vào repository. . . . . . . . . 13
Hình 2. 9: Dùng lệnh git tag Tag1 để đánh dấu tag theo yêu cầu. . . . . . . . . . . . . . . . . . . 13
Hình 2. 10: Dùng lệnh git push origin master để đẩy cập nhật branch master. . . . . . . . . 13
Hình 2. 11: Dùng lệnh git push origin Tag1 để đẩy tag gửi nội dung lên github. . . . . . . 13
Hình 2. 12: Dùng lệnh git push origin Tag1 để đẩy tag gửi nội dung lên github. . . . . . . 13
Hình 2. 13: Xem danh sách các trạng thái thay đổi của thư mục (log). . . . . . . . . . . . . . . 14
Hình 2. 14: Tạo project trên Github. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
Hình 2. 15: Thử các câu lệnh: Git fetch, Git stash, VIM, vi vimrc, git revert, git cherry-
pick. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
Hình 2. 16: Lịch sử commit. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
Hình 3. 1: Tạo Project. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
Hình 3. 2: Tạo Board . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
Hình 3. 3: Tạo Issues . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Hình 3. 4: Tìm Issues trong Jira . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
Hình 3. 5: Workflow trong Jira . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
Hình 3. 6: Tạo Workflow . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
Hình 3. 7: Các bước kết nối . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25 4
Hình 3. 8: Mời team làm việc . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25 5 MỤC LỤC BẢNG
Bảng 1. 1: Kết quả dự kiến . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8 6
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 1.1 Giới thiệu
Trong thời đại hiện nay, công nghệ thông tin đóng vai trò không thể phủ nhận trong vô số lĩnh vực
của cuộc sống, từ những hoạt động cơ bản đến những lĩnh vực cao cấp. Một trong những ví dụ
điển hình là dịch vụ đọc truyện tranh trực tuyến, đã trở thành một phần không thể thiếu của thời
gian giải trí đương đại, đặc biệt đối với giới trẻ. Tuy nhiên, không chỉ đơn thuần là một phương
tiện giải trí phổ biến, dịch vụ đọc truyện tranh trực tuyến còn mang lại nhiều lợi ích đối với các
nhà phân phối, từ việc giảm chi phí quản lý đến mở rộng thị trường bản in kỹ thuật số. Đồng thời,
nó còn đóng vai trò quan trọng trong việc đưa truyện tranh đến với mọi tầng lớp xã hội, tạo ra một
cộng đồng độc giả tiềm năng với sự đa dạng và phong phú của nội dung.
Các nền tảng đọc truyện tranh trực tuyến không chỉ là nơi lưu trữ các tác phẩm nghệ thuật, mà còn
là một công cụ mạnh mẽ cho các tác giả và nhà xuất bản để xây dựng và quảng bá thương hiệu của
họ. Trên những nền tảng này, họ có thể linh hoạt điều chỉnh giao diện, nội dung và cấu trúc của
truyện tranh một cách dễ dàng, tạo ra những trải nghiệm độc đáo và thu hút đối với độc giả. Hơn
nữa, việc thiết kế giao diện đơn giản và thân thiện với người dùng giúp vượt qua mọi rào cản về
kiến thức công nghệ, giúp mọi người dễ dàng tiếp cận và tận hưởng tác phẩm một cách tự nhiên nhất.
1.2 Công nghệ sử dụng
Đồ án môn học với đề Xây Dựng Website đọc truyện tranh sử dụng công nghệ:
• GitHub: 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.
• Jira: Nền tảng để quản lý dự án và theo dõi công việc một cách hiệu quả,
được sử dụng rộng rãi trong cộng đồng developer. Các tính năng như Kaban,
Scrum giúp lên kế hoạch, theo dõi tiến độ, kiểm tra vấn đề và báo cáo hiệu
quả, dồng thời Jira cũng tích hợp với các hệ thống, công cụ phát triển phần
mềm khác như GitHub để tạo ra một môi trưởng làm việc linh hoạt.
1.3 Kết quả dự kiến: 7
Bảng 1. 1: Kết quả dự kiến CHỨC NĂNG PHÁT TRIỂN YÊU CẦU NỘI DUNG TRANG NGƯỜI
- Giao diện hài hoà, bắt mắt người xem DÙNG
- Tìm kiếm theo tên truyện tranh
- Xem chi tiết truyện tranh
- Tính năng bookmark, favorite.
- Xem lịch sử đọc truyện. 8
CHƯƠNG 2: SỬ DỤNG CÔNG CỤ QUẢN LÝ PHIÊN BẢN MÃ NGUỒN (GIT) 1.1 Giới thiệu
Dự án sử dụng công cụ quản lý mã nguồn là Git với lữu trữ mã nguồn tại Github.
1.2 Các bước triển khai
Cấu hình người sử dụng
Thực hiện các thao tác sau:
1.2.1 Cài đặt git trên windows
Hình 2. 1: Cài đặt git trên windows
1.2.2 Tạo tài khoản trên Github.
Hình 2. 2: Đăng kí tài khoản Github 9 1.2.3
Tạo Github respository
Hình 2. 3: Tạo Github repository
1.2.4 Tạo thư mục respository trên server.
Hình 2. 4: Tạo thư mục repository trên server
1.2.5 Dùng lệnh git clone để sao chép respository về máy.
Hình 2. 5: Dùng lệnh git clone để sao chép respository về máy. 10
1.2.6 Dùng lệnh cd để di chuyển vào thư mục ThucHanhGit.
Hình 2. 6: Dùng lệnh cd để di chuyển vào thư mục ThucHanhGit.
1.2.7 Dùng lệnh git add. để thêm tất cả các file mới vào repository.
Hình 2. 7: Dùng lệnh git add. để thêm tất cả các file mới vào repository
1.2.8 Dùng lệnh git commit -m “. .” để commit thay đổi vào repository.
Hình 2. 8: Dùng lệnh git commit -m “. .” để commit thay đổi vào repository.
1.2.9 Dùng lệnh git tag Tag1 để đánh dấu tag theo yêu cầu.
Hình 2. 9: Dùng lệnh git tag Tag1 để đánh dấu tag theo yêu cầu.
Hình 2. 10: Dùng lệnh git push origin master để đẩy cập nhật branch master.
1.2.10 Dùng lệnh git push origin Tag1 để đẩy tag gửi nội dung lên github. 11
Hình 2. 11: Dùng lệnh git push origin Tag1 để đẩy tag gửi nội dung lên github.
1.2.11 Dùng lệnh git rm và git rm -r “. .” để xóa một vài file trong thư mục.
Hình 2. 12: Dùng lệnh git push origin Tag1 để đẩy tag gửi nội dung lên github.
1.2.12 Xem danh sách các trạng thái thay đổi của thư mục (log).
Hình 2. 13: Xem danh sách các trạng thái thay đổi của thư mục (log).
1.2.13 Tạo project trên Github.
Hình 2. 14: Tạo project trên Github. 12
1.2.14 Thử các câu lệnh: Git fetch, Git stash, VIM. . 13
Hình 2. 15: Thử các câu lệnh: Git fetch, Git stash, VIM, vi vimrc, git revert, git cherry-pick.
1.2.15 Các trường hợp khác như xung đột mã nguồn, giải quyết xung đột.
Các trường hợp giả định khác gặp phải khi đóng góp mã nguồn trong nhóm. 14
Hình 2. 16: Lịch sử commit. 15
CHƯƠNG 3: CÔNG CỤ QUẢN LÝ DỰ ÁN (JIRA) 3.1. Giới thiệu
Jira là một ứng dụng quản lý dự án và theo dõi công việc được phát triển bởi Atlassian.
Được sử dụng rộng rãi trong cả phát triển phần mềm và quản lý dự án, Jira giúp tổ chức và theo
dõi công việc, quản lý nhiệm vụ, và theo dõi tiến độ công việc trong môi trường làm việc nhóm.
Các tính năng quan trọng của Jira bao gồm:
 Quản lý Sản phẩm và Dự án: Jira cung cấp công cụ để tạo và quản lý các dự án và sản phẩm,
theo dõi tiến độ và quản lý nguồn lực.
 Quản lý Nhiệm vụ (Issue): Người dùng có thể tạo và theo dõi các nhiệm vụ (issue), như bug,
tính năng mới, công việc cần làm, và nhiều loại công việc khác.
 Kế Hoạch và Sprint: Jira h trợ quản lý kế hoạch dự án và quản lý Sprint trong phát triển
theo phương pháp Scrum hoặc Kanban.
 Báo cáo và Thống kê: Cung cấp các công cụ báo cáo để theo dõi tiến độ, hiệu suất và các
thống kê khác về dự án.
 Tích hợp và Mở rộng: Jira có thể tích hợp với nhiều công cụ và dịch vụ khác nhau, như
Bitbucket, Confluence, Slack, và nhiều ứng dụng mở rộng khác. 16 3.2. Các tính năng 3.2.1. Tạo project
Hình 3. 1: Tạo Project. 3.2.2. Tạo Board 17 Hình 3. 2: Tạo Board 3.2.3. Tạo issues
Issue khi được tạo sẽ thuộc board hoặc backlog. Issue
khi được tạo sẽ thuộc board hoặc backlog.
Hình 3. 3: Tạo Issues
Trong trang hiển thị issue, bạn cũng có thể thiết lập những trường thông tin nào sẽ hiển thị trong
trang issue nh m giúp công việc diễn ra suôn sẻ hơn.
 Description: Vì phần này là nơi đầu tiên người dùng nhìn vào khi họ mở một issue, nên các
trường quan trọng nhất của bạn sẽ được định cấu hình tại đây.
 Các trường Context: Khi thiết lập các trường thông tin, bạn sẽ thấy tất cả những trường
thông tin n m phía trên mục “Hide when empty” đều sẽ được xuất hiện trong nhóm Details
(bạn có thể xem thêm hình ở dưới để dễ hình dung). M i người dùng có thể ghim các trường
context quan trọng với họ vào trường Pinned (Pinned fields). 18
 Cấu hình bố cục issue䍟 Configure: Chọn Configure để thay đổi vị trí và khả năng hiển thị của
các trường trong trang hiển thị issue.
3.2.4. Tìm issues trong Jira
Hình 3. 4: Tìm Issues trong Jira
3.2.5. Workflow trong Jira
Workflow trong Jira thể hiện quy trình mà m i team sử dụng để xử lý issue từ khi tạo đến khi
hoàn thành và cũng thường đại diện cho các quy trình làm việc thực tế trong tổ chức của bạn. 19
Hình 3. 5: Workflow trong Jira
Workflow trong Jira bao gồm 3 yếu tố:
 Trạng thái䍟 Status: Status cho biết issue hiện đang ở đâu trong quy trình làm việc. Một số ví
dụ về trạng thái issue có thể bao gồm: Mở, Đang tiến hành, Đang xem xét, Đã lên lịch, Đang chờ xử lý, Đang chờ,
 Quá trình chuyển đổi䍟 Transition: Transition thể hiện hành động được thực hiện để chuyển
một issue từ trạng thái này sang trạng thái khác. Transition là liên kết một chiều, vì vậy nếu
một issue cần di chuyển qua lại giữa hai trạng thái, thì cần phải tạo hai quá trình chuyển đổi. 20
 Kết quả䍟 Resolution: Khi một task đã hoàn thành và không còn mở nữa, bạn cần thiết lập
Resolution. Một số ví dụ về trạng thái kết quả có thể bao gồm: Đã đóng, Đã giải quyết, Đã
vận chuyển, Đã hoàn thành, Đã bị từ chối, Sẽ không thực hiện, 21