Tải bản đầy đủ (.pdf) (90 trang)

Đồ án tốt nghiệp: Xây dựng website học lập trình bằng spring boot docker, nodejs, reactjs

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (2.68 MB, 90 trang )

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP. HỒ CHÍ MINH
KHOA CÔNG NGHỆ THÔNG TIN
BỘ MÔN CÔNG NGHỆ PHẦN MỀM

ĐỀ TÀI:
XÂY DỰNG WEBSITE HỌC LẬP TRÌNH BẰNG SPRING BOOT
DOCKER, NODEJS, REACTJS

SINH VIÊN THỰC HIỆN:
HỒ NGUYỄN HOÀNG QUÂN

16110429

TRẦN THÀNH ĐẠT

16110308

GIẢNG VIÊN HƯỚNG DẪN
THẦY NGUYỄN MINH ĐẠO

NĂM HỌC 2019 – 2020


TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP. HỒ CHÍ MINH
KHOA CÔNG NGHỆ THÔNG TIN
BỘ MÔN CÔNG NGHỆ PHẦN MỀM

ĐỀ TÀI:
XÂY DỰNG WEBSITE HỌC LẬP TRÌNH BẰNG SPRING BOOT
DOCKER, NODEJS, REACTJS


SINH VIÊN THỰC HIỆN:
HỒ NGUYỄN HOÀNG QUÂN

16110429

TRẦN THÀNH ĐẠT

16110308

GIẢNG VIÊN HƯỚNG DẪN
THẦY NGUYỄN MINH ĐẠO

NĂM HỌC 2019 – 2020
PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN


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 những người thân, bạn bè và quan
trọng là người thầy. 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 các thầy cơ, gia đình và
bạn bè.
Chúng em xin chân thành cảm ơn sự hướng dẫn tận tình trong suốt thời gian qua
của thầy Nguyễn Minh Đạo, khoa Công Nghệ Thông Tin, trường Đại học Sư phạm Kỹ
thuật Tp.HCM. Thầy đã định hướng, góp ý và cũng cấp cho chúng em rất nhiều kiến thức
về một lĩnh vực mới khi chúng em bắt đầu thực hiện tiểu luận. Nếu khơng có những lời
hướng dẫn, dạy bảo của thầy thì bài báo cáo này của chúng em rất khó có thể hoàn thiện
được.
Bài báo cáo được thực hiện trong thời gian ngắn và kiến thức của chúng em còn
nhiều hạn chế, bỡ ngỡ. Do vậy, không tránh khỏi những thiếu sót, em rất mong nhận được

những ý kiến đóng góp quý báu của thầy cô để kiến thức của chúng em trong lĩnh vực này
được hoàn thiện hơn. Sau cùng, chúng em xin kính chúc q thầy cơ dồi dào sức khỏe,
niềm tin tiếp tục thực hiện sứ mệnh cao đẹp của mình là truyền đạt kiến thức cho thế hệ
sau.
Trân trọng.
Nhóm sinh viên thực hiện


Mục lục
GIỚI THIỆU ĐỀ TÀI................................................................................................................................. 1
1.

TÍNH CẤP THIẾT CỦA ĐỀ TÀI. ................................................................................................ 1

2.

MỤC TIÊU CỦA ĐỀ TÀI. ............................................................................................................. 1

3.

CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU. ......................................................... 1
3.1

Đối tượng nghiên cứu. ............................................................................................................ 1

3.2

Phạm vi nghiên cứu................................................................................................................. 2

3.3


Phương pháp nghiên cứu. ...................................................................................................... 2

KẾT CẤU CỦA ĐỀ TÀI. ............................................................................................................... 3

6.

PHẦN NỘI DUNG ...................................................................................................................................... 4
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT ...................................................................................................... 4
1.

TỔNG QUAN VỀ DOCKER. .................................................................................................... 4

2.

TỔNG QUAN VỀ MONGODB VÀ NOSQL. .......................................................................... 7

3.

TỔNG QUAN VỀ SPRING FRAMEWORD. .......................................................................... 8

4.

TỔNG QUAN VỀ REACTJS. ................................................................................................. 10

CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU........................................... 12
1.

KHẢO SÁT HIỆN TRẠNG. .................................................................................................... 12


2.

PHÂN TÍCH YÊU CẦU. .......................................................................................................... 18

CHƯƠNG 3: MƠ HÌNH HĨA U CẦU VÀ THIẾT KẾ CSDL .................................................. 20
1.

LƯỢC ĐỒ USECASE. ............................................................................................................. 20

2.

PHÂN TÍCH CHỨC NĂNG, THIẾT KẾ CƠ SỞ DỮ LIỆU. ............................................... 36

3.

THIẾT KẾ HỆ THỐNG. ......................................................................................................... 55

CHƯƠNG 4: THIẾT KẾ GIAO DIỆN VÀ XỬ LÝ........................................................................... 60
1.

DANH SÁCH GIAO DIỆN NGƯỜI DÙNG........................................................................... 60

2.

DANH SÁCH GIAO DIỆN ADMIN. ...................................................................................... 69

CHƯƠNG 5: CÀI ĐẶT VÀ KIỂM THỬ. .......................................................................................... 73
1. CÀI ĐẶT. ....................................................................................................................................... 73
2. KIỂM THỬ. .................................................................................................................................. 77
PHẦN KẾT LUẬN. .................................................................................................................................. 80

1.

NHỮNG KẾT QUẢ ĐẠT ĐƯỢC................................................................................................ 80

2.

KHÓ KHĂN. ................................................................................................................................. 80

3.

ƯU ĐIỂM....................................................................................................................................... 80

4.

HẠN CHẾ. ..................................................................................................................................... 81

DANH MỤC TÀI LIỆU THAM KHẢO ................................................................................................. 81


Danh mục hình ảnh
Hình 1. Giao diện học trang w3schools.com .............................................................................................. 12
Hình 2. Danh sách khóa học trang w3schools.com ........................................................................................
Hình 3. Giao diện làm bài kiểm tra của w3schools.com............................................................................. 13
Hình 4. Giao diện làm bài của trang codewars.com ................................................................................... 14
Hình 5. Danh sách khóa học trang codewars.com ...................................................................................... 15
Hình 6. Giao diện thảo luận trang codewars.com ....................................................................................... 15
Hình 7. Danh sách ngơn ngữ lập trình trang hackerank.com ...................................................................... 16
Hình 8. Danh sách khóa học trang hackerank.com ..................................................................................... 16
Hình 9. Danh sách bài học trong hackerank.com ....................................................................................... 17
Hình 10. Giao diện làm bài rang hackerank.com ........................................................................................ 17

Hình 11. Giao diện thử thách trang hackerank.com.................................................................................... 18
Hình 12. Lược đồ user case tổng quan........................................................................................................ 20
Hình 13. Lược đồ chi tiết use case học lập trình. ........................................................................................ 21
Hình 14. Lược đồ chi tiết use case tham gia forum. ................................................................................... 21
Hình 15. Lược đồ chi tiết use case quản lý thông tin cá nhân. ................................................................... 22
Hình 16. Lược đồ use case chi tiết chức năng đóng góp cáu hỏi. ............................................................... 23
Hình 17. Lược đồ chi tiết chức năng quản lý khóa học. ............................................................................. 24
Hình 18. Lược đồ chi tiế chức năng quản lý thử thách. .............................................................................. 24
Hình 19. Lược đồ chi tiết chức năng quản lý user. ..................................................................................... 25
Hình 20. Sơ đồ luồng dữ liệu xem danh sách bài học................................................................................. 36
Hình 21. Thiế kế cơ sở dữ liệu xem danh sách bài học. ............................................................................. 37
Hình 22. Sơ đồ luồng dữ liệu gửi và xem kết quả thực hành. ..................................................................... 37
Hình 23. Thiết kế cơ sở dữ liệu gửi và xem kết quả thực hành. ................................................................ 39
Hình 24. Sơ đồ luồng dữ liệu kiểm tra compile. ......................................................................................... 39
Hình 25. Sơ đồ luồng dữ liệu thảo luận khi làm bài thực hành. ................................................................. 40
Hình 26. Thiết kế cơ sở dữ liệu chức năng thảo luận làm bài .................................................................... 41
Hình 27. Sơ đồ luồng dữ liệu xem danh sách bài viết tại forum. ................................................................ 42
Hình 28. Sơ đồ luồng dữ liệu tạo và chỉnh sửa bài viết trong forum. ......................................................... 42
Hình 29. Thiết kế cơ sở dữ liệu tạo bài viết và chỉnh sửa bài viết trong forum. ......................................... 44
Hình 30. Sơ đồ luồng dữ liệu bình luận bài viết của người dùng. .............................................................. 44
Hình 31. Thiết kế cơ sở dữ liệu bình luận bài viết của người dùng. ........................................................... 45
Hình 32. Sơ đơ luồng dữ liệu trả lời bình luận của người dùng khác. ........................................................ 46
Hình 33. Sơ đồ luồng dữ liệu bình chọn bình luận lên đầu bài viết. ........................................................... 47
Hình 34. Sơ đồ luồng dữ liệu đóng góp và chỉnh sửa cấu hỏi. ................................................................... 48
Hình 35. Sơ đồ luồng dữ liệu phê duyệt câu hỏi đóng góp. ........................................................................ 49


Hình 36. Sơ đồ luồng dữ liệu thêm khóa học. ............................................................................................ 50
Hình 37. Thiết kế cơ sở dữ liệu thêm khóa học. ......................................................................................... 51
Hình 38. Sơ đồ luồng dữ liệu xóa khóa học. ............................................................................................... 51

Hình 39. Sơ đồ luồng dữ liệu thêm thử thách. ............................................................................................ 52
Hình 40. Thiết kế cơ sở dữ liệu thêm thử thách. ......................................................................................... 53
Hình 41. Sơ đồ luồng dữ liệu xóa thử thách. .............................................................................................. 53
Hình 42. Lược đồ lớp server quản lý. ......................................................................................................... 55
Hình 43. Lược đồ lớp server compile code. ................................................................................................ 56
Hình 44. Giao diện trang chủ. ..................................................................................................................... 60
Hình 45. Giao diện forum. .......................................................................................................................... 61
Hình 46. Giao diện mơ tả chi tiết topic. ...................................................................................................... 62
Hình 47. Giao diện thêm topic. ................................................................................................................... 64
Hình 48. Giao diện gửi bình luận................................................................................................................ 65
Hình 49. Giao diện trang web học. ............................................................................................................. 66
Hình 50. Giao diện trang web học 2. .......................................................................................................... 66
Hình 51. Giao diện trang web học 3. .......................................................................................................... 67
Hình 52. Giao diện làm bài. ........................................................................................................................ 68
Hình 53. Giao diện chỉnh sửa thơng tin cá nhân. ........................................................................................ 69
Hình 54. Giao diện quản lý khóa học.......................................................................................................... 70
Hình 55. Giao diện quản lý bài học. ........................................................................................................... 71
Hình 56. Giao diện quản ls thử thách.......................................................................................................... 72
Hình 57. Import dự án và chạy bằng eclipse (1). ........................................................................................ 75
Hình 58. Import dự án và chạy bằng eclipse (2). ........................................................................................ 76
Hình 59. Danh sách test case ...................................................................................................................... 80

Danh mục bảng biểu.
Bảng 1. Mô tả chi tiết use case đăng nhặp .................................................................................................. 25
Bảng 2. Mô tả chi tiết use case đăng xuất. .................................................................................................. 26
Bảng 3. Mô tả chi tiết use case đổi mật khẩu. ............................................................................................. 26
Bảng 4. Mô tả chi tiết use case xem danh sách các bài luyện. .................................................................... 26
Bảng 5. Mô tả chi tiết use case xem danh sách các bài luyện. .................................................................... 27
Bảng 6. Mô tả chi tiết use case xem danh sách các bài luyện thuật tốn. ................................................... 27
Bảng 7. Mơ tả chi tiết use case tìm kiếm bài thực hành.............................................................................. 27

Bảng 8. Mô tả chi tiết use case xem chi tiết các bài lý thuyết. ................................................................... 28
Bảng 9. Mô tả chi tiết use case gửi và xem kết quả của bài thực hành. ...................................................... 28


Bảng 10. Kiểm tra cú pháp của bài thực hành. ........................................................................................... 28
Bảng 11. Mô tả chi tiết use case xem thảo luận của câu hỏi thực hành. ..................................................... 29
Bảng 12. Mô tả chi tiết use case xem danh sách bài viết tại forum. ........................................................... 29
Bảng 13. Mô tả chi tiết use case bình luận bài viết của người dùng khác. ................................................. 30
Bảng 14. Trả lời bình luận của người khác. ................................................................................................ 30
Bảng 15. Mơ tả chi tiết use case bình chọn bình luận lên top. .................................................................... 31
Bảng 16. Mơ tả chi tiết use case xem thông cá nhân. ................................................................................. 31
Bảng 17. Mô tả chi tiết use case chỉnh sửa thông tin cá nhân..................................................................... 31
Bảng 18. Mô tả chi tiết use case xem lại lịch sử làm bài. ........................................................................... 32
Bảng 19. Mơ tả chi tiết use case đóng góp thêm câu hỏi. ........................................................................... 32
Bảng 20. Mô tả chi tiết use case chỉnh sửa câu hỏi đã đóng góp. ............................................................... 33
Bảng 21. Mô tả chi tiết use case phê duyệ câu hỏi đóng góp. .................................................................... 33
Bảng 22. Mơ tả chi tiết use case thêm khóa học. ........................................................................................ 33
Bảng 23. Mơ tả chi tiết use case xóa khóa học. .......................................................................................... 34
Bảng 24. Chỉnh sửa khóa học. .................................................................................................................... 34
Bảng 25. Mơ tả chi tiết use case thêm thử thách......................................................................................... 35
Bảng 26. Mô tả chi tiết use case xóa thử thách. .......................................................................................... 35
Bảng 27. Mơ tả chi tiết use case chỉnh sửa thử thách. ................................................................................ 36
Bảng 28. Mô tả chi tiết use case quản lý người dùng. ................................................................................ 36
Bảng 29. Mô tả chi tiết giao diện trang chủ. ............................................................................................... 61
Bảng 30. Mô tả chi tiết giao diện forum . ................................................................................................... 62
Bảng 31. Mô tả chi tiết giao diện topic. ...................................................................................................... 63
Bảng 32. Mô tả chi tiết giao diện topic. ...................................................................................................... 65
Bảng 33. Mô tả chi tiết giao diện bình luận. ............................................................................................... 65
Bảng 34. Mơ tả chi tiết giao diện học. ........................................................................................................ 67
Bảng 35. Mô tả chi tiết giao diện làm bài. .................................................................................................. 68

Bảng 36. Mô tả chi tiết giao diện thông tin người dùng. ............................................................................ 69
Bảng 37. Mô tả chi tiết giao diện quản lý khóa học.................................................................................... 70
Bảng 38. Mơ tả chi tiết giao diện quản lý bài học. ..................................................................................... 72
Bảng 39. Mô tả chi tiết giao diện thử thách. ............................................................................................... 73


GIỚI THIỆU ĐỀ TÀI
1. TÍNH CẤP THIẾT CỦA ĐỀ TÀI.
Ngày nay việc tiếp thu kiến thức và luôn trao dồi cho mình những kỹ năng mới để bắt
kịp với xu hướng hiện đại là một trong những điều mà ai trong chúng ta, những người
muốn phát triển lâu dài đều phải làm liên tục. Đặc biệt là trong nghành công nghiệp chất
xám (Cơng nghệ thơng tin) này thì chúng ta luôn phải chủ động để học những công nghệ
mới, công cụ mới, và nhiều kiến thức khác nữa… để có thể áp dụng vào thực tiễn cho
các dự án đời sống một cách tối ưu nhất.
Tuy nhiên để học được những kiến thức mới này đối với nhiều bạn thực sự rất khó khăn,
bởi vì khơng phải ai cũng đủ điều kiện để đến trường lớp học được, bởi nhiều lý do khác
nhau như là khơng có thời gian đến lớp sau một ngày đi làm mệt mỏi, hay là các bạn có
gia cảnh khó khăn thì việc đến trường để học những kiến thức công nghệ được xem là
điều gì đó q xa vời.
Hiểu và nắm bắt được tình hình chung của mọi người, cũng như xu hướng của thế giới
đã đưa mọi thứ offline thành online thì hơm nay nhóm em đã quyết định làm ra một
website giúp mọi người có thể lên học và trao dồi kinh nghiệm về lập trình, từ đó để có
thể tạo bước đệm vững chắc để chúng ta có thể áp dụng vào cơng việc một cách có hiệu
quả và tối ưu tiết kiệm chi phí nhất, cũng như cùng nhau chung sức đưa đất nước thành
một trong những nước dẫn đầu về cơng nghệ thơng tin nói riêng và các nghành cơng
nghiệp khác nói chung.
2. MỤC TIÊU CỦA ĐỀ TÀI.
 Xây dựng website cho người dùng có thể:
 Là nơi ơn tập và học lý thuyết.
 Luyện các bài tập thực hành.

 Luyện giải các thuật toán, các bài tập phỏng vấn.
 Tạo một forum cho người dùng có thể trao đổi kiến thức cùng nhau.
3. CÁCH TIẾP CẬN VÀ PHƯƠNG PHÁP NGHIÊN CỨU.
3.1 Đối tượng nghiên cứu.


Học sinh.



Sinh viên.
1




Những người có nhu học các ngơn ngữ mới.



Giáo viên.



Người đã và đang đi làm.

3.2 Phạm vi nghiên cứu.


Tìm hiểu các cơng nghệ sau:




Docker



MongoDB



Spring boot framework



Nodejs



Reactjs



Tìm hiểu cách xây dựng thiết kế một hệ thống compiler code.



Tìm hiểu cách thiết kế UI/UX một cách rõ ràng.

3.3 Phương pháp nghiên cứu.

o Phương pháp tổng hợp lý thuyết: Nghiên cứu và tìm hiểu các tài liệu, ứng dụng
liên quan đến các công nghệ đang tìm hiểu.
o Phương pháp chuyên gia: Tham khảo ý kiến của Thầy hướng dẫn cùng các anh,
chị và bạn bè có kinh nghiệm liên quan đến các vấn đề của tiểu luận để tạo tính
chính xác và khoa học của đề tài.
o Phương pháp mơ hình hóa: Mơ phỏng website từ bước thiết kế cài đặt cho đến
kết
quả thành phẩm của website.
4. KẾT QUẢ DỰ KIẾN ĐẠT ĐƯỢC.


Xây dựng một hệ thống compiler code cho nhiều ngôn ngữ bao gồm các thành
phần:
 Container docker cho từng ngôn ngữ.
 Rest api cho client.



Xây dựng một hệ thống client bằng nodejs sử dụng hệ thống compile code để
xây
dựng một trang web cho người dùng có thể:
 Học lý thuyết và thực hành.
 Có thể thảo luận đóng góp xây dựng thông qua forum riêng.
2


5. Ý NGHĨA KHOA HỌC THỰC TIỄN.
Đề tài hướng đến khả năng tiếp thu, nâng cao kỹ năng lập trình, nghiên cứu công
nghệ mới và trên hết là đáp ứng nhu cầu ôn tập và học tập cho các đợt phòng vấn của
doanh nghiệp.

6. KẾT CẤU CỦA ĐỀ TÀI.
Chương 1: Khảo sát hiện trạng và xác định yêu cầu
Chương 2: Mơ hình hóa u cầu và thiết kế cơ sở dữ liệu
Chương 3: Thiết kế giao diện và xử lý
Chương 4: Lập trình
Chương 5: Kiểm thử phần mềm

3


PHẦN NỘI DUNG
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT
1. TỔNG QUAN VỀ DOCKER.
1.1. Docker là gì?
Docker là một nền tảng cho developers và sysadmin để develop, deploy và run
application với container. Nó cho phép tạo các mơi trường độc lập và tách biệt để khởi
chạy và phát triển ứng dụng và môi trường này được gọi là container. Khi cần deploy
lên bất kỳ server nào chỉ cần run container của Docker thì application của bạn sẽ được
khởi chạy ngay lập tức.
1.2. Lợi ích của docker.
 Khả năng start và stop chỉ vài giây, nhanh hơn nhiều so với sử dụng máy ảo.
 Khởi chạy container trên các hệ thống khác nhau mà bạn muốn.
 Việc xây dựng và loại bỏ nhanh và tốn ít chi phí hơn việc sử dụng máy ảo.
 Dễ dàng thiết lập môi trường làm việc. Chỉ cần 1 file config và config 1 lần
duy nhất và khơng bao giờ phải cài đặt lại các dependencies.
 Nó sẽ tách biệt môi trường máy thật và máy thật của bạn. Đảm bảo việc chạy
và khởi tạo ứng dụng khơng ảnh hưởng tới máy thật của bạn khi có vấn đề xảy
ra.
 Việc cài đặt docker đơn giản cho các hệ điều hành khác nhau.
1.3. Cài đặt.

Bạn có thể dễ dàng cài đặt docker cho từng môi trường riêng biệt theo tài liệu
riêng biệt tại đây.
1.4. Một số khái niệm quan trọng.
Docker bao gồm các thành phần chính:
Docker Engine: dùng để tạo ra Docker image và chạy Docker container.
Docker Hub: dịch vụ lưu trữ giúp chứa các Docker image.
Một số khái niệm khác:
Docker Machine: Tạo ra các Docker engine trên máy chủ.
Docker Compose: chạy ứng dụng bằng cách định nghĩa cấu hình các Docker container
thơng qua tệp cấu hình
4


Docker image: một dạng tập hợp các tệp của ứng dụng, được tạo ra bởi Docker engine.
Nội dung của các Docker image sẽ không bị thay đổi khi di chuyển. Docker image được
dùng để chạy các Docker container.
Docker Container: một dạng runtime của các Docker image, dùng để làm môi trường
chạy ứng dụng.
Dockerfile: là một tập tin dạng text chứa một tập các câu lệnh để tạo mới một Image
trong Docker. Một số lệnh trong dockerfile:
FROM <base_image>:: đây là câu lệnh bắt buộc phải có trong bất kỳ
Dockerfile nào. Nó dùng để khai báo base Image mà chúng ta sẽ build mới Image của
chúng ta.
MAINTAINER <tên_tác_giả>: câu lệnh này dùng để khai báo trên tác giả tạo ra
Image, chúng ta có thể khai báo nó hoặc khơng.
RUN <câu_lệnh>: chúng ta sử dụng lệnh này để chạy một command cho việc cài đặt
các công cụ cần thiết cho Image của chúng ta.
CMD <câu_lệnh>: trong một Dockerfile thì chúng ta chỉ có duy nhất một câu lệnh
CMD, câu lệnh này dùng để xác định quyền thực thi của các câu lệnh khi chúng ta tạo
mới Image.

ADD <src> <dest>: câu lệnh này dùng để copy một tập tin local hoặc remote nào đó
(khai báo bằng <src>) vào một vị trí nào đó trên Container (khai báo bằng dest).
ENV <tên_biến>: định nghĩa biến môi trường trong Container.
ENTRYPOINT <câu_lệnh>: định nghĩa những command mặc định, cái mà sẽ được
chạy khi container running.
VOLUME <tên_thư_mục>: dùng để truy cập hoặc liên kết một thư mục nào đó trong
Container.

5


1.5. Các lệnh cơ bản.
 Liệt kê danh sách image/container:
-

$ docker image/container ls

 Xóa image/container:
-

$ docker image/container rm <tên image/container >

 Xóa tất cả image hiện có:
-

$ docker image rm $(docker images –a –q)

 Danh sách tất container hiện có:
-


$ docker ps –a

 Dừng một container cụ thể:
-

$ docker stop <tên container>

 Chạy container từ image và thay đổi tên container:
-

$ docker run –name <tên container> <tên image>

 Dừng tất container:
-

$ docker stop $(docker ps –a –q)

 Xóa tất cả container hiện có:
-

$ docker rm $(docker ps –a –q)

 Hiển thị log một container:
-

$ docker logs <tên container>

 Xây một image từ container:
-


$ docker build -t <tên container>.

 Tạo một container chạy ngầm:
-

$ docker run -d <tên image>

 Tải một image trên docker hub:
-

$ docker pull <tên image>

 Khởi chạy một container:
-

$ docker start <tên container>

6


2. TỔNG QUAN VỀ MONGODB VÀ NOSQL.
2.1.

Nosql là gì?

NoSQL là 1 dạng CSDL mã nguồn mở và được viết tắt bởi: None-Relational SQL hay
có nơi thường gọi là Not-Only SQL.
NoSQL được phát triển trên Javascript Framework với kiểu dữ liệu là JSON và dạng dữ
liệu theo kiểu key và 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 (Relational Database Management System- Hệ
quản trị cơ sở dữ liệu quan hệ) về tốc độ, tính năng, khả năng mở rộng, ...
Với NoSQL bạn có thể mở rộng dữ liệu mà không lo tới những việc như tạo khóa ngoại,
khóa chính, kiểm tra ràng buộc.v.v...
NoSQL bỏ qua tính tồn vẹn của dữ liệu và transaction để đổi lấy hiệu suất nhanh và
khả năng mở rộng.
NoSQL được sử dụng ở rất nhiều cơng ty, tập đồn lớn, ví dụ như FaceBook sử dụng
Cassandra do FaceBook phát triển, Google phát triển và sử dụng BigTable, …
2.2.

MongoDB là gì?

MongoDB là một hệ quản trị cơ sở dữ liệu mã nguồn mở, là CSDL thuộc NoSql và được
hàng triệu người sử dụng.
MongoDB là một database hướng tài liệu (document), các dữ liệu được lưu trữ trong
document kiểu JSON thay vì dạng bảng như CSDL quan hệ nên truy vấn sẽ rất nhanh.
Với CSDL quan hệ chúng ta có khái niệm bảng, các cơ sở dữ liệu quan hệ (như MySQL
hay SQL Server...) sử dụng các bảng để lưu dữ liệu thì với MongoDB chúng ta sẽ dùng
khái niệm là collection thay vì bảng
So với RDBMS thì trong MongoDB collection ứng với table, còn document sẽ ứng với
row, MongoDB sẽ dùng các document thay cho row trong RDBMS.
Các collection trong MongoDB được cấu trúc rất linh hoạt, cho phép các dữ liệu lưu trữ
không cần tuân theo một cấu trúc nhất định.

7


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


Lợi ích của MongoDB.

 Do MongoDB sử dụng lưu trữ dữ liệu dưới dạng Document JSON nên mỗi
một collection sẽ có các kích cỡ và các document khác nhau, linh hoạt trong
việc lưu trữ dữ liệu, nên bạn muốn gì thì cứ insert vào thoải mái.
 Dữ liệu trong MongoDB khơng có sự ràng buộc lẫn nhau, khơng có join như
trong RDBMS nên khi insert, xóa hay update nó khơng cần phải mất thời
gian kiểm tra xem có thỏa mãn các ràng buộc dữ liệu như trong RDBMS.
 MongoDB rất dễ mở rộng (Horizontal Scalability). Trong MongoDB có một
khái niệm cluster là cụm các node chứa dữ liệu giao tiếp với nhau, khi muốn
mở rộng hệ thống ta chỉ cần thêm một node với vào cluster:
 Trường dữ liệu “_id” luôn được tự động đánh index (chỉ mục) để tốc độ truy
vấn thông tin đạt hiệu suất cao nhất.
 Khi có một truy vấn dữ liệu, bản ghi được cached lên bộ nhớ Ram, để phục
vụ lượt truy vấn sau diễn ra nhanh hơn mà không cần phải đọc từ ổ cứng.
 Hiệu năng cao: Tốc độ truy vấn (find, update, insert, delete) của MongoDB
nhanh hơn hẳn so với các hệ quản trị cơ sở dữ liệu quan hệ (RDBMS). Với
một lượng dữ liệu đủ lớn thì thử nghiệm cho thấy tốc độ insert của MongoDB
có thể nhanh tới gấp 100 lần so với MySQL.
3. TỔNG QUAN VỀ SPRING FRAMEWORD.
3.1.

Spring là gì?

Là framework phát triển ứng dụng phổ biến nhất dành cho Java Enterprise,
là một Java Platform mã nguồn mở, một giải pháp gọn nhẹ dành cho Java Enterprise.
Với Spring Framework các nhà phát triển có thể tạo ra các mã có hiệu suất cao, dễ kiểm
thử và có thể sử dụng lại được.


8


3.2.

Lợi ích của sử dụng spring framework.

 Spring cho phép các nhà phát triển tạo các ứng dụng cấp Enterprise sử dụng
các POJO.
 Spring được tổ chức theo kiểu mô đun.
 Spring sử dụng một số cơng nghệ hiện có như ORM Framework, logging
framworks, JEE, JDK timers và các công nghệ view khác.
 Dễ dàng kiểm thử một chương trình viết bằng spring.
 Web framework của spring là một Web MVC framework có thiết kế tốt, nó
là một thay thế tuyệt vời cho Structs và các công nghệ kém phổ biến khác.
 Spring cung cấp một số API thuận tiện để dịch các ngoại lệ cụ thể ( ném bởi
JDBC, Hibernate, hoặc JDO chẳng hạn ).
 IoC container có trọng lượng nhẹ. Điều này có lợi ích cho việc phiển và triển
khai các ựng dụng trên các máy tính có bộ nhớ và tài nguyên CPU hạn chế.
 Spring cung cấp một bộ chứa giao diện quản lý các transaction nhất qn có
thể mở rộng (Ví dụ như sử dụng một cơ sỏ dữ liệu).
3.3.

Các dự án của spring.
3.3.1. Spring MVC.
Spring MVC được thiết kế dành cho việc xây dựng các ứng dụng nền tảng web
3.3.2. Spring Security.
Cung cấp các cơ chế xác thực và phân quyền cho ứng dụng của bạn
3.3.3. Spring Boot.
Spring Boot là một trong dự án nằm trong hệ thống của spring framework nó

giúp bạn xây dựng một ứng dụng web nhanh hơn và ít config nhất có thể.
3.3.4. Spring Batch.
Dự án này giúp chúng ta dễ dàng tạo các lịch trình và tiến trình cho các công
việc xử lý theo mẻ.
3.3.5. Spring Social.
Dự án sẽ kết nối ứng dụng của bạn với các API bên thứ ba của FB, Twitter,
Linkedlin…
- Ngồi ra spring framework cịn có rất nhiều các dự án khác như là:
+ Spring cloud
+ Spring Mobile
9


+ Spring for Android
+ Spring session
3.4.

Hướng dẫn cài đặt spring vào dự án java.

Đối với mỗi dự án cụ thể thì có một cách config nhất định vì thế bạn có thể tham khảo
tại đây để biết rõ hơn về cách sử dụng cụ thể.
4. TỔNG QUAN VỀ REACTJS.
4.1.

Reactjs là gì?

React là thư viện JavaScript phổ biến nhất để xây dựng giao diện người dùng (UI). Nó
cho tốc độ phản hồi tuyệt vời khi user nhập liệu bằng cách sử dụng phương pháp mới
để render trang web.
Một trong những điểm hấp dẫn của React là thư viện này không chỉ hoạt động trên phía

client, mà cịn được render trên server và có thể kết nối với nhau. React so sánh sự thay
đổi giữa các giá trị của lần render này với lần render trước và cập nhật ít thay đổi nhất
trên DOM.
4.2.

Các khái niệm trong Reactjs.

Virtual DOM:
Công nghệ DOM ảo giúp tăng hiệu năng cho ứng dụng. Việc chỉ node gốc mới có trạng
thái và khi nó thay đổi sẽ tái cấu trúc lại toàn bộ, đồng nghĩa với việc DOM tree cũng
sẽ phải thay đổi một phần, điều này sẽ ảnh hưởng đến tốc độ xử lý. React JS sử dụng
Virtual DOM (DOM ảo) để cải thiện vấn đề này.Virtual DOM là một object Javascript,
mỗi object chứa đầy đủ thông tin cần thiết để tạo ra một DOM, khi dữ liệu thay đổi nó
sẽ tính tốn sự thay đổi giữa object và tree thật, điều này sẽ giúp tối ưu hoá việc rerender DOM tree thật.
JSX:
JSX là một dạng ngôn ngữ cho phép viết các mã HTML trong Javascript. Đặc điểm:
Faster: Nhanh hơn. JSX thực hiện tối ưu hóa trong khi biên dịch sang mã Javacsript.
Các mã này cho thời gian thực hiện nhanh hơn nhiều so với một mã tương đương viết
trực tiếp bằng Javascript. Safer: an toàn hơn. Ngược với Javascript, JSX là kiểu
statically-typed, nghĩa là nó được biên dịch trước khi chạy, giống như Java, C++. Vì thế
các lỗi sẽ được phát hiện ngay trong quá trình biên dịch. Ngồi ra, nó cũng cung cấp
10


tính năng gỡ lỗi khi biên dịch rất tốt. Easier: Dễ dàng hơn. JSX kế thừa dựa trên
Javascript, vì vậy rất dễ dàng để cho các lập trình viên Javascripts có thể sử dụng (tham
khảo tại />Components:
React được xây dựng xung quanh các component, chứ không dùng template như các
framework khác. Trong React, chúng ta xây dựng trang web sử dụng những thành phần
(component) nhỏ. Chúng ta có thể tái sử dụng một component ở nhiều nơi, với các trạng

thái hoặc các thuộc tính khác nhau, trong một component lại có thể chứa thành phần
khác. Mỗi component trong React có một trạng thái riêng, có thể thay đổi, và React sẽ
thực hiện cập nhật component dựa trên những thay đổi của trạng thái. Mọi thứ React
đều là component. Chúng giúp bảo trì mã code khi làm việc với các dự án lớn. Một react
component đơn giản chỉ cần một method render. Có rất nhiều methods khả dụng khác,
nhưng render là method chủ đạo.
Props và State:
Props: giúp các component tương tác với nhau, component nhận input gọi là props, và
trả thuộc tính mơ tả những gì component con sẽ render. Prop là bất biến. State: thể hiện
trạng thái của ứng dụng, khi state thay đồi thì component đồng thời render lại để cập
nhật UI.

11


4.3.

Lợi ích của Reactjs.

 Dễ sử dụng.
 Có hỗ trợ Reusable Component.
 Viết component dễ dàng hơn.
 Hiệu suất tốt hơn với virtual dom.
 Thân thiện với việc SEO.

CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU
1. KHẢO SÁT HIỆN TRẠNG.
1.1. Trang web học lập trình về thuật tốn w3school.com.
a. Hình ảnh:


Hình 1. Giao diện học trang w3schools.com

12


Hình 2. Danh sách khóa học trang w3schools.com

Hình 3. Giao diện làm bài kiểm tra của w3schools.com

b. Ưu điểm:
 Tốc độ load trang nhanh.
 Giao diện rõ rang dễ nhìn
 Dễ dàng tìm kiếm nội dung cần học.
 Nội dung đa dạng.
 Có responsive web phù hợp trên các thiết bị.
 Thanh tìm kiếm có hỗ trợ từ khóa tìm kiếm nhanh.
13


 Có bổ sung, cập nhật nội dung.
 Nội dung cơ bản đầy đủ.
 Có phần “Try it yourself” để người học dễ hình dung.
 Trang web phổ biến hầu hết mọi lập trình viên front-end back-end đều
biết.
 Có bài kiểm tra kiến thức.
 Có cấp chứng chỉ cho các khóa học.
c. Nhược điểm:
 Nội dung căn bản, khơng có nhiều kiến thức nâng cao và cũ.
 Bài kiểm tra cịn đơn giản (Hình thức trắc nghiệm)
 Chứng chỉ khơng có giá trị cao.

1.2. Trang web thực hành code Codewar.com
a. Hình ảnh:

Hình 4. Giao diện làm bài của trang codewars.com

14


Hình 5. Danh sách khóa học trang codewars.com

Hình 6. Giao diện thảo luận trang codewars.com

b. Ưu điểm:
 Hỗ trợ nhiều ngơn ngữ lập trình.
 Có hệ thống đóng góp câu hỏi.
 Giao diện làm bài đơn giản.
 Có hệ thống thảo luận lời giải.
 Giao diện mới lạ.
 Có sắp sếp câu trả lời hay nhất
c. Nhược điểm:
 Hệ thống phản hồi vẫn còn chậm.
 Giao diện vẫn còn phức tạp đối với người bắt đầu sử dụng.

15


1.3. Trang web học lập lý thuyết lập trình Hackerrank.com.
a. Hình ảnh:

Hình 7. Danh sách ngơn ngữ lập trình trang hackerank.com


Hình 8. Danh sách khóa học trang hackerank.com

16


Hình 9. Danh sách bài học trong hackerank.com

Hình 10. Giao diện làm bài rang hackerank.com

17


Hình 11. Giao diện thử thách trang hackerank.com

b. Ưu điểm:
 Giao diện người dùng dễ sử dụng.
 Hỗ trợ nhiều ngơn ngữ rõ ràng.
 Có nhiều dạng câu hỏi được sắp xếp từ dễ tới khó.
 Có hệ thống xếp hạng thứ bậc giải bài tập của bạn.
 Hệ thống truy cập nhanh.
c. Nhược điểm:
 Chưa có hệ thống forum thảo luận.
 Hệ thống thảo luận câu hỏi được thiết kế khơng đẹp rõ ràng.
2. PHÂN TÍCH U CẦU.
2.1. u cầu về chức năng.
 Lưu trữ, và chỉnh sửa thông tin về:
-

Thông tin chi tiết về người dùng.


-

Thông tin chi tiết về khóa học.

-

Thơng tin chi tiết về bài học.

-

Thơng tin chi tiết về thử thách.

-

Thông tin chi tiết về topic trong forum.

-

Thông tin chi tiết về comment.
18


×