Xây dựng website tìm kiếm phòng trọ tại thành phố đà nẵng

Sinh viên thực hiện: Võ Thành Tiến MSV: 1911505310152 Lớp: 19T1 Nội dung tóm tắt: Sau khi được cô Hoàng Thị Mỹ Lệ hướng dẫn đề tài này thì em đã thực hiện được các chức năng cơ bản của h

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

KHOA CÔNG NGHỆ SỐ

ĐỒ ÁN TỐT NGHIỆP

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

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

KHOA CÔNG NGHỆ SỐ

ĐỒ Á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

Đà Nẵng, ngày tháng năm 2023 Giảng viên hướng dẫn

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

Người phản biện

TÓM TẮT

Tên đề tài: Xây dựng website tìm kiếm phòng trọ tại thành phố Đà Nẵng

Sinh viên thực hiện: Võ Thành Tiến

MSV: 1911505310152 Lớp: 19T1

Nội dung tóm tắt:

Sau khi được cô Hoàng Thị Mỹ Lệ hướng dẫn đề tài này thì em đã thực hiện được các chức năng cơ bản của hệ thống như sau:

- Khách vãng lai sau khi truy cập website và tìm kiếm (loại tin, quận/huyện,

phường/xã, giá, diện tích), xem phòng trọ, xem chi tiết phòng trọ, xem bảnggiá, đăng ký tài khoản thành viên, liên hệ chủ cho thuê trọ

- Khách hàng đã đăng nhập có đầy đủ chức năng của khách vãng lại đồng

thời có thể nạp tiền để thanh toán, quản lý tài khoản cá nhân, đăng tin, xemlịch sử nạp tiền, lịch sử thanh toán

- Quản trị viên sẽ là người quản trị cao nhất của hệ thống, quản lý tất cả các

thông tin của website: Thống kê, danh mục, khách hàng, phòng, địa chỉ,nạp tiền, thanh toán

NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP

Giảng viên hướng dẫn: TS Hoàng Thị Mỹ Lệ

Sinh viên thực hiện: Võ Thành Tiến Mã SV: 1911505310152

1 Tên đề tài: Xây dựng website tìm kiếm phòng trọ tại thành phố Đà Nẵng

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

- Số liệu được trao đổi và lấy từ các nguồn chủ cho thuê trọ

- Các tài liệu tham khảo được lấy từ nhiều nguồn, đa phần là các bài viết và khoá học về lập trình trên youtube

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

Quá trình xây dựng website tìm kiếm phòng trọ tại thành phố Đà Nẵng:

- Thu thập thông tin tài liệu liên quan và khảo sát thực tế

- Phân tích thiết kế các chức năng của hệ thống

- Phân tích thiết kế cơ sơ dữ liệu

- Thiết kế giao diện cho các chức năng

LỜI CẢM ƠN

Thế giới ngày nay đã có nhiều tiến bộ mạnh mẽ về công nghệ thông tin (CNTT) từmột tiềm năng thông tin đã trở thành một tài nguyên thực sự, trở thành sản phẩm hànghoá trong xã hội, tạo ra một sự thay đổi to lớn trong lực lượng sản xuất, cơ sở hạ tầng,cấu trúc kinh tế, tính chất lao động và cả cách thức quản lý trong các lĩnh vực của xãhội

Với sự phát triển Internet nó được xem là một trong những thành tựu khoa học kỹthuật vĩ đại trong lịch sử loài người và là nguồn tài nguyên thông tin lớn nhất, đa dạngnhất của thế giới hiện nay Internet giúp mọi người có thể trao đổi thông tin trong sinhhoạt hàng ngày, thu thập, tìm kiếm các thông tin mới nhất ở khắp mọi nơi trên toàn thếgiới, giao dịch thương mại, cộng tác trong nghiên cứu khoa học… Vì vậy, trên conđường công nghiệp hóa, hiện đại hóa đất nước ta hiện nay, việc đưa Internet đến mọingười là một xu thế tất yếu Vấn đề đặt ra là làm sao cho Internet thực sự phục vụ chocon người một cách có hiệu quả trên mọi lĩnh vực

Webiste tìm kiếm phòng trọ trên mạng sẽ giúp tất cả mọi người dùng Internet đều

có thể ngồi trước máy tính, điện thoại của mình truy cập để tìm kiếm một phòng trọưng ý, tìm kiếm thông tin một cách trực quan và có thể xem và thuê trọ trực tuyến Emchọn đề tài của mình là "XÂY DỰNG WEBSITE TÌM KIẾM PHÒNG TRỌ TẠITHÀNH PHỐ ĐÀ NẴNG" với mục đích giúp tiết kiệm thời gian đối với những ngườiđang tìm kiếm phòng trọ, việc phải đi tìm kiếm trên các trang web khác nhau là mộtviệc làm tốn thời gian Một trang web tìm kiếm phòng trọ sẽ giúp giảm bớt thời giantìm kiếm của người dùng Dễ dàng sử dụng một trang web tìm kiếm phòng trọ đượcthiết kế đơn giản Đa dạng các thông tin trang web tìm kiếm phòng trọ cung cấp chongười dùng nhiều thông tin về các phòng trọ khác nhau, giúp họ dễ dàng so sánh vàlựa chọn phòng trọ phù hợp Tiết kiệm chi phí quảng cáo với chủ nhà cho thuê phòngtrọ, việc quảng cáo trên một trang web tìm kiếm phòng trọ sẽ tiết kiệm chi phí hơn sovới quảng cáo trên các kênh khác như báo, tạp chí, hoặc mạng xã hội Tăng khả năngtiếp cận khách hàng với trang web tìm kiếm phòng trọ, chủ nhà cho thuê phòng trọ cóthể tiếp cận được nhiều khách hàng hơn, đặc biệt là những người đang tìm kiếm phòng

trọ trên internet.Vì vậy, việc xây dựng một trang web tìm kiếm phòng trọ sẽ mang lạinhiều lợi ích cho cả người dùng và chủ nhà cho thuê phòng trọ.

Lời đầu tiên, em xin gửi lời cảm ơn chân thành đến quý thầy cô đã giúp đỡ emthực hiện đề tài này, đặc biệt là TS.Hoàng Thị Mỹ Lệ, cô đã tận tình giúp đỡ em trongsuốt quá trình thực hiện đề tài tốt nghiệp này

Đồng thời, em cũng xin chân thành cảm ơn quý thầy cô thuộc ngành Công NghệThông Tin trường Đại học Sư phạm Kỹ thuật - Đại học Đà Nẵng đã truyền đạt nhữngkiến thức cần thiết và những kinh nghiệm quý báu cho chúng em trong suốt thời giantrên giảng đường để em thực hiện tốt đề tài này

Trong quá trình thực hiện đề tài, do kiến thức và thời gian còn hạn chế nên khôngthể 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 đề tài Thêm nữa là, những lời góp ý đó có thể giúp em tránh đượcnhững sai lầm sau này

Em xin chân thành cảm ơn!

ivSVTH: Võ Thành Tiến

LỜI CAM ĐOAN

Em xin cam đoan đồ án “Xây dựng website tìm kiếm phòng trọ tại thành phố

Đà Nẵng” là một công trình nghiên cứu độc lập dưới sự hướng dẫn của giảng viên

TS Hoàng Thị Mỹ Lệ Ngoài ra không có bất cứ sự sao chép nào của người khác

Đề tài, nội dung báo cáo đồ án là sản phẩm mà em đã nỗ lực nghiên cứu trongquá trình học tập tại trường Các kết quả trình bày trong báo cáo là hoàn toàn trungthực, em xin chịu hoàn toàn trách nhiệm, kỷ luật của trưởng bộ môn và nhà trường đề

ra nếu như có vấn đề xảy ra

Sinh viên thực hiện

Võ Thành Tiến

MỤC LỤ

DANH MỤC BẢNG BIỂU v

DANH MỤC HÌNH ẢNH vi

MỞ ĐẦU 1

1 Lý do chọn đề tài 1

2 Mục tiêu và nhiệm vụ nghiên cứu 1

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

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

5 Cấu trúc của đồ án tốt nghiệp 2

CHƯƠNG 1 CƠ SỞ LÝ THUYẾT 3

1.1 Tổng quan về ngôn ngữ lập trình 3

1.1.1 HTML 3

1.1.2 CSS 3

1.1.3 PHP 4

1.2 Hệ quản trị cơ sở dữ liệu MySQL 5

1.3 Framework và thư viện hỗ trợ 5

1.3.1 Giới thiệu Laravel Framework 5

1.3.2 Thư viện Jquery 6

1.3.3 Thư viện Bootstrap 6

1.4 Công cụ hỗ trợ xây dựng hệ thống 7

1.4.1 Visual Studio Code 7

1.4.2 Xampp 8

1.5 Lý thuyết xây dựng website 9

CHƯƠNG 2 PHÂN TÍCH THIẾT KẾ HỆ THỐNG 10

2.1 Tác nhân 10

2.2 Đặc tả yêu cầu nghiệp vụ 10

2.2.1 Khách vãng lai 10

2.2.2 Khách hàng 10

2.2.3 Quản trị viên 10

2.3 Đặc tả yêu cầu phần mềm 10

2.3.1 Khách vãng lai 10

i SVTH: Võ Thành Tiến

2.3.2 Khách hàng 11

2.3.3 Quản trị viên 11

2.4 Sơ đồ Use case 12

2.5 Kịch bản cho Use case 12

2.5.1 Khách vãng lai 12

2.5.1.1 Tìm kiếm phòng trọ 12

2.5.1.2 Xem thông tin chi tiết phòng trọ 13

2.5.1.3 Xem bảng giá 13

2.5.1.4 Đăng ký tài khoản thành viên 14

2.5.2 Khách hàng 15

2.5.2.1 Đăng nhập trang người dùng 15

2.5.2.2 Cập nhật thông tin tài khoản 15

2.5.2.3 Đăng tin phòng trọ cho thuê 16

2.5.2.4 Cập nhật tin đăng 17

2.5.2.5 Xem lịch sử thanh toán 17

2.5.2.6 Xem lịch sử nạp tiền 18

2.5.2.7 Thanh toán online 19

2.5.3 Quản trị viên 19

2.5.3.1 Đăng nhập trang quản trị 19

2.5.3.2 Quản lý danh mục phòng trọ 20

2.5.3.3 Quản lý địa điểm 21

2.5.3.4 Quản lý khách hàng 21

2.5.3.5 Xem lịch sử thanh toán 22

2.5.3.6 Quản lý tin đăng 23

2.5.3.7 Quản lý nạp tiền 23

2.5.3.8 Thống kê 24

2.6 Sơ đồ hoạt động 25

2.6.1 Khách vãng lai 25

2.6.1.1 Tìm kiếm phòng trọ 25

2.6.1.2 Xem thông tin phòng trọ 26

2.6.1.3 Xem thông tin bảng giá 26

2.6.1.4 Đăng ký tài khoản thành viên 27

2.6.2 Khách hàng 27

2.6.2.1 Đăng nhập trang người dùng 27

2.6.2.2 Đăng xuất trang người dùng 28

2.6.2.3 Cập nhật thông tin tài khoản 28

2.6.2.4 Đăng tin phòng trọ 29

2.6.2.5 Cập nhật bài đăng 30

2.6.3 Quản trị viên 30

2.6.3.1 Đăng nhập trang quản trị 30

2.6.3.2 Quản lý địa chỉ phòng trọ 31

2.6.3.3 Quản lý danh mục phòng trọ 31

2.6.3.4 Quản lý khách hàng 32

2.6.3.5 Quản lý phòng trọ 32

2.6.3.6 Quản lý nạp tiền 33

2.7 Sơ đồ mối quan hệ thực thể 33

2.8 Thiết kế cơ sỡ dữ liệu 33

2.8.1 Bảng nguoidung 33

2.8.2 Bảng phong 34

2.8.3 Bảng diadiem 35

2.8.4 Bảng danhmuc 36

2.8.5 Bảng hinhanh 36

2.8.6 Bảng lichsu_naptien 36

2.8.7 Bảng lichsu_thanhtoan 37

2.8.8 Bảng quangtrivien 37

CHƯƠNG 3 XÂY DỰNG CHƯƠNG TRÌNH 38

3.1 Giao diện người dùng (Khách vãng lai và Khách hàng) 38

3.1.1 Giao diện trang chủ khi chưa đăng nhập 38

3.1.2 Giao diện đăng nhập tài khoản 38

3.1.3 Giao diện trang chủ sau khi đăng nhập 39

3.1.4 Giao diện kết quả khi tìm kiếm 40

3.1.5 Giao diện kết quả tìm kiếm phòng trọ theo danh mục 41

3.1.6 Giao diện trang thông tin phòng trọ 41

3.1.7 Giao diện nạp tiền 43

iii SVTH: Võ Thành Tiến

3.1.8 Giao diện bảng giá 43

3.1.9 Giao diện cập nhật tài khoản cá nhân 44

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

3.1.11 Giao diện lịch sử thanh toán 45

3.1.12 Giao diện danh sách tin đăng 45

3.2.1 Giao diện đăng nhập trang quản trị 46

3.2.2 Giao diện chính của trang quản trị 46

3.2.3 Giao diện quản lý địa chỉ 47

3.2.4 Giao diện quản lý danh mục 47

3.2.6 Giao diện quản lý tin đăng phòng trọ 48

3.2.7 Giao diện xem danh sách nạp tiền 49

3.2.8 Giao diện thanh toán 49

3.2.9 Kết quả đạt được 50

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

3.3.3 Kết luận 50

3.3.4 Hướng phát triển 50

TÀI LIỆU THAM KHẢO 51

DANH MỤC BẢNG BIỂU

Bảng 1 1 Kịch bản cho use case tìm kiếm phòng trọ 13

Bảng 1 2 Kịch bản cho use case xem thông tin phòng trọ 13

Bảng 1 4 Kịch bản cho use case xem bảng gái 14

Bảng 1 5 Kịch bản cho use case đăng ký tài khoản thành viên 15

Bảng 1 6 Kịch bản cho use case đăng nhập trang người dùng 15

Bảng 1 7 Kịch bản cho use case cập nhật thông tin tài khoản 16

Bảng 1 8 Kịch bản cho use case đăng tin 17

Bảng 1 9 Kịch bản cho use case cập nhật tin đăng 17

Bảng 1 10 Kịch bản cho use case xem lịch sử thanh toán 18

Bảng 1 11 Kịch bản cho use case lịch sử nạp tiền 19

Bảng 1 12 Kịch bản cho use case đăng nhập trang quản trị 20

Bảng 1 13 Kịch bản cho use case quản lý danh mục phòng trọ 21

Bảng 1 14 Kịch bản cho use case quản lý địa điểm phòng trọ 21

Bảng 1 15 Kịch bản cho use case quản lý thành viên 22

Bảng 1 16 Kịch bản cho use case xem sử thanh toán 23

Bảng 1 17 Kịch bản cho use case quản lý tin đăng 23

Bảng 1 18 Kịch bản cho use case quản lý nạp tiền 24

Bảng 1 20 Kịch bản cho use case thống kê 25

v SVTH: Võ Thành Tiến

DANH MỤC HÌNH

Hình 1 1 Icon HTML 3

Hình 1 2 Icon CSS 4

Hình 1 3 Ví dụ code PHP 4

Hình 1 4 Icon MySQL 5

Hình 1 5 Icon Laravel 6

Hình 1 6 Icon jQuery 6

Hình 1 8 Icon Bootstrap 7

Hình 1 9 Ảnh minh họa Visual Studio Code 7

Hình 1 10 Ảnh minh họa Xampp 8

Hình 1 11 Ảnh minh họa mô hình MVC 9

YHình 2 1 Sơ đồ Use case 12

Hình 2 2 Sơ đồ hoạt động chức năng tìm kiếm phòng trọ thành phố Đà Nẵng 25

Hình 2 3 Sơ đồ hoạt động chức năng xem thông tin phòng trọ 26

Hình 2 5 Sơ đồ hoạt động chức năng xem thông tin bảng giá 26

Hình 2 6 Sơ đồ hoạt động chức năng đăng ký tài khoản 27

Hình 2 7 Sơ đồ hoạt động chức năng đăng nhập trang người dùng 27

Hình 2 8 Sơ đồ hoạt động chức năng cập nhật thông tin tài khoản 28

Hình 2 9 Sơ đồ hoạt động chức năng đăng tin phòng trọ thành phố Đà Nẵng 29

Hình 2 10 Sơ đồ hoạt động chức năng cập nhật bài đăng thành phố Đà Nẵng 30

Hình 2 11 Sơ đồ hoạt động chức năng đăng nhập trang quản trị 30

Hình 2 12 Sơ đồ hoạt động chức năng quản lý địa chỉ phòng trọ 31

Hình 2 13 Sơ đồ hoạt động chức năng quản lý danh mục phòng trọ 31

Hình 2 14 Sơ đồ hoạt động chức năng quản lý khách hàng 32

Hình 2 15 Sơ đồ hoạt động chức năng quản lý phòng trọ 32

Hình 2 16 Sơ đồ hoạt động chức năng quản lý nạp tiền 33

Hình 2 20 Sơ đồ mối quan hệ thực thể 33

YHình 3 1 Giao diện trang chủ khi chưa đăng nhập 38

Hình 3 2 Giao diện đăng nhập tài khoản 39

Hình 3 3 Giao diện trang chủ sau khi đăng nhập 40

Hình 3 4 Giao diện kết quả khi lọc 41

Hình 3 5 Giao diện kết quả tìm kiếm phòng trọ theo danh mục 41

Hình 3 6 Giao diện trang thông tin phòng trọ 42

Hình 3 7 Giao diện nạp tiền 43

Hình 3 8 Giao diện bảng giá 43

Hình 3 9 Giao diện cập nhật thông tin cá nhân 44

Hình 3 10 Giao diện lịch sử nạp tiền 44

Hình 3 11 Giao diện lịch sử thanh toán 45

Hình 3 11 Giao diện lịch sử thanh toán 45

Hình 3 12 Giao diện đăng nhập trang quản trị 46

Hình 3 13 Giao diện chính trang quản trị 46

Hình 3 14 Giao diện quản lý danh địa chỉ 47

Hình 3 15 Giao diện quản lý danh mục 47

Hình 3 16 Giao diện quản lý khách hàng 48

Hình 3 17 Giao diện quản lý tin đăng phòng trọ 48

Hình 3 18 Giao diện nạp tiền 49

Hình 3 19 Giao diện quản lý hàng tồn kho 49

vii SVTH: Võ Thành Tiến

MỞ ĐẦU

1 Lý do chọn đề tài

Thành phố Đà Nẵng đang phát triển mạnh mẽ về kinh tế, du lịch và đón nhậnnhiều sinh viên đến học tập Do đó, nhu cầu tìm kiếm phòng trọ ở đây đang ngày càngtăng cao.Sự cạnh tranh trong lĩnh vực bất động sản tại thành phố Đà Nẵng rất lớn, đặcbiệt là trong lĩnh vực cho thuê phòng trọ Việc xây dựng một website tìm kiếm phòngtrọ có thể giúp các chủ nhà và đại lý bất động sản tìm kiếm khách hàng tiềm năng mộtcách hiệu quả và nhanh chóng hơn Bên cạnh đó xây dựng website tìm kiếm phòng trọtại Đà Nẵng cũng có thể giúp cho các sinh viên, người lao động và du khách tìm kiếmphòng trọ dễ dàng hơn, đồng thời cung cấp thông tin chính xác và đầy đủ về giá cả, vịtrí và tiện ích của phòng trọ mà không cần đến tận nơi để xem Tìm kiếm phòng trọtruyền thống thường gặp phải nhiều khó khăn và không thuận tiện cho người dùng.Việc xây dựng website tìm kiếm phòng trọ giúp cải thiện trải nghiệm người dùng bằngcách cung cấp thông tin chính xác và chi tiết về phòng trọ, giúp người dùng dễ dàngtìm được phòng trọ phù hợp với nhu cầu của mình.Vì vậy em quyết định thực hiện đề

tài: “Xây dựng website tìm kiếm phòng trọ thành phố Đà Nẵng” để giúp cho sinh

viên và những người dân ở khu vực thành phố Đà Nẵng không phải vất vả trong việctìm kiếm phòng trọ của mình trong nhiều năm qua

2 Mục tiêu và nhiệm vụ nghiên cứu

2.1 Mục tiêu:

Xây dựng một hệ thống với mục tiêu chủ yếu là tạo ra một nền tảng kết nối chủ trọvới khách hàng và khách hàng tìm kiếm phòng trọ một cách thuận tiện và nhanhchóng, đồng thời giúp nâng cao trải nghiệm người dùng và tạo ra một môi trường kinhdoanh cạnh tranh trong lĩnh vực cho thuê phòng trọ tại Đà Nẵng

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

3.1 Đối tượng nghiên cứu:

Khách hàng là sinh viên, người lao động, du khách và các đối tượng khác có nhucầu thuê phòng trọ tại thành phố Đà Nẵng

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

Tập trung vào các phòng trọ cho thuê tại thành phố Đà Nẵng

Tập trung vào các website tìm kiếm phòng trọ đã hoạt động tại thành phố Đà Nẵnghoặc các website tương tự tại các thành phố khác để đánh giá và so sánh tính năng vàchức năng của website được xây dựng

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

- Thiết kế cơ sở dữ liệu, sơ đồ usecase, sơ đồ hoạt động: StarUML

- Hỗ trợ soạn thảo mã nguồn: Visual Studio Code

- Ngôn ngữ lập trình: PHP, HTML, CSS(SASS), JavaScript, Jquery

- Thư viện: Framework Laravel, Bootstrap 5, jQuery confirm

- Hệ quản trị CSDL: MySQL (chạy trên môi trường XAMPP)

5 Cấu trúc của đồ án tốt nghiệp

Mở đầu

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

Nêu các cơ sở lý thuyết sẽ áp dụng trong hệ thống: ngôn ngữ HTML, CSS,JavaScript, ngôn ngữ lập trình PHP, hệ quản trị cơ sở dữ liệu MySQL

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

Trình bày các sơ đồ use case, kịch bản cho các use case, sơ đồ ERD, sơ đồ hoạtđộng của các chức năng trong hệ thống Từ những phân tích ở trên, tiến hành thiết kế

cơ sở dữ liệu cho hệ thống sẽ triển khai

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

Từ những phân tích và thiết kế về hệ thống ở trên, áp dụng xây dựng các chứcnăng hệ thống Trình bày giao diện của phần mềm triển khai

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

CHƯƠNG 1 CƠ SỞ LÝ THUYẾT 1.1 Tổng quan về ngôn ngữ lập trình

1.1.1 HTML(Hyper Text Markup Language)

HTML là một ngôn ngữ đánh dấu được thiết kế ra để tạo nên các trang web vớicác mẫu thông tin được trình bày trên World Wide Web Cùng với CSS và Javascript,HTML tạo ra bộ ba nền tảng kỹ thuật cho World Wide Web

HTML được định nghĩa như là một ứng dụng đơn giản của SGML và được sửdụng trong các tổ chức cần đến các yêu cầu xuất bản phức tạp HTML đã trở thànhmột chuẩn Internet do tổ chức World Wide Web Consortium (W3C) duy trì Phiên bảnchính thức mới nhất của HTML và HTML 4.01 (1999) Sau đó, các nhà phát triển đãthay thế nó bằng XHTML Hiện nay, HTML đang được phát triển tiếp với phiên bảnHTML5 hứa hẹn mang lại diện mạo mới cho trang Web

Hình 1 1 Icon HTML

1.1.2 CSS(Cascading Style Sheets)

CSS nó là một ngôn ngữ được sử dụng để tìm và định dạng lại các phần tử đượctạo ra bởi các ngôn ngữ đánh dấu (ví dụ như HTML)

Ta có thể hiểu đơn giản rằng, nếu HTML đóng vai trò định dạng các phần tử trênwebsite như việc tạo ra các đoạn văn bản, các tiểu đề, bảng… thì CSS sẽ giúp chúng ta

có thể thêm một chút “phong cách” vào các phần tử HTML đó như đổi màu sắc trang,đổi màu chữ, thay đổi cấu trúc, ….

CSS được sử dụng trong Website là công nghệ được phát triển bởi W3C, đượcdùng để phát triển Front-end

Hình 1 2 Icon CSS

1.1.3 PHP(Personal Home Page)

PHP là một ngôn ngữ lập trình kịch bản hay một loại mã lệnh chủ yếu được dùng

để phát triển các ứng dụng viết cho máy chủ, mã nguồn mở, dùng cho mục đíchtổng quát Nó rất thích hợp với web và có thể dễ dàng nhúng vào trang HTML [1]

Hình 1 3 Ví dụ code PHP

Do được tối ưu hóa cho các ứng dụng web, tốc độ nhanh, nhỏ gọn, cú pháp giống

C và Java, dễ học và thời gian xây dựng sản phẩm tương đối ngắn hơn so với các ngônngữ khác nên PHP đã nhanh chóng trở thành một ngôn ngữ lập trình web phổ biến.PHP được sử dụng trong Website là công nghệ được thiết kế bởi Rasmus Lerdorf, nhàphát triển The PHP Group, phiên bản sử dụng là PHP 7.3.0 và được sử dụng cho Back-end

1.2 Hệ quản trị cơ sở dữ liệu MySQL

MySQL là một hệ thống quản trị cơ sở dữ liệu quan hệ (RDBMS) hoạt động theo

mô hình client-server RDBMS là một phần mềm hay dịch vụ dùng để tạo và quản lýcác cơ sở dữ liệu (Database) theo hình thức quản lý các mối liên hệ giữa chúng

MySQL là hệ quản trị cơ sở dữ liệu tự do nguồn mở phổ biến nhất thế giới vàđược các nhà phát triển rất ưa chuộng trong quá trình phát triển ứng dụng VìMySQL là hệ quản trị cơ sở dữ liệu tốc độ cao, ổn định và dễ sử dụng, có tính khảchuyển, hoạt động trên nhiều hệ điều hành cung cấp một hệ thống lớn các hàm tiệních rất mạnh Với tốc độ và tính bảo mật cao, MySQL rất thích hợp cho các ứngdụng có truy cập cơ sở dữ liệu trên internet [6]

Hình 1 4 Icon MySQL

1.3 Framework và thư viện hỗ trợ

1.3.1 Giới thiệu Laravel Framework

Laravel là một PHP framework mã nguồn mở và miễn phí, được phát triển bởiTaylor Otwell và nhắm vào mục tiêu hỗ trợ phát triển các ứng dụng web theo kiếmtrúc model-view-controller (MVC) Những tính năng nổi bật của Laravel bao gồm

cú pháp dễ hiểu – rõ ràng , sử dụng hệ thống đóng gói module, quản lý package(Composer), hỗ trợ nhiều hệ quản trị CSDL quan hệ (MySQL, SQLite,PostgeSQL…).[2]

Ưu điểm của Laravel:

- Sử dụng các tính năng mới nhất của PHP

- Nguồn tài nguyên vô cùng lớn và sẵn có

- Tích hợp với dịch vụ mail

- Tốc độ xử lý nhanh

- Dễ sử dụng

- Tính bảo mật cao

Hình 1 5 Icon Laravel

1.3.2 Thư viện Jquery

Jquery chính là một thư viện của JavaScript giúp đơn giản hóa cách viết Javascript

và tăng tốc độ xử lý các sự kiện trên trang web Jquery thêm tính năng tương tác Ajaxvào trong trang web Jquery được thiết kế để thay đổi cách viết mới cho Javascript

Jquery được sử dụng trong Website là công nghệ được thiết kế bở John Resig,phát triển bởi jQuery Team và phiên bản được sử dụng là 3.2.1, được sử dụng choBack-end [4]

Hình 1 6 Icon jQuery

1.3.3 Thư viện Bootstrap

Bootstrap là 1 framework HTML, CSS, và JavaScript cho phép người dùng dễdàng thiết kế website theo 1 chuẩn nhất định, tạo các website thân thiện với các thiết bịcầm tay như mobile, ipad, tablet,

Bootstrap là một bộ sưu tập miễn phí của các mã nguồn mở và công cụ dùng để tạo

ra một mẫu webiste hoàn chỉnh Với các thuộc tính về giao diện được quy định sẵn nhưkích thước, màu sắc, độ cao, độ rộng…, các designer có thể sáng tạo nhiều sản phẩmmới mẻ nhưng vẫn tiết kiệm thời gian khi làm việc với framework này trong quátrình thiết kế giao diện website [5]

Hình 1 7 Icon Bootstrap

1.4 Công cụ hỗ trợ xây dựng hệ thống

1.4.1 Visual Studio Code

Visual Studio Code được biết đến là một trình biên tập lập trình code miễn phí

dành cho Windows, Linux và macOS Nó được phát triển bởi Microsoft là sự kết hợp

hoàn hảo giữa IDE và Code Editor Trình biên tập này được 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, cùng

đó là cải tiến mã nguồn Ngoài ra, Visual Studio Code còn cho phép người dùng thayđổi theme, phím tắt, và các tùy chọn khác

Hình 1 8 Ảnh minh họa Visual Studio Code

Những ưu điểm nổi bật của Visual Studio Code:

- Đa dạng ngôn ngữ lập trình giúp bạn thỏa sức sáng tạo như HTML, CSS,JavaScript, C++,…

- Ngôn ngữ, giao diện tối giản, tinh tế, giúp người dùng dễ dàng định hình nộidung

- Các tiện ích mở rộng đa dạng, phong phú

- Tích hợp các tính năng bảo mật (Git), tăng tốc xử lý vòng lặp (Debug),…

- Có thể đơn giản trong việc tìm quản lý hết tất cả các Code có trên hệ thống

1.4.2 Xampp

Xampp là một phần mềm cho phép giải lập môi trường server hosting ngay trênmáy tính của bạn, cho phép bạn chạy demo website mà không cần phải mua hostinghay VPS Chính vì vậy, Xampp hay được phục vụ cho hoạt động học tập giảng dạy thựhành và phát triển web

Xampp được viết tắt của X + Apache + MySQL + PHP + Perl vì nó được tích hợpsẵn Apache, MySQL, PHP, FTP Server, Mail Server Còn X thể hiện cho sự đa nềntảng của Xampp vì nó có thể dùng được cho 4 hệ điều hành khác nhau: Windows,MacOS, Linus và Solaris

Hình 1 9 Ảnh minh họa Xampp

1.5 Lý thuyết xây dựng website

Mô hình hoạt động MVC (Server Side Rendering):

- Người dùng gửi yêu cầu (HTTP Request) qua một trình duyệt web bất kỳ Yêucầu này có thể kèm theo những dữ liệu tới Controller xử lý Bộ Routing điềuhướng sẽ xác định Controller xử lý

- Khi Controller nhận được yêu cầu, nó sẽ kiểm tra yêu cầu đó có cần dữ liệu từModel hay không Nếu có sẽ dùng các class/function trong Model sau đó trả rakết quả Khi đó, Controller cũng sẽ xử lý các giá trị đó và trả ra view để hiểnthị Controller sẽ xác định các View tương ứng và hiển thị đúng theo yêu cầu

- Khi View nhận được giá trị từ Controller, chúng sẽ xây dựng các thành phầnhiển thị như hình ảnh, thông tin dữ liệu, … rồi trả về GUI content để Controllerđưa ra kết quả và hiển thị lên màn hình Browser

- Browser sẽ nhận được giá trị trả về và hiển thị với người dùng và kết thúc quátrình hoạt động

Hình 1 10 Ảnh minh họa mô hình MVC

CHƯƠNG 2 PHÂN TÍCH THIẾT KẾ HỆ THỐNG 2.1 Tác nhân

2.2.2 Khách hàng

Khách hàng kế thừa những chức năng của khách vãng lai Đồng thời có thêm cácchức năng như cập nhật thông tin tài khoản, nạp tiền , xem lịch sử nạp tiền, lịch sửthanh toán, thanh toán gia hạn, đăng tin phòng trọ , quản lý tin đăng

- Lọc phòng trọ theo loại tin, quận huyện , phường xã hoặc giá, diện tích

- Xem thông tin:

+ Thông tin tổng quan của website

+ Thông tin chi tiết phòng trọ bao gồm tiêu đề phòng trọ cho thuê, giá tiền, địachỉ, tên người đăng bài, số điện thoại liên hệ, loại tin cho thuê

+ Thông tin bảng giá

- Đăng ký tài khoản thành viên

- Liên hệ chủ cho thuê

2.3.2 Khách hàng

Có đầy đủ chức năng của khách vãng lai, ngoài ra còn có thêm các chức năng:

- Đăng nhập, đăng xuất hệ thống

- Cập nhật thông tin tài khoản

- Quản lý địa chỉ: Thêm, sửa và xóa địa chỉ

- Quản lý danh mục: Thêm, sửa và xóa danh mục

- Quản lý tài khoản khách hàng: Sửa và xóa tài khoản khách hàng

- Quản lý phòng: Xem, xóa và duyệt phòng

- Quản lý nạp tiền: Thêm, sửa nạp tiền vào tài khoản khách hàng

- Quản lý thanh toán: Xem lịch sử thanh toán

2.4 Sơ đồ Use case

Hình 2 1 Sơ đồ Use case

2.5 Kịch bản cho Use case

2.5.1 Khách vãng lai

2.5.1.1 Tìm kiếm phòng trọ

STT Use case name Tìm kiếm phòng trọ

1 Description Actor tìm kiếm phòng trọ

3 Input Khách vãng lai truy cập vào hệ thống

4 Output Phòng trọ cần tìm được hiển thị

5 Basic flow

1) Bắt đầu use case2) Actor chọn loại tin hoặc chọn quận/ huyện, phường xã,chọn giá hoặc diện tích

3) Actor nhấn vào button tìm kiếm4) Danh sách phòng trọ tìm kiếm hiển thị4) Kết thúc use case

6 Alternative flow Không có

Bảng 1 1 Kịch bản cho use case tìm kiếm phòng trọ

2.5.1.2 Xem thông tin chi tiết phòng trọ

STT Use case name Xem thông tin chi tiết phòng trọ

1 Description

Actor xem thông tin chi tiết của phòng trọ như hình ảnh trọ, giá tiền, diện tích, địa chỉ thuê trọ , thông tin liên hệ chủ trọ

3 Input Khách vãng lai truy cập vào hệ thống

4 Output Thông tin chi tiết về phòng trọ được hiển thị

5 Basic flow

1) Bắt đầu use case2) Khách vãng lai nhấn chuột vào phòng trọ mình muốn xem

3) Thông tin chi tiết của phòng trọ được hiển thị4) Kết thúc use case

STT Use case name Xem bảng giá

1 Description Actor muốn xem bảng giá đăng bài

3 Input Khách vãng lai truy cập vào hệ thống

4 Output Bảng giá đăng bài được hiển thị

5 Basic flow 1) Bắt đầu use case

2) Actor nhấn vào danh mục bảng giá3) Thông tin giá cả đăng bài được hiển thị ra màn hình3) Kết thúc use case

Bảng 1 3 Kịch bản cho use case xem bảng gía

2.5.1.4 Đăng ký tài khoản thành viên

STT Use case name Đăng ký tài khoản thành viên

1 Description Actor đăng ký tài khoản thành viên của hệ thống

số điện thoại, mật khẩu và nhấn nút đăng ký 4) Kết thúc use case

3’) Hệ thống thông báo lỗi nếu email đã được sử dụng

Bảng 1 4 Kịch bản cho use case đăng ký tài khoản thành viên

2.5.2 Khách hàng

Có các kịch bản giống với actor khách vãng lai, ngoài ra còn có thêm:

2.5.2.1 Đăng nhập trang người dùng

STT Use case name Đăng nhập trang người dùng

1 Description Actor đã có tài khoản có thể đăng nhập

3 Input Khách hàng truy cập vào hệ thống

4 Output Khách hàng đăng nhập thành công

5 Basic flow

1) Bắt đầu use case2) Khách hàng chọn đăng nhập3) Khách hàng nhập email và mật khẩu sau đó nhấn nút đăng nhập

4) Kết thúc use case6

Bảng 1 5 Kịch bản cho use case đăng nhập trang người dùng

2.5.2.2 Cập nhật thông tin tài khoản

STT Use case name Cập nhật thông tin tài khoản

1 Description Actor chỉnh sửa thông tin tài khoản

3 Input Khách hàng đăng nhập thành công

4 Output Khách hàng chỉnh sửa thông tin thành công

5 Basic flow

1) Bắt đầu use case2) Khách hàng nhấn vào ảnh đại diện3) Khách hàng chọn cập nhật tài khoản4) Khách hàng nhập các thông tin muốn sửa đổi5) Khách hàng nhấn nút cập nhật

6) Kết thúc use case6

(Nêu các trường

hợp ngoại lệ của

Basic flow)

định dạng

Bảng 1 6 Kịch bản cho use case cập nhật thông tin tài khoản

2.5.2.3 Đăng tin phòng trọ cho thuê

STT Use case name Đăng tin phòng trọ cho thuê

1 Description Actor tiến hành đăng tin phòng trọ khi có nhu cầu cho

thuê

3 Input Khách hàng đăng nhập thành công

4 Output Khách hàng đăng tin thành công

5 Basic flow

1) Bắt đầu use case2) Khách hàng đăng nhập vào hệ thống 3) Khách hàng chọn button đăng tin mới4) Khách hàng nhập thông tin liên quan đến phòng trọ 3) Thông tin bài đăng được đăng lên và lưu vào hệ thống5) Kết thúc use case

STT Use case name Cập nhật tin đăng

1 Description Khách hàng có thể sữa thông tin bài đăng

3 Input Khách hàng truy cập vào hệ thống, đăng nhập thành công

4 Output Khách hàng cập nhật thành công thông tin bài đăng

5 Basic flow 1) Bắt đầu use case

2) Khách hàng nhấp chuột vào danh sách bài đăng3) Giao diện hiển thị thông tin tất cả các bài đăng mà khách hàng đã đăng

4) Khách hàng nhấn chuột vào sữa tin

5) Khách hàng nhập lại những thông tin cần sửa đổi6) Khách hàng nhấn button lưu

7) Kết thúc use case6

Bảng 1 8 Kịch bản cho use case cập nhật tin đăng

2.5.2.5 Xem lịch sử thanh toán

STT Use case name Xem lịch sử thanh toán

1 Description Khách hàng xem lịch sử thanh toán

3 Input Khách hàng đăng nhập thành công

4 Output Khách hàng xem được lịch sử thanh toán

5 Basic flow

1) Bắt đầu use case2) Khách hàng nhấp chuột vào ảnh đại diện3) Khách hàng nhấp chuột vào lịch sử thanh toán4) Lịch sử thanh toán hiển thị ra màn hình

5) Kết thúc use case6

STT Use case name Xem lịch sử nạp tiền

1 Description Khách hàng có thể xem lịch sử nạp tiền

3 Input Khách hàng đăng nhập thành công