1. Trang chủ
  2. » Giáo Dục - Đào Tạo

Mạng xã hội quảng bá địa điểm du lịch thành phố đà nẵng

71 0 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Mạng Xã Hội Quảng Bá Địa Điểm Du Lịch Thành Phố Đà Nẵng
Tác giả Dương Quốc Vương
Người hướng dẫn ThS. Nguyễn Văn Phát
Trường học Đại Học Đà Nẵng
Chuyên ngành Công Nghệ Thông Tin
Thể loại Đồ Án Tốt Nghiệp
Năm xuất bản 2022
Thành phố Đà Nẵng
Định dạng
Số trang 71
Dung lượng 10,28 MB

Nội dung

TÓM TẮTTên đề tài: Mạng xã hội quảng bá địa điểm du lịch thành phố Đà Nẵng Sinh viên thực hiện: Dương Quốc Vương Mã SV: 1811505310253 Lớp: 18T2 Nội dung tóm tắt Hiện nay, thành phố Đà Nẵ

Trang 1

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

Trang 2

Đà Nẵng, 06/2022

Trang 3

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

Trang 6

TÓM TẮT

Tên đề tài: Mạng xã hội quảng bá địa điểm du lịch thành phố Đà Nẵng

Sinh viên thực hiện: Dương Quốc Vương

Mã SV: 1811505310253 Lớp: 18T2

Nội dung tóm tắt

Hiện nay, thành phố Đà Nẵng đang mở cửa du lịch lại sau dịch covid-19, và việcthúc đẩy du lịch rất cần thiết, việc quảng bá du lịch thông thường thông qua truyềnthông nội bộ địa điểm di lịch và quảng bá bằng các trang mạng xã hội của địa điểm đónên thông tin chưa được phổ biến đến người dân thành phố và khách du lịch, cònmuốn quảng bá cho nhiều người biết đến thì phải thông qua quảng cáo tốn kém trên

TV hoặc banner tờ rơi việc này gây mất thời gian, tốn kém chi phí, ô nhiễm môitrường, vấn đề tìm kiếm theo khu vực du lịch, loại hình địa điểm, vị trí địa điểm chưađược đầy đủ Từ đó em chọn đề tài “Mạng xã hội quảng bá địa điểm du lịch thành phố

Đà Nẵng”, xuất phát từ những nhu cầu thực tế trên, đề tài tập trung giải quyết vấn đềnhư tìm kiếm địa điểm theo khu vực, loại địa điểm, vị trí, cho phép người dùng hoặcđịa điểm du lịch có thể thêm mới địa điểm du lịch vào ứng dụng bổ sung độ phong phúđịa điểm trong ứng dụng, có review đánh giá về địa điểm từ người dung giúp khách dulịch kiểm tra độ tin cậy của địa điểm, ứng dụng có thêm việc nhắn tin tương tác bàiđăng từ người dụng để giúp kết nối người dùng lại với nhau, ứng dụng có xem vị tríđịa điểm trên bản đồ và có chỉ đường đến địa điểm thông qua google maps

Trang 7

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

Giảng viên hướng dẫn: Ths Nguyễn Văn Phát

Sinh viên thực hiện: Dương Quốc Vương Mã SV: 1811505310253

1 Tên đề tài:

Xây dựng website mạng xã hội quảng bá địa điểm du lịch thành phố Đà Nẵng

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

- Tham khảo dữ liệu từ một số website như google maps, booking

- Tham khảo nghiên cứu cấu trúc dữ liệu và vị trí địa điểm xung quanh thành phố

Đà Nẵng và các hội nhóm về du lịch trên Facebook, Tiktok…

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

- Mở đầu

- Chương 1: Cơ sở 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

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

Trang 8

LỜI NÓI ĐẦU

Lời đầu tiên, em xin chân thành cảm ơn Trường Đại học Sư Phạm Kỹ thuật ĐàNẵng đã tạo điều kiện để em có được môi trường học tập và phát triển bản thân tốtnhất

Em xin gửi lời cảm ơn chân thành và sâu sắc tới thầy ThS Nguyễn Văn Phát đãhướng dẫn, giúp đỡ em trong suốt thời gian thực hiện đồ án tốt nghiệp

Em xin chân thành cảm ơn thầy cô bộ môn đã tận tình giảng dạy, truyền đạt kiếnthức cho em trong các học kỳ vừa qua

Xin chân thành cảm ơn tất cả bạn bè đã động viên, giúp đỡ em trong thời gian họctập và hoàn thành đồ án

Tuy đã cố gắng hết sức tìm hiểu, phân tích thiết kế và cài đặt hệ thống nhưng chắcrằng không tránh khỏi những thiếu sót Em rất mong nhận được sự thông cảm và góp ýcủa quý Thầy cô

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

i

Trang 9

CAM ĐOAN

Em xin cam đoan:

1 Những nội dung trong luận văn này do em thực hiện dưới sự hướng dẫn củathầy 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ôngtrì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á, em xinchịu hoàn toàn trách nhiệm

Sinh viên thực hiện

Dương Quốc Vương

ii

Trang 10

MỤC LỤC

MỤC LỤC iii

DANH MỤC BẢNG BIỂU viii

DANH MỤC HÌNH VẼ ix

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

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

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 2

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

1.1 Công nghệ 3

1.1.1 NodeJS 3

1.1.2 ReactJS 4

1.1.3 MongoDB 5

1.2 Phần mềm 6

1.2.1 Visual Studio Code 6

1.2.2 Postman 7

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

2.1 Phân tích đối tượng sử dụng hệ thống 8

iii

Trang 11

2.1.1 Người quản lý 8

2.1.2 Người dùng vãng lai 8

2.1.3 Người dùng thành viên: 9

2.2 Sơ đồ Use Case 10

2.2.1 Danh sách các Actor và hành động của từng Actor 10

2.2.2 Sơ đồ use case của hệ thống 11

2.2.3 Sơ đồ use case của người dùng vãng lai 11

2.2.4 Sơ đồ đồ use case của người dùng thành viên 12

2.2.5 Sơ đồ use case của người quản lý 13

2.2.6 Mô tả kịch bản các Use Case chính: 14

2.2.6.1 Kịch bản use case đóng góp địa điểm 14

2.2.6.2 Kịch bản use case đóng góp bài review địa điểm 14

2.2.6.3 Kịch bản use case quản lý tài khoản 15

2.2.6.4 Kịch bản use case quản lý địa điểm 15

2.2.6.5 Kịch bản use case quản lý bài viết đánh giá 16

2.2.6.6 Kịch bản use csse quản lý phê duyệt (địa điểm, bài viết) 16

2.3 Sơ đồ hoạt động 17

2.3.1 Sơ đồ hoạt động use case tìm kiếm địa điểm 17

2.3.2 Sơ đồ hoạt động use case thêm địa điểm phía người dùng thành viên 17

2.3.3 Sơ đồ hoạt động use case thêm địa địa điểm phía người quản lý 18

2.3.4 Sơ đồ hoạt dộng use case thêm bài viết phía người dùng thành viên18 2.3.5 Sơ đồ hoạt động use case đăng ký tài khoản 19

2.3.6 Sơ đồ hoạt động use case thêm bài review địa điểm 19

2.4 Sơ đồ tuần tự 20

iv

Trang 12

2.4.1 Sơ đồ tuần tự use case xem địa điểm 20

2.4.2 Sơ đồ tuần tự use case xem bài viết review 20

2.4.3 Sơ đồ tuần tự use case đăng ký tài khoản 21

2.4.4 Sơ đồ tuần tự use case đăng nhập 21

2.4.5 Sơ đồ tuần tự use case cập nhật thông tin cá nhân 22

2.4.6 Sơ đồ tuần tự use case viết bài review địa điểm 22

2.4.7 Sơ đồ tuần tự use case thêm địa điểm 23

2.4.8 Sơ đồ tuần tự use case duyệt địa điểm 23

2.4.9 Sơ đồ tuần tự use case duyệt bài viết 24

2.4.10 Sơ đồ tuần tự use case khoá, cập nhật quyền tài khoản 24

2.5 Sơ đồ ERD 25

2.6 Bảng dữ liệu 26

2.6.1 Bảng Users (Người dùng) 26

2.6.2 Bảng Place (Địa điểm) 27

2.6.3 Bảng Regions (Khu vực) 28

2.6.4 Bảng Benefits (Lợi ích địa điểm) 28

2.6.5 Bảng Comments (Bình luận) 28

2.6.6 Bảng Purposes (Mục đích địa điểm) 29

2.6.7 Bảng Tags (Kiểu địa điểm) 29

2.6.8 Bảng Message (Tin nhắn) 29

2.6.9 Bảng Conversation (Danh sách liên hệ) 30

2.6.10 Bảng Categories (Loại địa điểm) 30

2.6.11 Bảng Notify (Thông báo) 30

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

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

v

Trang 13

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

3.2.1 Giao diện trang chủ 31

3.2.2 Giao diện địa điểm 32

3.2.3 Giao diện trang khám phá 33

3.2.4 Giao diện trang chi tiết địa điểm 34

3.2.5 Giao diện phần bản đồ địa điểm 35

3.2.6 Giao diện phần viết review đánh giá 36

3.2.7 Giao diện trang danh sách địa điểm yêu thích 37

3.2.8 Giao diện trang hồ sơ người dùng 38

3.2.9 Giao diện trang tin nhắn 39

3.2.10 Giao diện phần xem review bằng modal 39

3.2.11 Giao diện phần sửa thông tin cá nhân 40

3.2.12 Giao diện phần sửa bài viết review đánh giá 41

3.2.13 Giao diện phần thông báo 41

3.2.14 Giao diện đóng góp địa điểm phía người dùng 42

3.2.15 Giao diện cập nhật địa điểm phía người dùng 43

3.2.16 Giao diện đăng ký và đăng nhập 44

3.2.17 Giao diện phần thêm địa điểm và cập nhật địa điểm ở admin 45

3.2.18 Giao diện trang thống kê admin 45

3.2.19 Giao diện trang quản lý bài viết đánh giá admin 46

3.2.20 Giao diện trang quản lý phê duyệt admin 47

3.2.21 Giao diện trang quản lý khu vực admin 48

3.2.22 Giao diện trang quản lý loại hình địa điểm admin 49

3.2.23 Giao diện trang quản lý mục đích địa điểm admin 50

3.3 Deploy website lên vercel, railway 51

vi

Trang 14

3.3.1 Deploy phần front-end ReactJs lên vercel 51

3.3.2 Deploy phần back-end NodeJS bằng railway 52

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

3.4 Kết luận 53

3.5 Hướng phát triển 53

TÀI LIỆU THAM KHẢO 54

vii

Trang 15

DANH MỤC BẢNG BIỂU

Bảng 2.1: Bảng danh sách các Actor và hành động của từng Actor 10

Bảng 2.2: Bảng kịch bản use case đóng góp địa điểm 14

Bảng 2.3: Bảng kịch bản use case đóng góp bài viết review địa điểm 14

Bảng 2.4: Bảng kịch bản use case quản lý tài khoản 15

Bảng 2.5: Bảng kịch bản use case quản lý địa điểm 15

Bảng 2.6: Bảng kịch bản use case quản lý bài viết đánh giá 16

Bảng 2.7: Bảng kịch bản use case quản lý phê duyệt 16

Bảng 2.8: Bảng Users (Người dùng) 26

Bảng 2.9: Bảng Place (Địa điểm) 27

Bảng 2.10: Bảng Regions (Khu vực) 28

Bảng 2.11: Bảng Benefits (Lợi ích địa điểm) 28

Bảng 2.12: Bảng Comments (Bình luận) 28

Bảng 2.13: Bảng Purposes (Mục đích địa điểm) 29

Bảng 2.14: Bảng Tags (Kiểu địa điểm) 29

Bảng 2.15: Bảng Message (Tin nhắn) 29

Bảng 2.16: Bảng Converstation (Danh sách liên hệ) 30

Bảng 2.17: Bảng Categories (Loại địa điểm) 30

Bảng 2.18: Bảng Notify (Thông báo) 30

viii

Trang 16

DANH MỤC HÌNH VẼ

Hình 1.1: Hình ảnh minh hoạ NodeJS 3

Hình 1.2: Hình ảnh minh hoạ ReactJs 4

Hình 1.3: Hình ảnh minh hoạ MongoDB 5

Hình 1.4: Hình ảnh minh hoạ Visual Studio Code 6

Hình 1.5: Hình ảnh minh hoạ phần mềm Postman 7

Hình 2.1: Hình sơ đồ use case của hệ thống 11

Hình 2.2: Hình ảnh use case của người dùng vãng lai 11

Hình 2.3: Hình ảnh use case của người dùng thành viên 12

Hình 2.4: Hình ảnh use case của người quản lý 13

Hình 2.5: Hình sơ đồ hoạt động use case tìm kiếm địa điểm 17

Hình 2.6: Hình sơ đồ hoạt động use case thêm địa điểm user 17

Hình 2.7: Hình sơ đồ hoạt động use case thêm địa điểm admin 18

Hình 2.8: Hình sơ đồ hoạt động use case thêm bài viết user 18

Hình 2.9: Hình sơ đồ hoạt động use case đăng ký tài khoản 19

Hình 2.10: Hình sơ đồ hoạt động use case thêm bài review địa điểm 19

Hình 2.11: Hình sơ đồ tuần tự use case xem địa điểm 20

Hình 2.12: Hình sơ đồ tuần tự use case xem bài viết review 20

Hình 2.13: Hình sơ đồ tuần tự use case đăng ký tài khoản 21

Hình 2.14: Hình sơ đồ tuần tự use case đăng nhập 21

Hình 2.15: Hình sơ đồ tuần tự use case cập nhật thông tin cá nhân 22

Hình 2.16: Hình sơ đồ tuần tự use case viết bài review địa điểm 22

Hình 2.17: Hình sơ đồ tuần tự use case thêm địa điểm 23

Hình 2.18: Hình sơ đồ tuần tự use case duyệt địa điểm 23

Hình 2.19: Hình sơ đồ tuần tự use case duyệt bài viết 24

ix

Trang 17

Hình 2.20: Hình sơ đồ tuần tự use case khoá, cập nhật quyền tài khoản 24

Hình 2.21: Hình Sơ đồ ERD 25

Hình 3.1: Hình giao diện trang chủ 31

Hình 3.2: Hình giao diện trang địa điểm 32

Hình 3.3: Hình ảnh giao diện trang khám phá 33

Hình 3.4: Hình giao diện trang chi tiết địa điểm 34

Hình 3.5: Hình giao diện phần bản đồ 35

Hình 3.6: Hình giao diện phần viết review đánh giá 36

Hình 3.7: Hình giao diện trang danh sách địa điểm yêu thích 37

Hình 3.8: Hình giao diện trang hồ sơ người dùng 38

Hình 3.9: Hình giao diện trang tin nhắn 39

Hình 3.10: Hình giao diện phần xem review bằng modal 39

Hình 3.11: Hình giao diện phần chỉnh sửa thông tin cá nhân 40

Hình 3.12: Hình giao diện phần sửa bài viết review đánh giá 41

Hình 3.13: Hình giao diện phần thông báo 41

Hình 3.14: Hình giao diện trang đóng góp địa điểm 42

Hình 3.15: Hình giao diện trang cập nhật địa điểm 43

Hình 3.16: Hình giao diện phần đăng ký và đăng nhập 44

Hình 3.17: Hình giao diện phần thêm cập nhật địa điểm ở admin 45

Hình 3.18: Hình giao diện trang thông kê admin 45

Hình 3.19: Hình giao diện trang quản lý bài viết đánh giá admin 46

Hình 3.20: Hình giao diện trang quản lý phê duyệt admin 47

Hình 3.21: Hình email gửi về khi đã phê duyệt thành công 47

Hình 3.22: Hình giao diện trang quản lý khu vực admin 48

Hình 3.23: Hình giao diện trang quản lý loại hình địa điểm admin 49

Hình 3.24: Hình giao diện trang quản lý mục đích địa điểm admin 50

x

Trang 18

Hình 3.25: Hình source code lưu ở github 51 Hình 3.26: Hình deploy vercel chọn liên kết repo github 51 Hình 3.27: Hình trạng thái website sau khi deploy thành công bằng vercel 52 Hình 3.28: Hình deploy bằng railway 52

xi

Trang 19

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

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

1 CNTT Công nghệ thông tin

2 ĐN Đà Nẵng

xii

Trang 20

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

1 ERD Entity Relationship Diagram Sơ đồ quan hệ

xiii

Trang 21

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

MỞ ĐẦU

Hiện nay, Thành phố Đà Nẵng đang mở cửa du lịch lại sau dịch Covid-19, và việcthúc đẩy du lịch rất cần thiết, việc quảng bá du lịch thông thường thông qua truyềnthông nội bộ địa điểm di lịch và quảng bá bằng các trang mạng xã hội của địa điểm đónên thông tin chưa được phổ biến đến người dân thành phố và khách du lịch, cònmuốn quảng bá cho nhiều người biết đến thì phải thông qua quảng cáo tốn kém trên

TV hoặc banner tờ rơi việc này gây mất thời gian, tốn kém chi phí, ô nhiễm môitrường, vấn đề tìm kiếm theo khu vực du lịch, loại hình địa điểm, vị trí địa điểm chưađược đầy đủ

Từ những lý do khách quan trên website mạng xã hội quảng bá địa điểm du lịchtại thành phố Đà Nẵng ra đời để giải quyết vấn đề đó, thông qua trang web và ứngdụng giúp khách du lịch có thể tìm kiếm nhanh địa điểm du lịch trong khu vực phùhợp với mình một cách nhanh chóng và hiệu quả

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

Xây dựng một Website mạng xã hội quảng bá dịa điểm du lịch cho thành phố ĐàNẵng Giúp việc tra cứu thông tin và tương tác với nhau các địa điểm du lịch một cách

dễ dàng hơn Website sẽ bao gồm các chức năng nhằm mục đích:

- Giao diện dễ sử dụng, thân thiện

- Cho phép người dùng xem địa điểm du lịch trực tuyến một cách trực quan đầy đủ

và nhanh chóng

- Cho phép người dùng đăng ký thành viên

- Thông tin các địa điểm phong phú, đa dạng

- Luôn cập nhật, giới thiệu các địa điểm mới

- Tương tác nhắn tin đánh giá địa điểm theo sở thích

- Hỗ trợ người dùng có thể dễ dàng tìm kiếm địa điểm du lịch phù hợp với giá tiền,điều kiện mục đích loại địa điểm, khu vục đúng mong muốn

- Quản lý hiệu quả, thu hút người dùng, thúc đẩy du lịch thành phố

Trang 22

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

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

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

Đối tượng sử dụng là người dùng tại thành phố Đà Nẵng, và khách du lịch trong

và ngoài nước

b Phạm vi nghiên cứu

Thành phố Đà Nẵng

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

- Nghiên cứu lý thuyết thu thập thông tin qua internet, tài liệu, sách để tìm đượccác cơ sở lý thuyết liên quan đến vấn đề mình nghiên cứu

- Nghiên cứu quy trình khảo sát và đánh giá địa điểm thực tế

- Triển khai thực nghiệm xây dựng website

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

- Ngôn ngữ lập trình: HTML, CSS, JS, ReactJS, NodeJS

- Hệ quản trị cơ sở dữ liệu: MongoDB

- Công cụ hỗ trợ: Visual Studio Code, Postman, MongoDB Compass

5 Cấu trúc đồ án

Bài báo cáo đồ án bao gồm các phần

Mở đầu

Chương 1: Cơ sở 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

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

Trang 23

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

Chương 1

CƠ SỞ LÝ THUYẾT

1.1 Công nghệ

1.1.1 NodeJS

NodeJS là một mã nguồn được xây dựng dựa trên nền tảng Javascript V8 Engine,

nó được sử dụng để xây dựng các ứng dụng web như các trang video clip, các forum

và đặc biệt là trang mạng xã hội phạm vi hẹp NodeJS là một mã nguồn mở được sửdụng rộng bởi hàng ngàn lập trình viên trên toàn thế giới

Hình 1.1.1.1.1.1: Hình ảnh minh hoạ NodeJSNodeJS có thể chạy trên nhiều nền tảng hệ điều hành khác nhau từ Window chotới Linux, MacOS nên đó cũng là một lợi thế NodeJS cung cấp các thư viện phongphú ở dạng Javascript Module khác nhau giúp đơn giản hóa việc lập trình và giảm thờigian ở mức thấp nhất

Có 2 NodeJS framework được sử dụng phổ biến là Express và SocketIO

Các đặc tính của NodeJS:

Không đồng bộ: Tất cả các API của NodeJS đều không đồng bộ (none-blocking),

nó chủ yếu dựa trên nền của NodeJS Server và chờ đợi Server trả dữ liệu về Việc di

Trang 24

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

chuyển máy chủ đến các API tiếp theo sau khi gọi và cơ chế thông báo các sự kiện củaNode.js giúp máy chủ để có được một phản ứng từ các cuộc gọi API trước

Chạy rất nhanh: NodeJS được xây dựng dựa vào nền tảng V8 Javascript Enginenên việc thực thi chương trình rất nhanh

Đơn luồng nhưng khả năng mở rộng cao: NodeJS sử dụng một mô hình luồng duynhất với sự kiện lặp Cơ chế tổ chức sự kiện giúp các máy chủ để đáp ứng một cáchkhông ngăn chặn và làm cho máy chủ cao khả năng mở rộng như trái ngược với cácmáy chủ truyền thống mà tạo đề hạn chế để xử lý yêu cầu NodeJS sử dụng mộtchương trình đơn luồng và các chương trình tương tự có thể cung cấp dịch vụ cho một

số lượng lớn hơn nhiều so với yêu cầu máy chủ truyền thống như Apache HTTPServer

Không đệm: NodeJS không đệm bất kì một dữ liệu nào và các ứng dụng này chủyếu là đầu ra dữ liệu

1.1.2 ReactJS

ReactJS là một opensource được phát triển bởi Facebook, ra mắt vào năm 2013,bản thân nó là một thư viện Javascript được dùng để để xây dựng các tương tác với cácthành phần trên website Một trong những điểm nổi bật nhất của ReactJS đó là việcrender dữ liệu không chỉ thực hiện được trên tầng Server mà còn ở dưới Client nữa

Hình 1.1.2.1.1.1: Hình ảnh minh hoạ ReactJs

Trang 25

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

ReactJS là một thư viện JavaScript chuyên giúp các nhà phát triển xây dựng giaodiện người dùng hay UI Trong lập trình ứng dụng front-end, lập trình viên thường sẽphải làm việc chính trên 2 thành phần sau: UI và xử lý tương tác của người dùng UI làtập hợp những thành phần mà bạn nhìn thấy được trên bất kỳ một ứng dụng nào

1.1.3 MongoDB

Hình 1.1.3.1.1.1: Hình ảnh minh hoạ MongoDBMongoDB 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ấtnhanh

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ệulưu trữ không cần tuân theo một cấu trúc nhất định

Trang 26

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

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

1.2 Phần mềm

1.2.1 Visual Studio Code

Visual Studio Code là một trong những trình soạn thảo mã nguồn phổ biến nhấthiện nay được sử dụng bởi các lập trình viên Nhanh, nhẹ, hỗ trợ đa nền tảng, nhiềutính năng và là mã nguồn mở chính là những ưu điểm vượt trội khiến Visual StudioCode ngày càng chứng tỏ ưu thế vượt trội của mình so với những p hần mềm khác vàđược ứng dụng rộng rãi

Hình 1.2.1.1.1.1: Hình ảnh minh hoạ Visual Studio CodeVisual Studio Code hỗ trợ chức năng Debug, đi kèm với Git, có SyntaxHighlighting, tự hoàn thành mã thông minh, snippets, và cải tiến mã nguồn Nhờ tínhnăng tùy chỉnh, Visual Studio Code cũng cho phép người dùng thay đổi Theme, phímtắt, và các tùy chọn khác

Trang 27

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

1.2.2 Postman

Postman là một công cụ cho phép chúng ta thao tác với API, phổ biến nhất làREST Postman hiện là một trong những công cụ phổ biến nhất được sử dụng trongthử nghiệm các API Với Postman, ta có thể gọi Rest API mà không cần viết dòngcode nào

Postman có sẵn nhiều phiên bản cho các hệ điều hành và môi trường khác nhau

Đó cùng là điểm khiến nó trở nên phổ biến hơn

Postman hỗ trợ tất cả các phương thức HTTP (GET, POST, PUT, PATCH,DELETE, …) Bên cạnh đó, nó còn cho phép lưu lại lịch sử các lần request, rất tiệncho việc sử dụng lại khi cần

Hình 1.2.2.1.1.1: Hình ảnh minh hoạ phần mềm Postman

Trang 28

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

Chức năng bao gồm:

- Đăng nhập tài khoản quản lý

- Quản lý địa điểm

- Quản lý tài khoản

- Quản lý bài đăng khuyến mãi

- Quản lý bài viết review địa điểm

- Phê duyệt địa điểm được thêm từ người dùng thành viên

- Phê duyệt bài viết khuyến mãi từ người dùng thành viên

- Phê duyệt bài viết review địa điểm từ người dùng thành viên

2.1.2 Người dùng vãng lai

Chức năng bao gồm:

- Đăng ký thành viên

- Tìm kiếm lọc địa điểm theo nhu cầu du lịch

- Xem địa điểm bằng google maps, chỉ đường đến địa điểm bằng google maps

- Xem bài viết khuyến mãi

- Xem bài viết và các bình luận về địa điểm

- Xem những bài review du lịch

Trang 29

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

2.1.3 Người dùng thành viên:

Là người dùng đã đăng ký tài khoản

Chức năng bao gồm:

- Đăng nhập thành viên

- Yêu thích, theo dõi địa điểm

- Bình luận, Đánh giá địa điểm

- Theo dõi người dùng

- Yêu thích, bình luận tương tác bài viết của người dùng khác

- Nhắn tin realtime

- Đóng góp địa điểm mới (chờ phê duyệt)

- Đóng góp bài viết khuyến mãi (chờ phê duyệt)

- Đóng góp bài viết review địa điểm (chờ phê duyệt)

Trang 30

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

2.2 Sơ đồ Use Case

2.2.1 Danh sách các Actor và hành động của từng Actor

Actor Hành động

Khách vãng lai - Đăng ký tài khoản

- Tìm kiếm lọc địa điểm

- Xem thông tin địa điểm

- Xem bài viết, bài review, đánh giá…

- Xem vị trí địa điểm bằng google maps

Người dùng - Kế thừa lại những Hành động của Khách vãng lai

- Đăng nhập tài khoản

- Yêu thích, theo dõi địa điểm

- Bình luận, Đánh giá địa điểm

- Theo dõi người dùng

- Yêu thích, bình luận tương tác bài viết của người dùng khác

- Nhắn tin realtime

- Đóng góp địa điểm mới (chờ phê duyệt)

- Đóng góp bài viết khuyến mãi (chờ phê duyệt)

- Đóng góp bài viết review địa điểm (chờ phê duyệt)

Người quản lý - Đăng nhập tài khoản quản lý

- Quản lý địa điểm

- Quản lý tài khoản

- Quản lý bài đăng khuyến mãi

- Quản lý bài viết review địa điểm

- Phê duyệt địa điểm được thêm từ người dùng thành viên

- Phê duyệt bài viết khuyến mãi từ người dùng thành viên

- Phê duyệt bài viết review địa điểm từ người dùng thành viênBảng 2.2.1.1.1.1.1: Bảng danh sách các Actor và hành động của từng Actor

Trang 31

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

2.2.2 Sơ đồ use case của hệ thống

Hình 2.2.2.1.1.1: Hình sơ đồ use case của hệ thống

2.2.3 Sơ đồ use case của người dùng vãng lai

Hình 2.2.3.1.1.1: Hình ảnh use case của người dùng vãng lai

Trang 32

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

2.2.4 Sơ đồ đồ use case của người dùng thành viên

Hình 2.2.4.1.1.1: Hình ảnh use case của người dùng thành viên

Trang 33

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

2.2.5 Sơ đồ use case của người quản lý

Hình 2.2.5.1.1.1: Hình ảnh use case của người quản lý

Trang 34

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

2.2.6 Mô tả kịch bản các Use Case chính:

2.2.6.1 Kịch bản use case đóng góp địa điểm

Diễn tảActor Người dùng thành viên

Điều kiện tiên quyết Người dùng thành viên đã đăng nhập

Điều kiện thực thi Khi người dùng kích hoạt

Xử lý chính 1 Chọn mục “Đóng góp địa điểm”

2 Nhập đầy đủ thông tin cần thiết

3 Nhấn chọn “Thêm địa điểm”

4 Sau khi thêm thành công thì địa điểm sẽ trong trạngthái chờ phê duyệt

Xử lý ngoại lệ Khi nào người dùng gây ra lỗi hệ thống quay lại bước 1Bảng 2.2.6.1.1.1.1: Bảng kịch bản use case đóng góp địa điểm

2.2.6.2 Kịch bản use case đóng góp bài review địa điểm

Diễn tảActor Người dùng thành viên

Điều kiện tiên quyết Người dùng thành viên đã đăng nhập

Điều kiện thực thi Khi người dùng kích hoạt

Trang 35

Mạng xã hội quảng bá địa điểm du lịch Đà Nẵng

2.2.6.3 Kịch bản use case quản lý tài khoản

Diễn tảActor Người quản lý

Điều kiện tiên quyết Người quản lý đã đăng nhập

Điều kiện thực thi Khi người quản lý kích hoạt

Xử lý chính 1 Chọn mục “Quản lý tài khoản”

2 Nhấn chọn “Xem chi tiết” để xem chi tiết tài khoản

3 Nhấp chọn “Khoá tài khoản” nếu tài khoản vi phạm

4 Nhấn chọn “Cập nhật tài khoản” để cập nhật thông tincho tài khoản

Xử lý ngoại lệ Khi nào người quản lý gây ra lỗi hệ thống quay lại bước 1Bảng 2.2.6.3.1.1.1: Bảng kịch bản use case quản lý tài khoản

2.2.6.4 Kịch bản use case quản lý địa điểm

Diễn tảActor Người quản lý

Điều kiện tiên quyết Người quản lý đã đăng nhập

Điều kiện thực thi Khi người quản lý kích hoạt

Xử lý chính 1 Chọn mục “Quản lý địa điểm”

2 Nhấn chọn “Xem chi tiết” để xem chi tiết địa điểm

3 Nhấn chọn “Thêm địa điểm” để thêm mới 1 địa điểm

4 Nhấn chọn “Xoá địa điểm” nếu địa điểm không tồn tại

5 Nhấn chọn “Cập nhật địa điểm” để cập nhật thông tincho địa điểm

Xử lý ngoại lệ Khi nào người quản lý gây ra lỗi hệ thống quay lại bước 1Bảng 2.2.6.4.1.1.1: Bảng kịch bản use case quản lý địa điểm

Ngày đăng: 07/03/2024, 10:44

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN

w