Website du lịch , dịch vụ bán sản phẩm, Website bán sản phẩm
BỘ CÔNG THƯƠNG TRƯỜNG ĐẠI HỌC CÔNG NGHIỆP THÀNH PHỒ HỒ CHÍ MINH KHOA CƠNG NGHỆ THƠNG TIN BÁO CÁO KHÓA LUẬN TỐT NGHIỆP ĐỀ TÀI WEBSITE DU LỊCH VÀ DỊCH VỤ BÁN SẢN PHẨM Chuyên ngành đào tạo: KỸ THUẬT PHẦN MỀM Giảng viên hướng dẫn: ThS NGUYỄN VĂN THẮNG Lớp: DHKTPM12A Họ tên sinh viên 1: PHẠM THANH DUY Mã số sinh viên 1: 16043751 Họ tên sinh viên 2: TRỊNH ĐỨC DUY Mã số sinh viên 2: 16018731 Thành phố Hồ Chí Minh, tháng năm 2020 INDUSTRIAL UNIVERSITY OF HO CHI MINH CITY FACULTY OF INFORMATION TECHNOLOGY TRINH DUC DUY PHAM THANH DUY WEBSITE TRAVEL AND TRAVEL PRODUCT SALE SERVICE Major: Software engineer Supervisor: MSc Nguyen Van Thang HO CHI MINH CITY, 2020 Title: WEBSITE TRAVEL AND TRAVEL PRODUCT SALE SERVICE Abstract: - Reason for writing: Today, tourism services are very developing so attract many people traveling in domestic and foreign tourist destinations But most travelers not fully understand the basic information about the places in their travel as well as to prepare the necessary equipment for the trip In addition, travelers need to have a forum where they can share travel experiences, photos, emotions when traveling, evaluate travel destinations, travel products and products and plan travel for yourself in the future Therefore, building a website travel and travel product sale service is a necessity for tourists today - Problems: Viewers can manage the cart and see information about tourist destinations, products, review posts and comments Members can login, create account, update personal information, order products, view purchase history, manage post, review places or products, create schedule, see the schedule created Admin can manage products, approve member posts, revenue statistics and product selling statistics - Methods: Using HTML, CSS, JavaScript, Bootstrap combine with ReactJS framework to create interface for website, NodeJS Platform to implement features for website, database NoSQL MongoDB, Socket.io Library to perform real-time interactions and deploying website on service cloud computing Heroku - Results: View introductory information about the tourist destinations, products, review posts, comments, register a member, log in, manage the cart, order products, review place or product, create and view schedule, update personal information, search information about places, products, review posts, manage (add, edit, delete) products, approve member posts, revenue statistics and product selling statistics - Conclusion: Adding expansion operations: create collection, manage places, integrating the services of renting hotels, renting tourist cars, booking air tickets, train tickets, bus tickets and allow members participate in the schedules created LỜI CẢM ƠN Website du lịch dịch vụ bán sản phẩm nội dung đề tài mà nhóm chúng em chọn để nghiên cứu, phát triển làm khóa luận tốt nghiệp sau năm theo học ngành Kỹ thuật phần mềm Khoa Công nghệ thông tin - Trường Đại học Công nghiệp Thành phố Hồ Chí Minh Đầu tiên, nhóm em xin gửi lời cảm ơn đến Thầy, Cô Khoa Công nghệ thông tin trường Đại học Công nghiệp Thành phố Hồ Chí Minh truyền đạt kiến thức chuyên ngành kỹ mềm để chúng em có hành trang, trang bị đầy đủ kiến thức để thực tốt khóa luận tốt nghiệp đường nghiệp tương lai Ngoài ra, chúng em xin trân trọng cảm ơn thầy hướng dẫn ThS Nguyễn Văn Thắng – giảng viên môn Kỹ thuật phần mềm, thầy tận tình hướng dẫn, bảo nhóm trình tìm hiểu, nghiên cứu việc hồn thành đề tài khóa luận tốt nghiệp Tuy nhiên, giới hạn kiến thức khả lý luận thân chúng em cịn nhiều thiếu sót hạn chế nên khơng thể hồn thành khóa luận cách tốt nhất, nhóm chúng em kính mong nhận dẫn đóng góp Thầy, Cơ để khóa luận nhóm chúng em hồn thiện Cuối cùng, chúng em xin chân thành cảm ơn gửi lời chúc sức khỏe tốt đẹp tới Q Thầy, Cơ! Tp Hồ Chí Minh, ngày 01 tháng năm 2020 Sinh viên thực Phạm Thanh Duy Trịnh Đức Duy Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm NHẬN XÉT VÀ ĐÁNH GIÁ CỦA GIÁO VIÊN HƯỚNG DẪN Thông tin sinh viên làm khóa luận: Họ tên sinh viên 1: Phạm Thanh Duy Mã số sinh viên 1: 16043751 Họ tên sinh viên 2: Trịnh Đức Duy Mã số sinh viên 2: 16018731 Khoa: Công nghệ thông tin Chuyên ngành: Kỹ thuật phần mềm Lớp: DHKTPM12A Tên đề tài: Website du lịch dịch vụ bán sản phẩm Tổng quan khóa luận: Số chương: Số trang: 125 Số bảng biểu: 36 Số hình vẽ: 118 Số tài liệu tham khảo: 11 Nhận xét (thái độ làm việc, kết đạt được, hạn chế): …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm …………………………………………………………………………………… …………………………………………………………………………………… Đề nghị: Được bảo vệ khóa luận trước mơn: Khơng bảo vệ: Tp Hồ Chí Minh, ngày tháng năm 2020 Giảng viên hướng dẫn (Ký ghi rõ họ tên) Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm NHẬN XÉT VÀ ĐÁNH GIÁ CỦA GIÁO VIÊN PHẢN BIỆN Thông tin sinh viên làm khóa luận: Họ tên sinh viên 1: Phạm Thanh Duy Mã số sinh viên 1: 16043751 Họ tên sinh viên 2: Trịnh Đức Duy Mã số sinh viên 2: 16018731 Khoa: Công nghệ thông tin Chuyên ngành: Kỹ thuật phần mềm Lớp: DHKTPM12A Tên đề tài: Website du lịch dịch vụ bán sản phẩm Nhận xét (kết đạt được, hạn chế): …………………………………………………………………………………… … ……….………………………………………………………………………….…… ……………….……………………………………………………………….……… ……………………….…………………………………………………….………… ……………………………….………………………………………….…………… ……………………………………… ……………………………………………… ……………………………………………… ……………………………………… ………………………………………………………………… Đề nghị: Bảo vệ trước hội đồng: Không bảo vệ: Đánh giá qua hình thức Poster: Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm Tp Hồ Chí Minh, ngày tháng Giảng viên phản biện (Ký ghi rõ họ tên) Giảng viên phản biện (Ký ghi rõ họ tên) năm 2020 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm MỤC LỤC CHƯƠNG : GIỚI THIỆU 1.1 Tổng quan 1.2 Mục tiêu đề tài 1.3 Phạm vi đề tài 1.4 Mô tả yêu cầu chức CHƯƠNG : CƠ SỞ LÝ THUYẾT 2.1 ReactJS [1] 2.2 NodeJS [2] 2.3 MongoDB [3] 10 2.4 Cloud Computing với Heroku [4] 12 CHƯƠNG : PHÂN TÍCH VÀ THIẾT KẾ 14 3.1 Phân tích yêu cầu UML 14 3.1.1 Usecase tổng quát 14 3.1.2 Danh sách tác nhân mô tả 15 3.1.3 Danh sách tình hoạt động (Use cases) 15 3.1.4 Tình hoạt động 17 3.2 Class diagram 87 3.3 Deployment diagram .88 CHƯƠNG : HIỆN THỰC VÀ KẾT LUẬN 89 4.1 Chi tiết cài đặt cấu hình phần mềm 89 4.2 Giao diện hệ thống 89 4.3 Test case 102 4.3.1 Thử nghiệm chức Đăng nhập 102 4.3.2 Thử nghiệm chức Tạo đăng .104 4.3.3 Thử nghiệm chức Cập nhật thông tin cá nhân 106 4.3.4 Thử nghiệm chức Tạo lịch trình cho chuyến 109 4.3.5 Thử nghiệm chức Chọn mua sản phẩm toán 113 4.4 Kết luận 122 4.4.1 Kết đạt 122 4.4.2 Hạn chế đồ án 123 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm 4.4.3 Hướng phát triển 123 TÀI LIỆU THAM KHẢO .124 PHỤ LỤC 125 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm - Mục 10: Nút xóa địa điểm du lịch khỏi ngày mà người dùng chọn - Mục 11: Nút thêm ngày cho lịch trình du lịch người dùng - Mục 12: Nút hồn thành tạo lịch trình 4.3.4.2 Luồng hoạt động - Mục 5: Khi người dùng nhấn vào nút hệ thống nhận tất thông tin tên chuyến đi, địa điểm muốn khám phá, ngày ngày + Nếu người dùng để trống ô tên chuyến hệ thống thông báo sau: Hình 4.30 Alert thơng báo ‘Tên hành trình không rỗng’ + Nếu người dùng chưa chọn địa điểm để khám phá hệ thống hiển thị thơng báo sau: Hình 4.31 Alert thông báo ‘Bạn chưa chọn địa điểm’ + Nếu người dùng nhập đầy đủ thơng tin hệ thống hiển thị giao diện hình 4.28 Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 111 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm - Mục 6: Nếu người dùng nhấn vào nút hệ thống xóa tất thông tin mà người dùng thao tác giao diện quay giao diện hình 4.27 - Mục 7: Người dùng nhấn vào nút để chọn ngày lưu điểm đến du lịch muốn người dùng vào bảng địa điểm du lịch ngày - Mục 9: Nếu người dùng nhấn vào nút hệ thống lưu điểm đến du lịch vào ngày mà người dùng chọn mục - Mục 10: Nếu người dùng nhấn vào nút hệ thống xóa điểm đến du lịch khỏi ngày mà người dùng chọn mục - Mục 11: Nếu người dùng nhấn vào nút hệ thống thêm ngày cho lịch trình du lịch người dùng - Mục 12: Nếu người dùng nhấn vào nút hệ thống lưu tất thơng tin lịch trình du lịch người dùng vào sở liệu gởi email thông báo qua email cá nhân người dùng + Nếu người dùng chưa chọn điểm đến du lịch cho ngày lịch trình du lịch hệ thống hiển thị thơng báo sau: Hình 4.32 Alert thơng báo ‘Chưa chọn địa điểm cho ngày chọn’ + Nếu người dùng nhập, chọn đầy đủ thông tin yêu cầu lịch trình du lịch hệ thống hiển thị thơng báo sau: Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 112 Báo cáo khóa luận tốt nghiệp chun ngành Kỹ thuật phần mềm Hình 4.33 Alert thơng báo ‘Tạo lịch trình thành cơng’ 4.3.5 Thử nghiệm chức Chọn mua sản phẩm toán Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 113 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm Hình 4.34 Giao diện thử nghiệm chức Chọn mua sản phẩm Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 114 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm Hình 4.35 Giao diện thử nghiệm Giỏ hàng đăng nhập chưa đăng nhập Hình 4.36 Giao diện thử nghiệm Xác nhận đơn đặt hàng Hình 4.37 Giao diện thử nghiệm Xem lịch sử đặt/mua hàng 4.3.5.1 Mô tả mục - Mục 1: Ơ nhập từ khóa tìm kiếm - Mục 2: Nút tìm kiếm - Mục 3: Nút menu danh mục loại sản phẩm - Mục 4: Loại sản phẩm - Mục 5: Sản phẩm HOT - Mục 6: Nút xem chi tiết sản phẩm - Mục 7: Nút chọn mua sản phẩm vào giỏ hàng - Mục 8: Giỏ hàng - Mục 9: Nút xóa sản phẩm khỏi giỏ hàng - Mục 10: Ô nhập cập nhật số lượng sản phẩm giỏ hàng Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 115 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm - Mục 11: Nút toán paypal - Mục 12: Nút tốn hình thức tốn trực tiếp nhận hàng - Mục 13: Ô nhập địa nhận hàng - Mục 14: Nút quay lại tiếp tục mua sản phẩm - Mục 15: Nút xác nhận đơn đặt hàng - Mục 16: Nút hủy đơn hàng đặt hàng - Mục 17: Nút xác nhận nhận hàng 4.3.5.2 Luồng hoạt động - Mục 2: Khi người dùng nhấn vào nút hệ thống nhận liệu từ mục để tìm kiếm sản phẩm (tìm kiếm sản phẩm tương đối) + Nếu tên sản phẩm để rỗng hệ thống hiển thị tất sản phẩm hình + Nếu tên sản phẩm có sở liệu hệ thống hiển thị thông tin sản phẩm hình + Nếu tên sản phẩm khơng có sở liệu hệ thống hiển thị thơng báo sau: Hình 4.38 Alert thơng báo ‘Khơng tìm thấy thơng tin sản phẩm’ Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 116 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm - Mục 3: Nếu người dùng nhấn vào nút hệ thống hiển thị danh mục loại sản phẩm mục Ngược lại, người dùng nhấn vào nút lần hệ thống thu gọn danh mục loại sản phẩm lại - Mục 5: Nếu sản phẩm có người đặt hàng ngày sản phẩm sản phẩm HOT Ngược lại sản phẩm khơng phải sản phẩm HOT - Mục 6: Nếu người dùng nhấn vào nút hệ thống chuyển sang trang xem chi tiết thơng tin sản phẩm - Mục 7: Nếu người dùng nhấn vào nút hệ thống chuyển sản phẩm vào giỏ hàng mục - Mục 8: + Nếu người dùng hover vào nút hệ thống hiển thị giao diện giỏ hàng hình 4.3.5.2 (bên trái) + Nếu người dùng hover vào nút mà chưa đăng nhập hệ thống hiển thị giao diện giỏ hàng hình 4.3.5.2 (bên phải) - Mục 9: Nếu người dùng nhấn vào nút hệ thống hỏi sau: Hình 4.39 Alert thơng báo ‘Xác nhận xóa sản phẩm’ + Nếu người dùng chọn ‘Yes’ hệ thống xóa sản phẩm khỏi giỏ hàng Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 117 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm + Nếu người dùng chọn ‘No’ hệ thống không thực thao tác - Mục 10: Người dùng nhập số lượng sản phẩm muốn mua vào ô này, sau nhấn enter để cập nhật lại tổng toán giỏ hàng + Nếu người dùng nhập số lượng sản phẩm > 10 hệ thống hiển thị thơng báo sau: Hình 4.40 Alert cảnh báo ‘Số lượng sản phẩm không vượt 10’ + Nếu người dùng nhập số lượng hệ thống tự động xóa sản phẩm khỏi giỏ hàng - Mục 11: Nếu người dùng nhấn vào nút hệ thống hiển thị giao diện đăng nhập vào tài khoản paypal cho người dùng toán sau: Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 118 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm Hình 4.41 Giao diện Thanh tốn hình thức Paypal + Nếu người dùng hủy tốn hệ thống hiển thị thông báo sau: Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 119 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm Hình 4.42 Alert thơng báo ‘Hủy tốn hình thức Paypal’ - Mục 12: Nếu người dùng nhấn vào nút hệ thống hiển thị giao diện hình 4.3.5.3 - Mục 13: Nếu người dùng cập nhật địa người dùng hệ thống tự động lấy địa để làm địa giao hàng Mặt khác, người dùng thay đổi địa giao hàng - Mục 14: Nếu người dùng nhấn vào nút hệ thống quay lại hình cho phép người dùng tiếp tục chọn mua sản phẩm - Mục 15: Nếu người dùng nhấn vào nút hệ thống hiển thị thông báo sau chuyển tới trang xem lịch sử đặt/mua hàng hình 4.3.5.4: Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 120 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm Hình 4.43 Alert thơng báo ‘Đã đặt hàng thành công’ - Mục 16: Nếu người dùng nhấn vào nút hệ thống hỏi sau: Hình 4.44 Alert thông báo ‘Xác nhận hủy đơn hàng’ + Nếu người dùng chọn ‘Yes’ hệ thống hủy đơn hàng mà người dùng đặt + Nếu người dùng chọn ‘No’ hệ thống khơng thực thao tác - Mục 17: Nếu người dùng nhấn vào nút hệ thống hiển thị thơng báo sau: Hình 4.45 Alert thơng báo ‘Xác nhận đơn hàng thành công’ Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 121 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm 4.4 Kết luận 4.4.1 Kết đạt Trong khoảng thời gian từ ngày 09/03/2020 nhóm thực công việc sau: - Lập kế hoạch ban đầu hàng tuần bổ sung kế hoạch thực tế cho đề tài - Các tài liệu phân tích, thiết kế website - Chương trình thực website viết NodeJS Platform kết hợp với Express Framework để làm server-side, ReactJS để làm giao diện tương tác cho client-side kết hợp với sở liệu NoSQL MongoDB để dễ dàng truy xuất liệu nhanh chóng - Chương trình thực thi ứng dụng điện tốn đám mây Heroku để website người dùng sử dụng, trải nghiệm dễ dàng Cloud - Từ việc sử dụng cơng nghệ vào việc xây dựng ứng dụng website, nhóm thực chức website như: + Đăng nhập/Đăng ký + Tìm kiếm xem chi tiết thơng tin địa điểm + Tìm kiếm xem thông tin sản phẩm dịch vụ + Xem đăng + Xem nội dung bình luận + Quản lý giỏ hàng (xem, thêm, xóa, cập nhật) + Cập nhật thơng tin cá nhân + Đặt/Thanh tốn sản phẩm dịch vụ + Xem lịch sử đặt/thanh toán sản phẩm + Quản lý đăng (đăng bài, xóa bài) + Tương tác đăng + Đánh giá địa điểm/sản phẩm + Tạo lịch trình chuyến Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 122 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm + Xem lịch trình tạo + Quản lý sản phẩm dịch vụ + Thống kê sản phẩm bán chạy nhất, doanh thu sản phẩm + Duyệt đăng + Gửi email thơng báo tạo lịch trình chuyến + Tích hợp với mạng xã hội (Facebook, Google) + Liên kết ví điện tử (Paypal) + Tạo cơng cụ Crawl Data địa điểm, sản phẩm từ trang khác 4.4.2 Hạn chế đồ án - Giao diện chưa hồn thiện - Chưa tích hợp nhiều tiện ích cho website 4.4.3 Hướng phát triển - Điều chỉnh lại logic chương trình cho hợp lý - Ràng buộc liệu chặt chẽ - Website phát triển thêm nghiệp vụ như: + Tạo sưu tập địa điểm + Quản lý địa điểm + Tích hợp thêm dịch vụ thuê khách sạn, thuê xe du lịch, đặt vé máy bay, vé tàu, vé xe khách + Cho phép thành viên tham gia vào lịch trình tạo website Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 123 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm TÀI LIỆU THAM KHẢO Tiếng Việt [1] Viblo Asia (5-2017), https://viblo.asia/p/gioi-thieu-ve-reactjs-phan-i-cackhai-niem-co-ban-V3m5WzjblO7 [2] Freetuts (2-2016), https://freetuts.net/nodejs-la-gi-584.html [3] Viblo Asia (9-2018), https://viblo.asia/p/mongodb-la-gi-co-so-du-lieu-phiquan-he-bJzKmgoPl9N [4] TopDev, https://topdev.vn/blog/heroku-la-gi/ Tiếng Anh [5] Socket.IO, https://socket.io/docs/ [6] MongoDB, https://docs.mongodb.com/manual/reference/method/ [7] Heroku Dev Center, https://devcenter.heroku.com/articles/getting-startedwith-nodejs [8] MDB4, https://mdbootstrap.com/docs/react/ [9] NPM, https://www.npmjs.com/package/react-facebook-login [10] NPM, https://www.npmjs.com/package/react-google-login [11] Viblo Asia (6-2018), https://viblo.asia/p/reactjs-social-oauth-logingithub-and-facebook-voi-firebase-authentication-Qbq5Q1aX5D8 Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 124 Báo cáo khóa luận tốt nghiệp chuyên ngành Kỹ thuật phần mềm PHỤ LỤC Phạm Thanh Duy - 16043751 Trịnh Đức Duy - 16018731 125 ... chuyến du lịch Vì gây tâm lý hoang mang bỡ ngỡ cho chuyến du lịch Trước yêu cầu thực tế việc xây dựng website du lịch dịch vụ bán sản phẩm du lịch nhu cầu cần thiết khách du lịch Website du lịch dịch. .. Website du lịch dịch vụ bán sản phẩm du lịch khơng cịn mẻ cần thiết để cải thiện ngành du lịch ngày phát triển Nhờ vào hệ thống website khách du lịch tiếp cận thông tin địa điểm du lịch chuẩn bị vật... chuyến du lịch tốn đồ dùng thơng qua website Thơng qua website việc quản lý địa điểm sản phẩm dịch vụ dễ dàng quản lý Việc website cho phép thống kê địa điểm yêu thích nhất, sản phẩm dịch vụ bán