(Đồ án hcmute) phát triển website tìm kiếm cửa hàng hóa sản phẩm sử dụng công nghệ mern stack và google maps api

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH ĐỒ ÁN TỐT NGHIỆP NGÀNH CÔNG NGHỆ THÔNG TIN PHÁT TRIỂN WEBSITE TÌM KIẾM CỬA HÀNG HĨA SẢN PHẨM SỬ DỤNG CƠNG NGHỆ MERN STACKVÀ GOOGLE MAPS API GVHD: LÊ VĂN VINH SVTH: PHẠM THẾ HỮU MSSV:15110225 SVTH: NGUYỄN CẢNH TOÀN MSSV: 15110335 SKL 0 Tp Hồ Chí Minh, 2019 an TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM KHOA CÔNG NGHỆ THÔNG TIN BỘ MÔN CÔNG NGHỆ PHẦN MỀM ~~~o0o~~~ PHẠM THẾ HỮU - 15110225 NGUYỄN CẢNH TOÀN – 15110335 Đề Tài: PHÁT TRIỂN WEBSITE TÌM KIẾM CỬA HÀNG HĨA SẢN PHẨM SỬ DỤNG CƠNG NGHỆ MERN STACK VÀ GOOGLE MAPS API KHÓA LUẬN TỐT NGHIỆP GIÁO VIÊN HƯỚNG DẪN TS LÊ VĂN VINH KHÓA 2015-2019 an ĐH SƯ PHẠM KỸ THUẬT TP.HCM KHOA CNTT ***** XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập - Tự - Hạnh phúc ***** PHIẾU NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN Họ tên sinh viên 1: PHẠM THẾ HỮU MSSV: 15110225 Họ tên sinh viên 2: NGUYỄN CẢNH TỒN MSSV: 15110335 Chun ngành: SƯ PHẠM CƠNG NGHỆ THƠNG TIN Tên đề tài: Phát triển website tìm kiếm cửa hàng hóa sản phẩm sử dụng cơng nghệ MERN STACK GOOGLE MAPS API Họ tên GVHD: TS LÊ VĂN VINH NHẬN XÉT: Về nội dung đề tài khối lượng công việc thực hiện: Ưu điểm Khuyết điểm Đề nghị cho bảo vệ hay không? …………………… Đánh giá xếp loại: …………………… Điểm: …………………… TP Hồ Chí Minh, ngày …… tháng …… năm 2019 Giáo viên hướng dẫn (Ký & ghi rõ họ tên) an ĐH SƯ PHẠM KỸ THUẬT TP.HCM KHOA CNTT ***** XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập - Tự - Hạnh phúc ***** PHIẾU NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN Họ tên sinh viên 1: PHẠM THẾ HỮU MSSV: 15110225 Họ tên sinh viên 2: NGUYỄN CẢNH TOÀN MSSV: 15110335 Chuyên ngành: SƯ PHẠM CÔNG NGHỆ THÔNG TIN Tên đề tài: Phát triển website tìm kiếm cửa hàng hóa sản phẩm sử dụng cơng nghệ MERN STACK GOOGLE MAPS API Họ tên GVPB: TS LÊ VĨNH THỊNH NHẬN XÉT: Về nội dung đề tài khối lượng công việc thực hiện: Ưu điểm Khuyết điểm Đề nghị cho bảo vệ hay không? …………………… Đánh giá xếp loại: …………………… Điểm: …………………… TP Hồ Chí Minh, ngày …… tháng …… năm 2019 Giáo viên phản biện (Ký & ghi rõ họ tên) an LỜI CẢM ƠN Nhóm em xin chân thành cảm ơn khoa CÔNG NGHỆ THÔNG TIN, BỘ MÔN CÔNG NGHỆ PHẦN MỀM, TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT TP.HCM tạo điều kiện thuận lợi cho chúng em thực đề tài Chúng em xin gửi lời cảm ơn chân thành đến thầy TS LÊ VĂN VINH, người tận tình bảo hướng dẫn nhóm em thực đề tài Bên cạnh đó, chúng em xin gửi lời cảm ơn đến thầy cô giảng viên trường Đại Học Sư Phạm Kỹ Thuật Tp.HCM nói chung thầy cô giảng viên khoa Công Nghệ Thông Tin nói riêng, người giảng dạy, tạo điều kiện cho em tích lũy kiến thức quý báu năm học qua Chúng em nỗ lực nhiều để hoàn thành tốt nhiệm vụ đề tài, khả hạn chế nên chắn khơng tránh khỏi thiếu sót Chúng em mong nhận tận tình bảo thầy để ngày tiến TP Hồ Chí Minh, ngày …… tháng …… năm 2019 Nhóm sinh viên thực hiện: PHẠM THẾ HỮU - 15110225 NGUYỄN CẢNH TOÀN - 15110225 an ĐH SƯ PHẠM KỸ THUẬT TP.HCM XÃ HỘI CHỦ NGHĨA VIỆT NAM KHOA CNTT Độc lập - Tự - Hạnh phúc ***** ***** ĐỀ CƯƠNG CHI TIẾT KHÓA LUẬN TỐT NGHIỆP Họ tên sinh viên 1: PHẠM THẾ HỮU MSSV: 15110225 Họ tên sinh viên 2: NGUYỄN CẢNH TỒN MSSV: 15110335 Chun ngành: SƯ PHẠM CƠNG NGHỆ THƠNG TIN Tên đề tài: Phát triển website tìm kiếm cửa hàng hóa sản phẩm sử dụng cơng nghệ MERN STACK GOOGLE MAPS API Họ tên GVHD: TS LÊ VĂN VINH Thởi gian thực hiện: từ 01/09/2019 – 31/12/2019 NHIỆM VỤ CỦA KHĨA LUẬN:  Tìm hiểu MERN STACK GOOGLE MAPS API phát triển website Tìm kiếm cửa hàng hóa sản phẩm  Khảo sát trạng, đánh giá website tìm kiếm cửa hàng xung quanh có  Phân tích nghiệp vụ website tìm kiếm cửa hàng có  Mơ hình hóa nghiệp vụ, xây dựng sở liệu  Cài đặt chức năng, kiểm thử toàn hệ thống ĐỀ CƯƠNG VIẾT KHÓA LUẬN: PHẦN 1: PHẦN MỞ ĐẦU 1.1 Tính cấp thiết đề tài 1.2 Mục tiêu đề tài 1.3 Cách tiếp cận phương pháp nghiên cứu 1.3.1 Đối tượng nghiên cứu 1.3.2 Phạm vi nghiên cứu 1.4 Kết dự kiến đạt an PHẦN 2: PHẦN NỘI DUNG 2.1 CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 2.1.1 Tìm hiểu MERN STACK 2.1.1.1 Tìm hiểu Javascript 2.1.1.2 Tìm hiểu Nodejs 2.1.1.3 Tìm hiểu Express Framework nodejs 2.1.1.4 Tìm hiểu Mongodb 2.1.1.5 Tìm hiểu Reactjs 2.1.2 Ứng dụng MERN Stack phát triển website 2.1.2.1 Giới thiệu công nghệ Stack 2.1.2.2 Giới thiệu MERN Stack 2.1.2.3 Nhưng điểm bật MERN Stack 2.1.3 Tìm hiểu Google Maps Api 2.1.3.1 Giới thiệu Google Maps Api 2.1.3.2 Một số ứng dụng Google Maps Api 2.1.4 Tìm hiểu mơ hình MVC xây dựng website 2.1.4.1 Tìm hiểu mơ hình MVC 2.1.4.2 Chi tiết lớp mơ hình MVC 2.1.4.3 Ưu - nhược điểm mơ hình MVC 2.2 CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG VÀ XÁC ĐỊNH YÊU CẦU 2.2.1 Khảo sát trạng 2.2.2 Xác định yêu cầu 2.2.2.1 Yêu cầu chức 2.2.2.2 u cầu phi chức 2.2.3 Mơ hình hóa yêu cầu 2.2.3.1 Lược đồ use case 2.2.3.2 Đặc tả use case 2.3 CHƯƠNG 3: THIẾT KẾ PHẦN MỀM 2.3.1 Thiết kế hệ thống 2.3.1.1 Lược đồ lớp 2.3.1.2 Lược đồ 2.3.2 Thiết kế sở liệu an 2.3.2.1 Cấu trúc liệu 2.3.2.2 Các ràng buộc toàn vẹn 2.3.2.3 Lược đồ thực thể liên kết 2.3.2.4 Mô tả chi tiết bảng liệu 2.3.3 Thiết kế giao diện 2.4 Chương 4: cài đặt kiểm thử 2.4.1 Cài đặt 2.4.1.1 Thiết lập môi trường 2.4.1.2 Xây dựng cấu trúc project 2.4.2 Kiểm thử PHẦN 3: PHẦN KẾT LUẬN 3.1 Kết đạt 3.2 Ưu điểm 3.3 Nhược điểm 3.4 Hướng phát triển tương lai TÀI LIỆU THAM KHẢO KẾ HOẠCH THỰC HIỆN: STT THỜI GIAN CÔNG VIỆC GHI CHÚ Đã hoàn tất đăng ký với GVHD Được thầy hướng dẫn định Đăng ký đề tài 02/09 - 08/09 Khảo sát trạng xác định yêu cầu hướng chức cần phát triển, lựa chọn mặt công nghệ để thực Đã kháo sát trang web tìm kiếm sản phẩm Đã xác định yêu cầu website tìm an kiếm cửa hàng hóa sản phẩm Hồn Xây dựng Use case Diagram 09/09 – 15/09 Xây dựng Sequence thành Use case Diagram ban đầu Hoàn thành Sequence Diagram ban đầu Diagram Thiết kế sở liệu Hoàn thành thiết kế sở liệu ban đầu Chỉnh sửa hoàn thiện Use Đã hoàn thiện Use case case Diagram Diagram Viết đặc tả Use case 16/09 – 29/09 Chỉnh sửa hoàn Đã hoàn thiện đặc tả Usecase thiện Sequence Diagram Chỉnh sửa hoàn thiện Cơ sở liệu Diagram Đã hoàn thiện Sequence Diagram Đã hoàn thiện sở liệu Đã hoàn thành thiết kế giao 30/09 – 13/10 Thiết kế giao diện Thiết kế lược đồ lớp diện Đã hoàn thành thiết kế lược đồ lớp 14/10 – 27/10 28/10 – 10/11 11/11 – 24/11 25/11 – 08/12 Xây dựng chức Đã hoàn thành chức người dùng GUEST người dùng GUEST Xây dựng chức Đã hoàn thành chức người dùng USER người dùng USER Xây dựng chức Đã hoàn thành chức người dùng ADMIN Hoàn thành chức Use case Diagram an người dùng ADMIN Đã hoàn thành chức Diagram Use case 09/12 – 22/12 Viết báo cáo, làm slide thuyết trình Đã hồn thành báo cáo slide thuyết trình TP Hồ Chí Minh, ngày …… tháng …… năm 2019 Ý kiến GVHD Người viết đề cương (Ký ghi rõ họ tên) (Ký ghi rõ họ tên) an KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN Select Tùy chọn thời gian TextBox Thơng tin gói dịch vụ thành tiền Card Thơng tin xác nhận gói dịch vụ Table Thơng tin chi tiết gói dịch vụ Button Xác nhận tốn Bảng 45-Bảng mơ tả chi tiết đối tượng giao diện trang mua gói cửa hang 3.10 Giao diện trang đổi mật Hình 37-Hình ảnh trang giao diện đổi email LOẠI STT MÔ TẢ Image Logo website Menu Menu tùy chọn Card Form nhập thông tin Text Tiêu đề đổi email TextBox Nhập email TextBox Nhập email TextBox Nhập mật Button Nhấn xác nhận đổi email Bảng 46-Bảng mô tả chi tiết đối tượng giao diện trang đổi email 86 an KHĨA LUẬN TỐT NGHIỆP – CƠNG NGHỆ THƠNG TIN 3.11 Giao diện trang đổi emai Hình 38-Hình ảnh trang giao diện đổi số điện thoại LOẠI STT MÔ TẢ Card Form nhập thông tin Text Tiêu đề đổi số điện thoại TextBox Nhập số điện thoại TextBox Nhập số điện thoại TextBox Nhập lại mật Button Xác nhận đổi số điện thoại Bảng 47-Bảng mô tả chi tiết đối tượng giao diện trang đổi số điện thoại 87 an KHĨA LUẬN TỐT NGHIỆP – CƠNG NGHỆ THÔNG TIN 3.12 Giao diện trang đổi số điện thoại Hình 39-Hình ảnh trang giao diện đổi mật LOẠI STT MƠ TẢ Card Form nhập thơng tin Text Tiêu đề đổi mật TextBox Nhập mật TextBox Nhập mật TextBox Xác nhận mật Button Xác nhận đổi số điện thoại Bảng 48-Bảng mô tả chi tiết đối tượng giao diện trang đổi mật 88 an KHĨA LUẬN TỐT NGHIỆP – CƠNG NGHỆ THÔNG TIN CHƯƠNG 4: CÀI ĐẶT VÀ KIỂM THỬ CÀI ĐẶT 1.1 Thiết lập môi trường  Sử dụng công nghệ NodeJS phiên 12.13.0  MongoDB 4.0.12  Trình duyệt Chrome phiên 79.0.3945.88 (Official Build) (64-bit) 1.2 Xây dựng cấu trúc project Project gồm phần (Server Client) phần phụ (Config) 1.2.1 Server  Thư mục quan trọng nhằm tạo server Node.js app.js, bao gồm nhiều thư mục con: api, dao, models, public, routes, util, views test 89 an KHĨA LUẬN TỐT NGHIỆP – CƠNG NGHỆ THƠNG TIN o api: chứa Restful APIs o dao: chứa phương thức thao tác với sở liệu o models: chứa schema tương ứng với collections sở liệu o public: chức thư viện hỗ trợ hiển thị phía client o routes: chứa middleware để render giao diện Server side o util: bao gồm tiện ích giúp xử lý số tác vụ nhanh hơn: gửi mail, định dạng lại kiểu chuỗi, ngày tháng o views: chứa tệp giao diện hiển thị theo hướng Server side o test: thư mục chứa middleware dùng để kiểm tra lại chức năng, Restful APIs  Bên cạnh node_modules chứa module package để thực tác vụ Server Thư mục to hay nhỏ phụ thuộc vào lượng module/package cài đặt  Ngoài cịn có package.json: cấu hình mục cần thiết tên phiên dự án, công nghệ sử dụng, scripts, … Các package phiên sử dụng hiển thị 1.2.2 Client  Thư mục quan trọng nhằm xây dựng components (React.js) hiển thị phía client  Bên Client chứa node_modules package.json 1.2.3 Config  Định nghĩa đoạn chuỗi sử dụng nhiều lần muốn bảo mật trình sử dụng sang kiểu json  Chứa default.json chứa định nghĩa domain, mongodb uri mail 90 an KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN KIỂM THỬ MƠ TẢ STT TEST QUY TRÌNH CASE KẾT QUẢ MONG ĐỢI CHROME 79.0.3945.88 (64BIT) Nhấp vào logo user Ứng dụng giữ để hiển thị khung trang tại, đăng ký/đăng nhập đồng thời logo user Nhấp chọn nút Đăng đổi thành avatar Kiểm thử chức đăng nhập người dùng nhập Pass Nhập Email Mật Gõ phím Enter nhấp vào nút Đăng nhập Nhấp vào logo user Ứng dụng giữ Kiểm thử chức đăng nhập nhanh Google, Facebook để hiển thị khung trang tại, đăng ký/đăng nhập đồng thời logo user Nhấp vào nút Đăng đổi thành avatar người dùng nhập Pass Nhấp vào nút Google (avatar lấy từ Facebook tài khoản Xác nhận bước Google cần thiết Facebook) Nhấp vào logo user Ứng dụng giữ để hiển thị khung trang tại, Kiểm thử chức đăng ký đăng ký/đăng nhập đồng thời đẩy câu Nhấp vào nút Đăng thông báo đăng ký ký Pass thành cơng Ngồi Nhập đầy đủ thơng ra, gửi mail tin xác thực tài khoản 91 an KHĨA LUẬN TỐT NGHIỆP – CƠNG NGHỆ THƠNG TIN Nhấp vào nút Đăng đến email vừa sử dụng để đăng ký ký Nhấp vào avatar để Ứng dụng giữ Kiểm thử hiển thị khung thông trang tại, chức tin đăng xuất đồng thời đổi Pass Nhấp vào nút Đăng avatar thành logo user xuất Ở giao diện xem Ứng dụng giữ thông tin tài khoản, trang tại, Kiểm thử nhập lại trường Đồng chức thông tin muốn thay thông tin thay cập nhật đổi thông tin thời đổi Pass Nhấp chọn nút Cập cập nhật lại giao nhật diện xem thông tin tài khoản Nhấp vào giao diện Ứng dụng giữ Kiểm thử xem thông tin tài trang tại, tải chức khoản lại avatar vừa cập cập nhật Chọn hình ảnh avatar Nhấp vào nút Cập nhật thành công Pass nhật Nhập tên sản phẩm Hiển thị danh sách Kiểm thử chức muốn tìm kiếm kết gồm Gõ phím Enter thơng tin bản, tìm kiếm nhấp vào icon kính đồng thời, hiển thị cửa hàng hiển vi (có thể chọn marker thơng qua bán kính muốn đồ ứng với sản phẩm tìm khu vực cửa hàng tìm mong muốn) Pass thấy 92 an KHĨA LUẬN TỐT NGHIỆP – CƠNG NGHỆ THƠNG TIN Kiểm thử Nhấp vào icon định Hiển thị marker chức vị nhập địa vị trí mà người định vị điểm tìm kiếm vị dùng định vị Gõ phím Enter nhập trí Pass khu vực muốn tìm kiếm Nhấp vào logo user Gửi Token đến để hiển thị khung Email nhập đăng ký/đăng nhập cập lại nhật lại Nhấp chọn nút Đăng mật sở liệu nhập Nhập liên kết Giữ giao diện Quên mật Kiểm thử chức lấy lại mật (quên mật khẩu) tại, đẩy Nhập Email ứng với thông báo cập nhật tài khoản quên lại mật thành mật Pass công Nhấp vào nút Xác nhận Kiểm tra email để lấy Token nhập mật vào Nhấp vào nút Cập nhật Kiểm thử 10 Nhấp vào liên kết Cập nhật lại mật chức Đổi mật giao ứng với tài đổi mật diện xem thông tin khoản tài khoản Pass 93 an KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN Nhập vào mật cũ mật với xác nhận mật Nhấp vào nút Xác nhận Kiểm thử 11 chức hiển thị thị khung thông tin chi tiết xem chi tiết sản phẩm sản phẩm giao diện Kiểm thử 12 Nhấp vào kết Hiển Pass Ở giao diện thông tin Mở tab chức chi tiết sản phẩm, hiển thị thông xem thông nhấp vào tên cửa tin cửa hàng tin cửa hàng nút Xem hàng shop Pass Ở giao diện chi tiết Thông tin chi tiết Kiểm thử 13 chức đánh giá sản phẩm sản phẩm, nhập đánh giá cập thông tin đánh giá nhật vào mục nội sản phẩm vào form dung đánh giá Pass nhấp chọn số đánh giá sản phẩm Nhấn nút xác nhận Ở giao diện chức Hiện thông báo tạo quản lý cửa cửa 14 hàng thành Kiểm thử hàng, nhấn button công, trở lại trang chức “Thêm cửa hàng” tạo cửa hàng Nhấn tick chọn mục quản lý cửa hàng Pass chưa có cửa hàng Nhấp chuột mẫu template cửa hàng 94 an KHĨA LUẬN TỐT NGHIỆP – CƠNG NGHỆ THƠNG TIN Nhập thông tin chi tiết cửa hàng vào form Nhấn nút xác nhận Ở giao diện quản lý Hệ thống thông Kiểm thử chức 15 thêm sản phẩm vào cửa hàng sản phẩm, chọn cửa báo thêm sản phẩm hàng muốn thêm sản thành công Quay phẩm lại giao diện quản Nhập thông tin sản lý sản phẩm Pass phẩm vào form Nhấn nút “Thêm sản phẩm” Ở giao diện quản lý Hệ thống thông sản phẩm Click báo cập nhật sản chọn sản phẩm muốn phẩm thành công Kiểm thử 16 chức cập nhật, chọn mục Quay lại trang Cập nhật thông tin quản lý sản phẩm cập nhật sản phẩm sản phẩm mục phép thay Pass đổi Nhấn nút xác nhận thay đổi Ở giao diện quản lý Hệ thống thông cửa hàng Nhấn chọn báo cập nhật cửa 17 Kiểm thử cửa hàng muốn cập hàng thành công chức nhật thông tin cập nhật Quay lại trang Cập nhật thông tin quản lý cửa hàng thông tin cửa hàng form cửa hàng mục Pass phép thay đổi Nhấn nút xác nhận 95 an KHÓA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN Nhấp vào liên kết Hiển thị thông Thống kê giao diện tin liên quan đến xem thông tin tài cửa hàng số Kiểm thử 18 lượng cửa hàng, khoản chức lượt xem, số lượng thống kê sản phẩm, đánh Pass giá, thống kê theo mốc thời gian, … 96 an KHĨA LUẬN TỐT NGHIỆP – CƠNG NGHỆ THÔNG TIN PHẦN 3: PHẦN KẾT LUẬN KẾT QUẢ ĐẠT ĐƯỢC Nghiên cứu thành phần công nghệ MERN Stack như: MongoDB, ExpressJS framework, ReactJS library NodeJS platform Tìm hiểu chức Google Maps API định vị, tìm kiếm vị trí, đường, hiển thị marker đánh dấu vị trí cửa hàng Sử dụng công nghệ MERN Stack kết hợp với Google Maps API để xây dựng ứng dụng web tìm kiếm cửa hàng hóa sản phẩm với chức năng:  Đăng ký/Đăng nhập/Đăng xuất  Đăng nhập nhanh Google/Facebook  Quản lý tài khoản (Xem/Cập nhật thông tin, đổi mật khẩu, lấy lại mật khẩu)  Tìm kiếm cửa hàng có sẵn sản phẩm  Định vị chọn vị trí khu vực muốn tìm kiếm sản phẩm  Xem chi tiết thông tin sản phẩm/ cửa hàng  Đánh giá sản phẩm  Quản lý cửa hàng/ sản phẩm  Thống kế ƯU ĐIỂM  Thực chức trang web tìm kiếm sản phẩm cho khách hàng, giúp khác hàng dễ dàng tìm cửa hàng có sẵn sản phẩm mà cần  Giúp cửa hàng nhỏ lẻ có tảng để lưu trữ thơng tin quảng bá sản phẩm Các thơng tin bao gồm: thơng tin sản phẩm, thông tin lượt quan tâm khách hàng dành cho sản phẩm, số điểm đánh giá sản phẩm 97 an KHĨA LUẬN TỐT NGHIỆP – CÔNG NGHỆ THÔNG TIN  Dữ liệu mật tài khoản đăng nhập vào hệ thống lưu trữ sở liệu cách an tồn nhờ thực thơng qua giải thuật mã hóa md5  Người dùng dễ dàng đăng nhập nhanh thông qua Google Facebook  Hỗ trợ hiển thị đồ giúp người dùng có trải nghiệm tốt vị trí cửa hàng  Giao diện quản lý, thống kê của người dùng admin dễ sử dụng cho tất người  Hỗ trợ hiển thị giao diện tảng mobile  Hỗ trợ lưu lại sản phẩm người dùng xem gần NHƯỢC ĐIỂM  Chưa hỗ trợ chức trò chuyện trực tuyến chủ cửa hàng khách hàng chủ cửa hàng người quản trị  Các thuật tốn tìm kiếm sản phẩm định vị theo vị trí người dùng chưa thật tối ưu, cần cải thiện để tăng tốc độ tìm kiếm HƯỚNG PHÁT TRIỂN TRONG TƯƠNG LAI  Vì tính chất trang web tìm kiếm nên nhóm chúng em cố gắng tìm hiểu sử dụng cơng nghệ tìm kiếm nhanh có thể, đồng thời sử dụng Cơ sở liệu phân tán để giúp rút ngắn thời gian tìm kiếm  Khắc phục nhược điểm tồn động tại, lắng nghe ý kiến khách hàng đưa cải tiếng, giúp người dùng có trải nghiệm tuyệt vời tương lai 98 an KHĨA LUẬN TỐT NGHIỆP – CƠNG NGHỆ THƠNG TIN TÀI LIỆU THAM KHẢO [1] - Tìm hiểu Javascript: https://developer.mozilla.org/vi/docs/Web/JavaScript/Guide/Gioi-thieu [2] – Tìm hiểu NodeJS: https://viblo.asia/p/tim-hieu-ve-node-js-co-ban-ojaqG0dGEKwZ [3] – Những kết luận sai lầm Các công ty lớn sử dụng NodeJS: https://techtalk.vn/mot-cai-nhin-tong-quan-nhat-ve-nodejs.html [4] – Tìm hiểu ExpressJS: https://techblog.vn/phan-1-tim-hieu-express-js-framework [5] – Tìm hiểu MongoDB: https://viblo.asia/p/tim-hieu-ve-mongodb-4P856ajGlY3 [6] – Tìm hiểu ReactJS: https://viblo.asia/p/buoc-dau-tim-hieu-ve-reactjs-1VgZvwWYlAw [7] – Giới thiệu MERN Stack: https://niviki.com/gioi-thieu-mern-stack [8] – Có MERN Stack: https://techblog.vn/gioi-thieu-mern-stack [9] – Tìm hiểu Google Maps API: https://viblo.asia/p/tim-hieu-ve-google-map-api-ZWApGxJ3R06y [10] – Tìm hiểu mơ hình MVC: https://itphutran.com/mo-hinh-mvc-trong-java-web-jspservlet-la-gi 99 an S an K L 0 ... MERN STACK GOOGLE MAPS API phát triển website Tìm kiếm cửa hàng hóa sản phẩm  Khảo sát trạng, đánh giá website tìm kiếm cửa hàng xung quanh có  Phân tích nghiệp vụ website tìm kiếm cửa hàng. .. vị, tìm kiếm vị trí, đường, hiển thị marker đánh dấu vị trí cửa hàng  Sử dụng công nghệ MERN Stack kết hợp với Google Maps API để xây dựng ứng dụng web tìm kiếm cửa hàng hóa sản phẩm (các cửa hàng. .. tìm kiếm sản phẩm, xem chi tiết sản phẩm, xem thông tin cửa hàng, đánh giá sản phẩm, tạo cửa hàng, thêm sản phẩm vào cừa hàng, cập nhật sản phẩm, quản lý cửa hàng, nhắn tin Admin Chủ cửa hàng,