đề tài xây dựng website thuê phòng trọ

Quản trị viên - Quản trị viênAdmin: quản lý danh mục bài đăng của website, thống kê số lượng người dùng sử dụng của hệ thống và đưa ra hình phạt dành cho những chủ trọ đăng bài sai lệc

Trang 1

ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT

KHOA CÔNG NGHỆ SỐ

Đà Nẵng, tháng 1/2024 ĐỒ ÁN TỐT NGHIỆP

ĐẠI HỌC NGÀNH: CÔNG NGHỆ THÔNG TIN CHUYÊN NGÀNH: CÔNG NGHỆ THÔNG TIN

ĐỀ TÀI:

XÂY DỰNG WEBSITE THUÊ PHÒNG TRỌ

Sinh viên thực hiện : Lê Huỳnh Bảo

Trang 2

ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT

KHOA CÔNG NGHỆ SỐ

Đà Nẵng, tháng 1/2024 ĐỒ ÁN TỐT NGHIỆP

ĐẠI HỌC NGÀNH: CÔNG NGHỆ THÔNG TIN CHUYÊN NGÀNH: CÔNG NGHỆ THÔNG TIN

ĐỀ TÀI:

XÂY DỰNG WEBSITE THUÊ PHÒNG TRỌ

Người duyệt: ThS Nguyễn Văn Phát

Trang 3

NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN

Trang 4

NHẬN XÉT CỦA NGƯỜI PHẢN BIỆN

Trang 5

TÓM TẮT

Tên đề tài: Xây dựng hệ thống website thuê phòng trọ Sinh viên thực hiện: Lê Huỳnh Bảo Mã SV: 1911505310103 Lớp: 19T1

- Khách thành viên cần tìm phòng trọ bình luận bài đăng để tiện trong việc tìm kiếm

4 Quản trị viên

- Quản trị viên(Admin): quản lý danh mục bài đăng của website, thống kê số lượng người dùng sử dụng của hệ thống và đưa ra hình phạt dành cho những chủ trọ đăng bài sai lệch thông tin

Trang 6

TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT

- Xây dựng website thuê phòng trọ

2 Các số liệu, tài liệu ban đầu:

- Dựa trên thông tin của chợ tốt - Cách thức tìm phòng Trọ tại Đà Nẵng - Ngôn ngữ ReactJS – NodeJS

- Hệ quản trị cơ sở dữ liệu MongoDatabase - Công nghệ hỗ trợ VisualStudio Code, StarUML

3 Nội dung chính của đồ án:

- Chương 1: Tìm hiểu lý thuyết - Chương 2: Phân tích thiết kế hệ thống - Chương 3: Xây dựng chương trình

4 Các sản phẩm dự kiến

- Hoàn thành website thuê phòng trọ - File báo cáo hoàn chỉnh

5 Ngày giao đồ án: 18/9/2023 6 Ngày nộp đồ án: 21/01/2024

Đà Nẵng, ngày tháng 1 năm 2024

Nguyễn Văn Phát

Trang 7

LỜI NÓI ĐẦU

i

Lời đầu tiên, em xin bày tỏ lòng biết ơn sâu sắc và lòng tôn trọng đến tất cả quý thầy cô giáo đã đồng hành và hỗ trợ em trong suốt quá trình thực hiện đề tài này Sự giúp đỡ, sự chỉ dẫn và kiến thức quý báu mà quý thầy cô đã chia sẻ với em là điều không thể định giá được và đã góp phần lớn trong thành công của đồ án này

Đặc biệt, em muốn bày tỏ lòng biết ơn chân thành đến ThS Nguyễn Văn Phát

- người đã tận tình và không ngừng động viên, hỗ trợ em trong suốt quá trình thực hiện đề tài tốt nghiệp này Nhờ những kiến thức và kinh nghiệm của thầy, em đã học hỏi được nhiều điều quý giá và trải qua một quá trình học tập và nghiên cứu thực sự đáng nhớ

Đồng thời, em xin gửi lời cảm ơn chân thành tới toàn thể quý thầy cô thuộc khoa Công Nghệ Số Trường Đại Học Sư Phạm Kỹ Thuật - Đại Học Đà Nẵng Suốt 4 năm học tập tại trường, em đã được trang bị những kiến thức chuyên môn, những kỹ năng quan trọng và cả những lời khuyên quý báu từ quý thầy cô Đặc biệt, em muốn

gửi lời cảm ơn đến TS Hoàng Thị Mỹ Lệ - giáo viên chủ nhiệm lớp 19T1, người đã

luôn truyền đạt không chỉ kiến thức mà còn những phẩm chất đạo đức và tình yêu

thương đối với nghề giáo Cùng với ThS Nguyễn Văn Phát, thầy cô đã trở thành

nguồn động viên và nguồn sự hỗ trợ vô cùng quan trọng trong quá trình học tập và công việc của em

Tuy nhiên trong quá trình thực hiện đề tài này, do kiến thức và thời gian có hạn, em không thể tránh khỏi những sai sót Vì vậy, em mong quý thầy, cô thông cảm và góp ý để em có thể hoàn thiện hơn và tránh được những sai lầm trong tương lai

Trang 8

CAM ĐOAN

ii

Tôi xin cam đoan: 1 Những nội dung trong luận văn này do tôi thực hiện dưới sự hướng dẫn của ThS Nguyễn Văn Phát

2 Mọi tham khảo trong luận văn đều được trích dẫn rõ ràng tên tác giả, tên công trình, thời gian, địa điểm công bố

3 Mọi sao chép không hợp lệ, vi phạm quy chế đào tạo, hay gian trá, tôi xin chịu hoàn toàn trách nhiệm

Sinh viên thực hiện

Lê Huỳnh Bảo

Trang 9

MỤC LỤC

iii

NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN i

NHẬN XÉT CỦA NGƯỜI PHẢN BIỆN ii

DANH MỤC CHỮ VIẾT TẮT TIẾNG VIỆT ix

DANH MỤC CHỮ VIẾT TẮT TIẾNG ANH x

MỞ ĐẦU 1

1 Mục tiêu đề tài 1

2 Đối tượng nghiên cứu và phạm vi nghiên cứu 2

a Đối tượng nghiên cứu 2

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

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

4 Giải pháp công nghệ 2

5 Cấu trúc đồ án 3

Chương 1 CƠ SỞ LÝ THUYẾT 4

1.1 Giới thiệu về Nodejs 4

Ưu điểm 5

Nhược điểm 5

1.2 Giới thiệu về React 6

Ưu điểm 6

Trang 10

Chương 2 PHÂN TÍCH THIẾT KẾ HỆ THỐNG 13

2.1 Khảo sát yêu cầu 13

Sơ đồ hoạt động (Activity Diagram) 24

2.3 Thiết kế cơ sỡ dữ liệu 28

Chi tiết các bảng 28

Sơ đồ ERD 31

Chương 3 XÂY DỰNG CHƯƠNG TRÌNH 32

3.1 Công cụ xây dựng chương trình 32

3.2 Giao diện chương trình 32

Giao diện trang chủ 32

Giao diện chi tiết bài đăng 33

Giao diện thuê phòng trọ 34

Giao diện nhà thuê đã đặt 35

Trang 11

MỤC LỤC

v

Giao diện tài khoản của tôi 36

Giao diện quản lý hợp đồng ( chủ trọ) 36

Giao diện đăng kí phòng trọ 37

Giao diện quản lý phòng trọ (chủ trọ) 38

Giao diện quản lý bài đăng 38

Giao diện quản lý người dùng 39

Giao diện quản lý hợp đồng thuê phòng trọ 39

Giao diện lịch sử nạp tiền 40

Giao diện xác nhận hợp đồng thuê phòng trọ (chuyên viên) 40

Giao diện tạo hợp đồng thuê nhà (chuyên viên) 41

Giao diện đăng kí 42

Giao diện đăng nhập 42

KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 44

Trang 12

vi

DANH MỤC BẢNG BIỂU

Bảng 2.1: Kịch bản Usecase đăng bài 16

Bảng 2.2: Kịch bản usecase chỉnh sửa thông tin bài đăng 17

Bảng 2.3: Kịch bản usecase Xoá bài đăng 17

Bảng 2.4: Kịch bản usecase Xoá đặt phòng 18

Bảng 2.5: Kịch bản usecase Đặt phòng 19

Bảng 2.6: Kịch bản usecase Tìm kiếm 19

Bảng 2.7: Kịch bản usecase đăng nhập 20

Bảng 2.8: Kịch bản usecase Quản trị viên 21

Bảng 2.9: Kịch bản Usecase đăng bài 28

Bảng 2.10: Bảng Places 29

Bảng 2.11: Bảng Invoices 30

Bảng 2.12: Bảng Users 30

Trang 13

vii

DANH MỤC HÌNH VẼ

Hình 1.1: Nodejs 4

Hình 1.2: ReactJS 6

Hình 1.3: Visual Studio Code 8

Hình 1.4: Hệ quản trị CSDL NoSQL MongoDB 10

Hình 2.1: Sơ đồ nghiệp vụ công việc Website 13

Hình 2.2: Sơ đồ Usecase 16

Hình 2.3: Sơ đồ Robustness đăng bài 22

Hình 2.4: Sơ đồ Robustness duyệt bài đăng 22

Hình 2.5: Sơ đồ Robustness đặt phòng 23

Hình 2.6: Sơ đồ Robustness tìm kiếm 23

Hình 2.7: Sơ dồ hoạt động đăng nhập 24

Hình 2.8: Sơ đồ hoạt động đăng tin 24

Hình 2.9: Sơ đồ hoạt động xoá bài đăng 25

Hình 2.10: Sơ đồ hoạt động chỉnh sửa bài đăng 25

Hình 2.11: Sơ đồ hoạt động tìm kiếm 26

Hình 2.12: Sơ đồ hoạt động đặt phòng 26

Hình 2.13: Sơ đồ hoạt động huỷ đặt phòng 27

Hình 2.14: Sơ đồ hoạt động duyệt bài đăng 27

Hình 2.15: Sơ đồ hoạt động quản lý tài khoản người dùng 28

Hình 2.16: Sơ đồ ERD 31

Hình 3.1: Giao diện trang chủ 32

Hình 3.2: Giao diện chi tiết bài đăng 33

Hình 3.3: Giao diện thuê phòng trọ 34

Hình 3.4: Giao diện nhà thuê đã đặt 35

Trang 14

viii

Hình 3.5: Giao diện tài khoản của tôi 36

Hình 3.6: Giao diện quản lý hợp đồng của chủ trọ 36

Hình 3.7: Giao diện đăng tin 37

Hình 3.8: Giao diện quản lý phòng trọ 38

Hình 3.9: Giao diện quản lý bài đăng 38

Hình 3.10: Giao diện quản lý người dùng 39

Hình 3.11: Giao diện quản lý hợp đồng 39

Hình 3.12: Giao diện lịch sử nạp tiền 40

Hình 3.13: Giao diện tạo hợp đồng thuê phòng trọ 40

Hình 3.14: Giao diện tạo hợp đồng thuê nhà 41

Hình 3.15: Giao diện đăng kí thành viên 42

Hình 3.16: Giao diện đăng nhập 42

Trang 15

DANH MỤC CHỮ VIẾT TẮT TIẾNG VIỆT

ix

Stt Chữ viết tắt Giải nghĩa

1 CNTT Công nghệ thông tin 2 CSDL Cơ sỡ dữ liệu

Trang 16

DANH MỤC CHỮ VIẾT TẮT TIẾNG ANH

x

1 HTML HyperText Markup Language

Ngôn ngữ đánh dấu siêu văn bản

2 DOM Document Object Model Mô hình đối tượng tài liệu

3 API

ApplicationProgramming Interface

Các phương thức, giao thức kết nối với các thư viện và ứngdụng khác

4 HTTP Hypertext Transfer Protocol

Giao thức truyền tải siêu văn bản

5 RAM Random Access Memory

Bộ nhớ khả biến cho phép đọc- ghi

6 ERD Entity-Relationship Diagram

Sơ đồ mô hình thực thể quan hệ

7 CPU Central Processing Unit Bộ xử lý trung tâm

8 PHP Personal Home Page

Ngôn ngữ lập trình kịch bản đa mục đích

9 JSX JavaScript XML JavaScript XML

Trang 17

Xây dựng website thuê phòng trọ

MỞ ĐẦU

Đối với những thành phố lớn, như là Tp Đà Nẵng – một thành phố với trên 1,1 triệu dân – thì những vấn đề trên càng trở nên phức tạp, nhất là vấn đề về nhà trọ cho dân nhập cư, công nhân và đặc biệt hơn hết là số lượng sinh viên của các trường đại học – cao đẳng Đại đa các thí sinh ngày nay đăng ký thi tuyển sinh Đại học chủ yếu là gia đình ở quê, ngoại thành lên thành phố, thì nhu cầu tìm được trọ vừa ý là rất khó, Sự thành lập của thị trường chứng khoán và sự kiện khác làm cho nên kinh tế Đà Nẵng có những chuyển biến sôi động Hàng trăm công ty mới được thành lập, cũng cần thuê mướn mặt bằng làm địa điểm giao dịch, văn phòng đại diện, nơi làm việc,

Như vậy, hàng năm nhu cầu tìm kiếm nhà trọ để thuê, cũng như tìm thuê mặt bằng làm văn phòng đại diện, địa điểm giao dịch là rất lớn Nhưng bằng cách nào để người thuê gặp được chủ nhà một cách dễ dàng và thuê được căn nhà, phòng trọ ưng ý nhất? Trong khi đó hiên nay nhu cần tìm kiếm mọi thông tin trên Internet đã trở nên rất phổ biến Chính vì thế, em chọn đề tài “Xây dựng website đăng tin và tìm kiếm phòng trọ tại Đà Nẵng” để giải quyết các vấn đề nêu ở trên

Xin chân thành cảm ơn sự hướng dẫn tận tình của thầy trong suốt quá trình thực hiện đồ án này!

• Cho phép chủ trọ đăng tin và cập nhật lại thông tin phòng trọ • Xem thông tin cá nhân, đổi mật khẩu, đăng nhập, đăng xuất • Xem danh sách đặt phòng

• Cho phép chủ trọ xóa thông tin phòng trọ • Cho phép chủ trọ cập nhật giấy tờ chứng minh • Cho phép chủ trọ ẩn bài đăng

Trang 18

Đối với khách thành viên: • Cho phép bình luận,đánh giá bài đăng • Cho phép đánh giá bình luận của bài đăng • Cho phép đặt phòng

• Cập nhật lại thông tin cá nhân, đổi mật khẩu, đăng nhập, đăng xuất Đối với quản trị viên:

• Cho phép duyệt bài đăng • Cho phép khóa tài khoản và xóa tài khoản vi phạm • Cập nhật thời gian đặt phòng

• Thống kê số bài đăng đã duyệt, số người dùng và chủ trọ đăng bài nhiều nhất

2 Đối tượng nghiên cứu và phạm vi nghiên cứu a Đối tượng nghiên cứu

Người nhập cư, công nhân, sinh viên, học sinh,… có nhu cầu sinh sống và làm việc tại Đà Nẵng

b Phạm vi nghiên cứu

Đề tài được nghiên cứu tại Khu vực thành phố Đà Nẵng

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

• Phương pháp nghiên cứu lý thuyết thu nhập thông tin qua sách, các tài liệu trang web để tìm được các cơ sở lý thuyết mà mình nghiên cứu

• Phương pháp triển khai thực nghiệm: xây dựng website • Tham khảo các trang fanpage cho thuê phòng trọ trong khu vực Đà Nẵng

4 Giải pháp công nghệ

• Ngôn ngữ lập trình : Node.js - Reactjs • Hệ quản trị cơ sở dữ liệu : MongoDB • Công cụ hỗ trợ : StarUML, VisualCode

Trang 19

5 Cấu trúc đồ án

Cấu trúc đồ án bao gồm những phần sau:

Chương 1: Cơ sở lý thuyết

Tìm hiểu, giới thiệu tổng quát các kiến thức về ngôn ngữ lập trình Nodejs - Reactjs, và hệ quản trị cơ sở dữ liệu MongoDB

Chương 2: Phân tích thiết kế hệ thống

Phân tích các tác nhân và chức năng của từng tác nhân của hệ thống Thiết kế sơ đồ use-case, sơ đồ hoạt động, sơ đồ ERD Thiết kế cơ sở dữ liệu Xây dựng kịch bảng cho từng use-case hệ thống

Chương 3: Xây dựng chương trình

Xây dựng giao diện và chức năng của hệ thống

Kết luận và Hướng phát triển

Kết luận chung cho các chương trong đồ án Trình bày những vấn đề đã giải quyết đồng thời trình bày hướng phát triển

Trang 20

1.1 Giới thiệu về Nodejs

Chương 1 CƠ SỞ LÝ THUYẾT

Hình 1.1: Nodejs Node.js là một nền tảng phát triển dựa trên JavaScript và được xây dựng trên trình duyệt Chrome's V8 JavaScript runtime Được tạo ra bởi Ryan Dahl và ra mắt lần đầu vào năm 2009, Node.js đã nhanh chóng trở thành một trong những công cụ phổ biến nhất cho việc xây dựng ứng dụng web và server-side

V8 engine là một JavaScript engine mã nguồn mở chạy trên các trình duyệt Chrome Nó được thiết kế tập trung vào hiệu năng và chịu trách nhiệm cho việc dịch mã JavaScript sang mã máy để máy tính có thể hiểu và chạy được Nhưng bạn cũng nên tránh nhầm lẫn rằng Node chạy trên trình duyệt Cha đẻ của Node dựa trên V8 engine, cải tiến một số tính năng chẳng hạn file system API, thư viện HTTP và một số phương thức liên quan đến hệ điều hành Điều đó có nghĩa là Node.js là một chương trình giúp ta có thể chạy code JavaScript trên máy tính, nói cách khác nó là một JavaScript runtime

Trang 21

Ưu điểm

- Khả năng xử lý không đồng bộ (Asynchronous): Node.js sử dụng mô hình xử lý không đồng bộ, giúp tối ưu hiệu suất của ứng dụng bằng cách cho phép xử lý hàng loạt yêu cầu mà không phải chờ đợi kết quả của từng yêu cầu trước - Hiệu suất cao: Nhờ sử dụng động cơ V8 của Google Chrome, Node.js có hiệu

suất cao và khả năng xử lý tốt các yêu cầu đồng thời Điều này làm cho nó thích hợp cho ứng dụng có yêu cầu cao về xử lý và đáp ứng

- Mô hình sự kiện (Event-driven): Sự kiện là trung tâm của Node.js, giúp quản lý các hoạt động và xử lý sự kiện một cách hiệu quả Điều này làm cho việc lập trình trở nên linh hoạt và dễ quản lý

- Cộng đồng lớn và hỗ trợ đa nền tảng: Node.js được hỗ trợ mạnh mẽ từ cộng đồng lập trình viên trên toàn thế giới, điều này đồng nghĩa với việc có nhiều thư viện, module và tài liệu hữu ích Node.js cũng có thể chạy trên nhiều hệ điều hành, giúp tối ưu hóa sự linh hoạt

- Dễ học và triển khai: Với việc sử dụng JavaScript, một ngôn ngữ lập trình phổ biến, nhà phát triển web đã quen thuộc với Node.js Điều này giúp giảm thời gian học và giúp ứng dụng dễ dàng triển khai

- Môi trường mô-đun (Module ecosystem): Node.js có một hệ sinh thái mô-đun mạnh mẽ, với hàng nghìn thư viện được phát triển và sẵn sàng sử dụng từ cộng đồng

- Phát triển ứng dụng real-time: Node.js làm cho việc xây dựng ứng dụng real- time, như chat và trò chơi trực tuyến, trở nên thuận tiện nhờ vào khả năng xử lý sự kiện và không đồng bộ

Nhược điểm

- Nodejs gây hao tốn tài nguyên và thời gian Nodejs được viết bằng C++ và JavaScript nên khi xử lý cần phải trải qua một quá trình biên dịch Nếu bạn cần xử lý những ứng dụng tốn tài nguyên CPU thì không nên sử dụng Nodejs - Nodejs so với các ngôn ngữ khác như PHP, Ruby và Python sẽ không có sự

chênh lệch quá nhiều Nodejs có thể sẽ phù hợp với việc phát triển ứng dụng

Trang 22

mới Tuy nhiên khi xây dựng và triển khai dự án quan trọng thì Nodejs không phải là sự lựa chọn hoàn hảo nhất

1.2 Giới thiệu về React

Hình 1.2: ReactJS React (còn được gọi là Reactjs hay React.js) là một Thư viện javascript được tạo ra bởi sự cộng tác giữa Facebook và Instagram Nó cho phép những nhà phát triển web tạo ra giao diện người dùng nhanh chóng Phần Views của Reactjs thường được hiển thị bằng việc chủ yếu dung các component mà chứa các component cụ thể hoặc các thẻ HTML Một trong những đặc trưng duy nhất của Reactjs là việc render dữ liệu không những có thể thực hiện ở tầng server mà còn ở tầng client

Nó cũng sử dụng khái niệm là Virtual DOM (DOM ảo) Virtual DOM tạo ra bản cache cấu trúc dữ liệu của ứng dụng trên bộ nhớ Sau đó, ở mỗi vòng lặp, nó liệt kê những thay đổi và sau đó là cập nhật lại sự thay đổi trên DOM của trình duyệt một cách hiệu quả Điều này cho phép ta viết các đoạn code như thể toàn bộ trang được render lại dù thực tế là Reactjs chỉ render những component hay subcomponent nào thực sự thay đổi

Ưu điểm

- Reactjs cực kì hiệu quả: Reactjs tạo ra cho chính nó DOM ảo – nơi mà các component thực sự tồn tại trên đó Điều này sẽ giúp cải thiện hiệu suất rất nhiều Reactjs cũng tính toán những thay đổi nào cần cập nhật len DOM và chỉ

Trang 23

thực hiện chúng Điều này giúp Reactjs tránh những thao tác cần trên DOM mà nhiều chi phí

- Reactjs giúp việc viết các đoạn code JS dễ dàng hơn: Nó dung cú pháp đặc biệt là JSX (Javascript mở rộng) cho phép ta trộn giữa code HTML và Javascript Ta có thể them vào các đoạn HTML vào trong hàm render mà không cần phải nối chuỗi Đây là đặc tính thú vị của Reactjs Nó sẽ chuyển đổi các đoạn HTML thành các hàm khởi tạo đối tượng HTML bằng bộ biến đổi JSX

- Nó có nhiều công cụ phát triển: Khi bạn bắt đầu Reactjs, đừng quên cài đặt ứng dụng mở rộng của Chrome dành cho Reactjs Nó giúp bạn debug code dễ dàng hơn Sau khi bạn cài đặt ứng dụng này, bạn sẽ có cái nhìn trực tiếp vào virtual DOM như thể bạn đang xem cây DOM thông thường

- Render tầng server: Một trong những vấn đề với các ứng dụng đơn trang là tối ưu SEO và thời gian tải trang Nếu tất cả việc xây dựng và hiển thị trang đều thực hiện ở client, thì người dùng sẽ phải chờ cho trang được khởi tạo và hiển thị lên Điều này thực tế là chậm Hoặc nếu giả sử người dùng vô hiệu hóa Javascript thì sao? Reactjs là một thư viện component, nó có thể vừa render ở ngoài trình duyệt sử dụng DOM và cũng có thể render bằng các chuỗi HTML mà server trả về

- Làm việc với vấn đề test giao diện: Nó cực kì dễ để viết các test case giao diện vì virtual DOM được cài đặt hoàn toàn bằng JS

- Hiệu năng cao đối với các ứng dụng có dữ liệu thay đổi liên tục, dễ dàng cho bảo trì và sửa lỗi

- Reactjs chỉ phục vụ cho tầng View React chỉ là View Library nó không phải là một MVC framework như những framework khác Đây chỉ là thư viện của Facebook giúp render ra phần view Vì thế React sẽ không có phần Model và Controller, mà phải kết hợp với các thư viện khác React cũng sẽ không có 2- way binding hay là Ajax

Trang 24

- Tích hợp Reactjs vào các framework MVC truyền thống yêu cầu cần phải cấu hình lại

- React khá nặng nếu so với các framework khác React có kích thước tương tương với Angular (Khoảng 35kb so với 39kb của Angular) Trong khi đó Angular là một framework hoàn chỉnh

- Khó tiếp cận cho người mới học Web

1.3 Giới thiệu về Visual Studio Code

Hình 1.3: Visual Studio Code Visual Studio Code (VS Code) là một trình soạn thảo mã nguồn nhỏ gọn và mạnh mẽ, phát triển bởi Microsoft Được thiết kế để đáp ứng nhu cầu lập trình của cộng đồng đa dạng, VS Code mang đến cho nhà phát triển một môi trường làm việc hiện đại và linh hoạt

Là một trình biên tập lập trình code miễn phí dành cho Windows, Linux và macOS, Visual Studio Code được phát triển bởi Microsoft Nó được xem là một sự kết hợp hoàn hảo giữa IDE và Code Editor

Visual Studio Code hỗ trợ chức năng debug, đi kèm với Git, có syntax highlighting, tự hoàn thành mã thông minh, snippets, và cải tiến mã nguồn Nhờ tính năng tùy chỉnh, Visual Studio Code cũng cho phép người dùng thay đổi theme, phím tắt, và các tùy chọn khác

Trang 25

Một số tính năng nổi bật

- Hỗ trợ nhiều ngôn ngữ lập trình: VSCode hỗ trợ nhiều ngôn ngữ lập trình phổ biến như JavaScript, TypeScript, Python, Java, C++, và nhiều ngôn ngữ khác Điều này làm cho nó trở thành một IDE đa nhiệm và đa ngôn ngữ

- Hỗ trợ Git tích hợp: VSCode tích hợp sẵn công cụ quản lý phiên bản Git, giúp bạn theo dõi thay đổi mã nguồn, thực hiện commit, và quản lý nhánh dễ dàng - Hiển thị IntelliSense: VSCode cung cấp IntelliSense, một tính năng tự động

hoàn thành mã nguồn, giúp bạn nhanh chóng và dễ dàng gõ mã và truy cập vào các phương thức và biến

- Mở rộng và Cộng đồng: VSCode có hệ thống mở rộng mạnh mẽ, cho phép bạn cài đặt các tiện ích mở rộng (extensions) từ thư viện lớn trên Visual Studio Code Marketplace Cộng đồng người dùng cũng đóng góp nhiều extensions hữu ích

- Gỡ lỗi (Debugging): VSCode hỗ trợ chức năng gỡ lỗi cho nhiều ngôn ngữ lập trình, với khả năng thiết lập các điểm dừng (breakpoints), xem biến, và theo dõi thực thi chương trình

- Terminal tích hợp: VSCode tích hợp một terminal trực tiếp trong giao diện người dùng, giúp bạn thực hiện các lệnh hệ thống và quản lý dự án mà không cần chuyển đến cửa sổ terminal riêng biệt

- Theme và tùy chỉnh: VSCode cho phép bạn tùy chỉnh giao diện và theme theo ý muốn của mình Nó cũng hỗ trợ nhiều theme màu sắc phổ biến

- Integrations và Snippets: Hỗ trợ nhiều tích hợp và snippets, giúp tăng tốc quá trình phát triển bằng cách cung cấp các đoạn mã mẫu và tích hợp với các dịch vụ phổ biến

- Tích hợp với các công cụ môi trường phát triển: VSCode có thể tích hợp với nhiều công cụ và môi trường phát triển khác nhau, tạo điều kiện thuận lợi cho quá trình phát triển ứng dụng

Trang 26

1.4 Giới thiệu hệ quản trị cơ sở dữ liệu NoSql MongoDB

Hình 1.4: Hệ quản trị CSDL NoSQL MongoDB 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 MongoDB được phát triển bởi MongoDB Inc và được cấp phép theo Giấy phép Công cộng phía Máy chủ (SSPL)

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

Ưu điểm

- MongoDB có nhiều ưu điểm hơn so với những loại khác Ưu điểm đầu tiên của MongoDB chính là sử dụng lưu trữ dữ liệu dưới dạng Document JSON Nhờ có nó nên mỗi một collection đều sẽ có các kích cỡ và các Document khác nhau Sự linh hoạt trong việc lưu trữ dữ liệu của MongoDB là rất hữu dụng Chính vì vậy, các bạn hoàn toàn có thể sử dụng MongoDB để Insert dữ liệu bất cứ lúc nào

Trang 27

- Ưu điểm thứ hai của MongoDB đó chính là nó không có sự ràng buộc lẫn nhau trong dữ liệu Các bạn sẽ không cần phải join như trong RDBMS Nên khi sử dụng insert hay xóa, update sẽ không cần tốn nhiều thời gian Các bạn cũng không cần phải chờ xem nó có thỏa mãn các ràng buộc dữ liệu hay không để tiến hành insert

- Sử dụng MongoDB các bạn có thể mở rộng dễ dàng hơn Trong nền tảng này 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 bạn muốn mở rộng một hệ thống, các bạn chỉ cần thêm một node vào cluster Đây chính là sự nhanh nhạy khi dùng MongoDB

- Trường dữ liệu “_id” luôn tự động đánh chỉ mục index ở MongoDB để tốc độ truy vấn thông tin nhanh nhất Khi có một truy vấn dữ liệu, bản ghi của cached sẽ cho lên bộ nhớ Ram Từ đó phục vụ lần lượt các truy vấn của người dùng, diễn ra nhanh hơn mà không cần đọc từ ổ cứng

- Ngoài ra, sử dụng MongoDB còn hỗ trợ hiệu năng cao cho người dùng Ví dụ như tốc độ truy vấn find, update, insert hay delete Tất cả đều được tối ưu nhanh hơn so với các hệ thống quản trị dữ liệu quan hệ khác Từ những thử nghiệm cho thấy, tốc độ của MongoDb có thể nhanh gấp 100 lần so với MySQL

- Mặc dù MongoDB có nhiều ưu điểm như vậy, tuy nhiên nó vẫn chưa phải hoàn hảo Vẫn sẽ có những nhược điểm nhất định khi sử dụng Đây cũng chính là lý do chúng tôi tổng hợp để các bạn hiểu hơn về MongoDB

- Ưu điểm đôi khi là nhược điểm Điều này thực sự quá bất ngờ phải không nào? Mặc dù ưu điểm khi sử dụng MongoDB đó là không có quá nhiều ràng buộc như trong RDBMS Tuy nhiên, chính điều này khiến cho nhiều người dùng lo lắng Khi thao tác trên MongoDB các bạn cần phải cẩn thận hơn vì không có sự ràng buộc này

- MongoDB bị nhiều người dùng đánh giá là tốn bộ nhớ do lưu dữ liệu dưới dạng key – value, collection Nền tảng này các dữ liệu chỉ khác nhau về value,

Trang 28

do đó, key vẫn sẽ bị lặp lại nhiều lần Vì không hỗ trợ Join nên dễ dẫn đến dư thừa dữ liệu

- Ngoài ra, nhược điểm khi sử dụng MongoDB chính là nguy cơ gây mất dữ liệu khi chưa hoàn thành bản lưu Điều này hoàn toàn có thể xảy ra bởi quá trình insert hay update, remove bản ghi của MongoDB không cập nhật ngay xuống ổ cứng Phải mất khoảng 60s nền tảng này mới thực hiện ghi toàn bộ dữ liệu thay đổi từ Ram vào ổ cứng Nếu có sự cố như mất điện xảy ra trong trường hợp này, thì các bạn có thể bị mất dữ liệu

Trang 29

Chương 2 PHÂN TÍCH THIẾT KẾ HỆ THỐNG 2.1 Khảo sát yêu cầu

Hoạt động nghiệp vụ

Hình 2.1: Sơ đồ nghiệp vụ công việc Website

Liệt kê người dùng và yêu cầu

• Cho phép khách thành viên đăng ký và bảo mật thông tin

• Xem, cập nhật thông tin cá nhân (tài khoản)

• Giao diện dễ nhìn, dễ sử dụng và đáp ứng được đầy đủ các yêu cầu của người dùng

• Luôn cập nhật thông tin mới nhất về các bài đăng

• Đảm bảo việc tìm kiếm diễn ra nhanh chóng, chính xác theo từng chi tiết khách thành viên yêu cầu

Trang 30

• Thông tin về một phòng trọ được cho thuê phải rõ từng chi tiết, kèm theo các hình ảnh minh họa và xác minh

• Việc đặt phòng không gặp lỗi

• Hình thức thanh toán đảm bảo độ chính xác

• Cho phép khách thành viên được đánh giá, vote sao và xem bình luận

Đảm bảo được các yêu cầu của khách hàng, ngoài ra còn cần phải đảm bảo các yêu cầu của một quản trị viên:

• Cập nhật thông tin bài đăng thường xuyên

• Quản lý việc đăng bài

• Thống kê chi tiết và chính xác

o Chủ trọ đăng bài nhiều nhất

o Số lượng người đăng ký

o Các bài đăng đã được duyệt

• Quản lý chung và chặt chẽ thông tin khách thành viên và chủ trọ

• Khóa các tài khoản vi phạm hoặc có thể xóa vĩnh viễn

Ngoài các yêu cầu giống như khách thành viên, thì hệ thống còn cần phải đảm bảo các yêu cầu cho chủ trọ như:

• Việc đăng bài không gặp vấn đề và được duyệt 1 cách nhanh nhất

• Cho phép cập nhật lại các thông tin về bài đăng

• Cho phép duyệt đặt phòng của khách thành viên đã đặt phòng

• Cho phép xóa bài đăng và xóa thông tin đặt phòng

Trang 31

• Khách vãng lai

• Chủ trọ

• Yêu cầu:

• Quản trị viên

• Duyệt bài đăng và xem thông tin bài đăng

• Khóa tài khoản và xóa tài khoản vi phạm

• Thống kê top chủ trọ đăng bài nhiều nhất

• Phân quyền

• Khách thành viên

• Đăng nhập / đăng xuất

• Cập nhập thông tin cá nhân

• Tìm kiếm bài đăng kế thừa từ usecase “Khách vãng lai”

• Xem chi tiết bài đăng

• Bình luận bài đăng khi đã từng thuê phòng trọ hoặc có nhu cầu hỏi về vấn đề liên quan

• Bình luận bài đăng

• Đặt phòng => Cần đặt cọc trực tiếp hoặc thông qua momo do hệ thống quản lý, nếu trực tiếp thì chủ nhà phải tự chuyển đổi trạng thái : Còn trống – Đang đặt – Đã thuê

• Khách vãng lai

• Tìm kiếm phòng trọ theo khu vực, giá phòng, loại phòng tại Đà Nẵng

• Chủ trọ

• Đăng nhập / đăng xuất

• Cập nhật thông tin cá nhân

• Đăng bài , mỗi phòng trọ là một bài đăng, nếu đều là trọ giống nhau thì chỉ cần 1 bài đăng cho tất cả và thường xuyên cập nhập số lượng phòng : Còn trống – Đang đặt – Đã thuê

• Cập nhật thông tin bài đăng

• Xóa bài đăng

• Xóa thông tin đặt phòng