Xây dựng mạng xã hợi chia sẻ khoảng khắc cho những người yêu động vật Social Networking for Animal Lovers

ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG THUẬT PHẦN MỀM Trần Diệu Bảo Trân – 17521150 Đoàn Thế Duy - 17520391 KHĨA LUẬN TỐT NGHIỆP Xây dựng mạng xã hợi chia sẻ khoảng khắc cho những người yêu động vật Social Networking for Animal Lovers KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM GIẢNG VIÊN HƯỚNG DẪN ThS Nguyễn Thị Thanh Trúc TS Nguyễn Hà Giang TP HỒ CHÍ MINH, 2021 NHẬN XÉT KHÓA LUẬN TỐT NGHIỆP (CỦA CÁN BỘ HƯỚNG DẪN/PHẢN BIỆN) Tên khóa ḷn: Xây dựng mạng xã hợi chia sẻ khoảnh khắc cho những người yêu động vật Nhóm SV thực hiện: Trần Diệu Bảo Trân Đồn Thế Duy 17521150 17520391 Cán bộ hướng dẫn/phản biện: ThS Nguyễn Thị Thanh Trúc TS Nguyễn Hà Giang Đánh giá Khóa luận: Về báo cáo: Số trang _ Số chương _ Số bảng số liệu _ Số hình vẽ _ Số tài liệu tham khảo _ Sản phẩm _ Một số nhận xét hình thức báo cáo: Về nợi dung nghiên cứu: Về chương trình ứng dụng: Về thái độ làm việc sinh viên: - Đánh giá chung: Khóa ḷn đạt/khơng đạt u cầu mợt khóa ḷn tốt nghiệp kỹ sư/, xếp loại Giỏi/ Khá/ Trung bình Điểm sinh viên: Đồn Thế Duy:……… /10 Trần Diệu Bảo Trân:……… /10 Người nhận xét (Ký tên ghi rõ họ tên) ĐỀ CƯƠNG CHI TIẾT Tên đề tài: Xây dựng mạng xã hội chia sẻ khoảnh khắc cho những người yêu động vật Cán bộ hướng dẫn : ThS Nguyễn Thị Thanh Trúc - TS Nguyễn Hà Giang Sinh viên thực hiện: Trần Diệu Bảo Trân Đồn Thế Duy 17521150 17520391 Nợi dung đề tài: Đặt vấn đề Ngày nay, mạng xã hội không cịn xa lạ với ngày phát triển mạnh mẽ Có thể nói nhu cầu chia sẽ, kết nối giữa người với người ngày tang mang đến cho người sử dụng mối quan hệ giúp ta giải tỏa cảm xúc… Hiện Facebook một những mạng xã hội lớn để người sử dụng kết nối bạn bè cộng đồng có mối quan tâm Chính mợt mạng xã hội lớn vậy khó tìm những người bạn thật sự có chung sở thích tìm viết liên quan tới những mà ta quan tâm Ví dụ: mợt người u thích thú cưng họ muốn hịa vào mợt cợng đồng những người u thích thú cưng mà khơng bị chi phối những viết khơng liên quan khác Chính vậy Mạng xã hội Petlove dành riêng cho những người yêu thích thú cưng giúp cho họ dễ dàng kết nối với những người bạn có đặc điểm chung u đợng vật Phạm vi đề tài 2.1 Phạm vi công nghệ ● NodeJS (Back-end) ● EJS engine (view) ● AJAX (client) ● MongoDB (database) 2.2 Phạm vi đối tượng Người dùng độ tuổi có máy tính điện thoại thơng minh, có nhu cầu tìm kiếm những người bạn có chung sở thích tìm kiếm những hình ảnh thú vị giới dộng vật Mô tả yêu cầu đề tài 3.1 Các yêu cầu mặc chức năng: ● Đăng kí tài khoản để sử dụng mạng xã hợi ● Đăng nhập ● Thay đổi mật ● Cập nhật trang cá nhân (thông tin cá nhân, avatar, ảnh bìa) ● Viết ● Like bài, comment, share ● Kết bạn (gửi yêu cầu, hủy yêu cầu, chấp nhận, từ chối, hủy kết bạn) ● Chat với bạn bè ● Tìm kiếm người dùng, page, group ● Gợi ý bạn bè, page mới, group ● Tạo group thảo luận, bàn bạc ● Tạo page ● Load newfeed dựa viết user, friend, page đã like group đã join  3.2 Các yêu cầu phi chức năng: ● Website chạy ổn định ● Giao diện thân thiện, dể sử dụng ● Thiết kế hợp xu hướng (trendy) ● Có responsive cho thiết bị di đợng ● Database có khả mở rợng, truy suất nhanh Nội dung thực 4.1 Công nghệ sử dụng ● Front-end: EJS Engine Template : một template dựa HTML, CSS làm giao diện; AJAX dùng xử lí tương tác giữa người dùng với hệ thống ● Back-end: NodeJS ● Database: MongoDB 4.2 Lựa chọn công nghệ Về phần ngơn ngữ lập trình, nhóm chọn công nghệ liên quan đến Javascript nhằm tạo một trang web với một ngôn ngữ Javascript ngơn ngữ lập trình chun lập trình ứng dụng web hướng người dùng, quan tâm đến tương tác, dễ học có cợng đồng lập trình viên phong phú Về phần sở dữ liệu, với mục đích đề ban đầu, ưu tiên mặt tốc độ truy xuất khả mở rộng cực kì linh hoạt, MongoDB sự lựa chọn nhóm Qua tìm hiểu Internet, đáp ứng khả “thời gian thực” website, việc sử dụng No-SQL thực sự cần thiết Kết mong đợi Tạo mợt trang web kết nối những người có đam mê động vật, chia sẽ, lưu giữ những khoảnh khắc đẹp đáng nhớ Kế hoạch thực hiện: STT Nợi dung Thời gian Phân tích đề tài, u cầu, đề xuất danh sách chức Tìm hiểu HTML, CSS, Javascript, Node JS 15/03/2021 - 1/4/2021 Tìm hiểu JWT (Json Web Token), EJS Template 15/03/2021 - 1/4/2021 Xây dựng cấu trúc Database 15/03/2021 - 1/4/2021 Tìm hiểu chức mợt mạng xã hợi 15/03/2021 - 1/4/2021 Dựng UI Mockup 15/03/2021 - 1/4/2021 Tìm hiểu Realtime Chat, SocketIO cho tính Chat Notification 8/4/2021 - 5/5/2021 Thiết kế giao diện trang wed người dùng 8/4/2021 - 5/5/2021 Thiết kế giao diện web Admin 8/4/2021 - 5/5/2021 Tạo kết nối database dùng MongDB Compass MongDB Atlas 8/4/2021 - 5/5/2021 10 Hiện thực backend viết API cho trang web 8/4/2021 - 5/5/2021 11 Gắn backend vào layout cho tính 8/4/2021 - 5/5/2021 12 Responsive, optimize performance 8/4/2021 - 5/5/2021 13 Kiểm tra, fix lỗi, kiểm thử 8/4/2021 - 5/5/2021 14 Triển khai môi trường Internet 8/4/2021 - 5/5/2021 15 Tiếp thu feedback, cải thiện website 8/4/2021 - 5/5/2021 16 Thu thập phân tích dữ liệu, tối ưu hiển thị thông tin trang người dùng 15/03/2021 - 1/4/2021 Xác nhận CBHD TP.HCM, ngày….tháng ….năm (Ký tên ghi rõ họ tên) 2021 Sinh viên (Ký tên ghi rõ họ tên) LỜI CẢM ƠN Đầu tiên, chúng em xin gởi lời cảm ơn chân thành đến tập thể quý Thầy Cô Trường Đại học Công nghệ thông tin – Đại học Quốc gia TP.HCM quý Thầy Cô khoa Công nghệ phần mềm đã giúp cho nhóm tác giả có những kiến thức bản làm tảng để thực đề tài Đặc biệt, chúng em xin gửi lời cảm ơn lòng biết ơn sâu sắc tới Ths Nguyễn Thị Thanh Trúc Ts Nguyễn Hà Giang đã hướng dẫn, hỡ trợ nhóm hồn thành đồ khóa ḷn tốt nghiệp Trong thời gian một học kỳ thực đề tài, nhóm tác giả đã vận dụng những kiến thức tảng đã tích lũy đồng thời kết hợp với việc học hỏi nghiên cứu những kiến thức Từ đó, nhóm vận dụng tối đa những đã thu thập để hồn thành mợt báo cáo đồ án tốt Tuy nhiên, trình thực hiện, chúng em khơng tránh khỏi những thiếu sót Chính vậy, chúng em giả mong nhận những sự góp ý từ phía Thầy Cơ nhằm hồn thiện những kiến thức mà chúng em đã học tập hành trang để nhóm tác giả thực tiếp đề tài khác tương lai Xin chân thành cảm ơn quý Thầy Cô! MỤC LỤC [4] JSON: “JSON with Ajax”, https://www.tutorialspoint.com/json/json_ajax_example.htm 213 [5] Git Tutorial: “Learn GIT simply easy learning”, https://www.tutorialspoint.com/git/index.htm 214 [6] MongoDB: “MongoDB Node Driver”, https://docs.mongodb.com/drivers/node/current/ 215 [7] NodeJS: “”NodeJS docs”, shttps://nodejs.org/en/docs/ 216 [8] RESTful API: “RESTful API gì? Cách thiết kế RESTful API”, https://topdev.vn/blog/restful-api-la-gi/, https://jsonapi.org/ 217 [9] SweetAlert2: “ A beautiful, Responsive, Customizable, accessible (Wai-Aria) replacement for javascript’s popup boxes ”, https://sweetalert2.github.io/ [10] Postman:” Use Postman to test API calls”,https://developer.mypurecloud.com/api/rest/postman/index.html Phụ lục – Hướng dẫn cài đặt 218 ● Tải project từ file đính kèm 219 ● Giải nén project mở project VS Code 220 ● Tiến hành update dependencies, package node_modules command đây, tại thư mục gốc project với terminal: 221 npm install 222 ● Chạy command terminal: 223 nodemon server.js (Trường hợp khơng tìm thấy nodemon, chạy command npm install nodemon, sau chạy lại command nodemon server.js) 224 ● Sau hồn tất, mở trình duyệt truy cập địa http:localhost:3000 Trường hợp localhost:3000 chạy tiến trình khác, làm theo mợt hai cách sau: 225 ● Kill tiến trình, chạy lại command nodemon server.js 226 ● Đổi port 3000 thành một port khác file server.js chạy lại commend server.js Môi trường thực nghiệm Website triển khai thực tế môi trường Internet Microsoft Azure : VPS Database Hosting: MongoDB Atlas Tên miền truy cập: http://petpediavn.me/ Truy cập vào tên miền để sử dụng chức ứng dụng 227