PHẦN MỞ ĐẦU 1. TÍNH CẤP THIẾT CỦA ĐỀ TÀI Trong thời đại công nghệ 4.0, internet kết nối vạn vật hiện đang là xu hướng toàn cầu, các thiết bị thông minh được kết nối vào internet và được điều khiển thông qua internet. Vào trước những năm 1997 nước ta chưa được kết nối internet, tri thức bị bó hẹp trong lãnh thổ Việt Nam. Ngày nay thì khác, với sự phát triển mạnh của internet nước ta đang chuyển mình mạnh mẻ phát triển tri thức con người, nền kinh tế, giáo dục và y tế, vì vậy chất lượng cuộc sống ngày càng cải thiện hơn.
Việc đời sống con người Việt Nam được nâng cao kéo theo những dịch vụ chăm sóc sức khoẻ phát triển mạnh. Trước đây, khi internet chưa phổ thông, việc tiềm kiếm một địa điểm chăm sóc thú cưng uy tín chất lượng rất khó khăn, họ phải xuống đường để tìm kiếm hỏi thăm, thậm chí người nuôi từ bỏ sở thích nuôi những chú thú cưng bởi vì quá khó để chăm sóc chúng. Vì thế WebSite tìm kiếm địa điểm thú y, cửa hàng dịch vụ chăm sóc thú cưng ra đời giúp người nuôi thú cưng lựa chọn địa điểm chăm sóc cho thú cưng một cách khách quan, phù hợp nhất. MỤC TIÊU CỦA ĐỀ TÀI Xây dựng website có các chức năng chính sau: - Website cho phép người dùng xem hoặc tìm kiếm địa điểm được đăng trên trang web.
- Website cho phép người dùng xem các bài viết về sức khoẻ, thú cưng. - Website cho phép người dùng đăng ký/đăng nhập. - Website cho phép người dùng sau khi đăng ký/đăng nhập có thể chỉnh sửa thông tin cá nhân. - Website cho phép người dùng đăng địa điểm thú y, cửa hàng chăm sóc của mình.
- Quy trình đăng địa điểm (lấy dữ liệu từ người dùng) chặt chẽ và đầy đủ thông tin cần thiết. - Cho phép người dùng sau khi đăng nhập có thể tương tác với bài viết (bình luận, đánh giá). - Cho phép quản trị viên xem các báo cáo thống kê về số lượng người dùng, các địa điểm, các bài viết được đăng. - Cho phép quản trị viên vô hiệu hoá tài khoản người dùng, các địa điểm ảo, các bài viết vi phạm.
KẾT CẤU CỦA ĐỀ TÀI Đề tài bao gồm 5 chương: - Chương 1: Khảo sát hiện trạng - Chương 2: Mô hình hóa yêu cầu và thiết kế CSDL - Chương 3: Thiết kế giao diện và xử lý - Chương 4: Lập trình - Chương 5: Kiểm thử phần mềm - Kết luận 20 do an PHẦN NỘI DUNG 1. CHƯƠNG 1: CƠ SỞ LÝ THUYẾT 1. Khái niệm ReactJS là một thư viện JavaScript mã nguồn mở được thiết kế bởi Facebook để tạo ra những ứng dụng web hấp dẫn, nhanh và hiệu quả với mã hóa tối thiểu. Mục đích cốt lõi của ReactJS không chỉ khiến cho trang web phải thật mượt mà còn phải nhanh, khả năng mở rộng cao và đơn giản.
Sức mạnh của nó xuất phát từ việc tập trung vào các thành phần riêng lẻ. Chính vì vậy, thay vì làm việc trên toàn bộ ứng dụng web, ReactJS cho phép một developer có thể phá vỡ giao diện người dùng phức tạp thành các thành phần đơn giản hơn. Các đặc trưng cơ bản JSX Trong React, thay vì thường xuyên sử dụng JavaScript để thiết kế bố cục trang web thì sẽ dùng JSX. JSX được đánh giá là sử dụng đơn giản hơn JavaScript và cho phép trích dẫn HTML cũng như việc sử dụng các cú pháp thẻ HTML để render các subcomponent.
JSX tối ưu hóa code khi biên soạn, vì vậy nó chạy nhanh hơn so với code JavaScript tương đương. Single-way data flow ReactJS không có những module chuyên dụng để xử lý data, vì vậy ReactJS chia nhỏ view thành các component nhỏ có mỗi quan hệ chặt chẽ với nhau. Tại sao chúng ta phải quan tâm tới cấu trúc và mối quan hệ giữa các component trong ReactJS? Câu trả lời chính là luồng truyền dữ liệu trong ReactJS: Luồng dữ liệu một chiều từ cha xuống con. Việc ReactJS sử dụng one-way data flow có thể gây ra một chút khó khăn cho những người muốn tìm hiểu và ứng dụng vào trong các dự án.
Tuy nhiên, cơ chế này sẽ phát huy được ưu điểm của mình khi cấu trúc cũng như chức năng của view trở nên phức tạp thì ReactJS sẽ phát huy được vai trò của mình 21 do an 1. NodeJS và ExpressJS 1.js là một JavaScript runtime được build dựa trên engine JavaScript V8 của Chrome.js sử dụng kiến trúc hướng sự kiện event-driven, mô hình non- blocking I/O làm cho nó nhẹ và hiệu quả hơn. Hệ thống nén của Node.js, npm, là hệ thống thư viện nguồn mở lớn nhất thế giới. ExpressJS ExpressJS là một web framework được xây dựng trên nền tảng NodeJs.
Expressjs cung cấp các hàm HTTP và midleware để tạo ra API đơn giản và dễ sử dụng. ExpressJS được phát hành theo giấy phép mã nguồn mở, có cộng đồng hỗ trợ lớn, được phép sử dụng cho ứng dụng có mục đích thương mại. Do vậy bạn hoàn toàn có thể yên tâm sử dụng framework này cho dự án của mình, từ dự án nhỏ tới lớn. Cấu trúc thư mục dự án khi sử dụng ExpressJS được chia là 3 phần: routes, Views và Public.
ExpressJS xây dựng ứng dụng web theo đúng mô hình MVC (Model – View – Controller). Một số chức năng chính của ExpressJS: - Hỗ trợ middleware để trả về các HTTP request - Định nghĩa route dựa trên các action của HTTP (CRUD) - Cho phép trả về các trang html sử dụng các template engine (jade, pug…) 1. MongoDB MongoDB 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ất nhanh.
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 22 do an 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ệu lưu trữ không cần tuân theo một cấu trúc nhất định. Thông tin liên quan được lưu trữ cùng nhau để truy cập truy vấn nhanh thông qua ngôn ngữ truy vấn MongoDB.
CHƯƠNG 2: KHẢO SÁT HIỆN TRẠNG 2. KHẢO SÁT MỘT SỐ TRANG WEB 2.vn/ (website tìm kiếm địa điểm ăn uống) • Ưu điểm: - Giao diện: + Phông chữ, nền, màu sắc hiện đại, hài hoà, tạo cảm giác thân thiện. - Chức năng: + Đáp ứng được nhu cầu tìm kiếm của người dùng + Thông tin rõ ràng + Tốc độ load trang nhanh • Nhược điểm: - Giao diện: + Bố cục hiển thị gợi ý ở trang chủ chưa hợp lý, gây rối - Chức năng: + Bộ lọc tìm kiếm chưa cụ thể, dẫn đến kết quả tìm kiếm ko sát với yêu cầu 24 do an 2.com/ (website tìm kiếm phòng trọ) • Ưu điểm: - Giao diện: + Đơn giản, dễ thao tác + Đi thẳng vào yêu cầu người dùng - Chức năng: + Đáp ứng đúng nhu cầu người dùng là tìm trọ, ko lan man + Chức năng tìm kiếm sâu và sát • Nhược điểm: - Giao diện: + Do quá đơn giản nên ko để lại ấn tượng + Cảm giác cũ kỹ - Chức năng: + Tương tác người dùng thấp + Đánh giá, xếp hạng chủ quan, ko có ý kiến người dùng. + Do chức năng tìm kiếm rộng nên xảy ra một số lỗi trong quá trình tìm kiếm 25 do an 2.com/ (website tìm kiếm địa điểm ăn uống) Ưu điểm: Giao diện: - + Đơn giản, thân thiện + Nội dung đa dạng, phong phú - Chức năng: + Đa dạng + Tương tác người dùng cao • Nhược điểm: - Giao diện: + Do thông tin nhiều dẫn đến bố cục gây rối cho người dùng - Chức năng: + Tốc độ load trang chậm + Một số chức năng không còn hoạt động 2.
KẾT LUẬN VỀ NHỮNG TIÊU CHÍ WEBSITE CẦN ĐẠT ĐƯỢC Từ những khảo sát trên, nhóm đưa ra nhận định chung: Để có một website tìm kiếm địa điểm tốt cần phải đạt được những yếu tố sau: • Về giao diện: - Mới mẻ, trực quan, bắt mắt, dễ sử dụng - Hình ảnh sinh động, nội dung hiển thị vừa đủ, không quá ôm đồm • Về chức năng: 26 do an - Tốc độ tải trang nhanh, tạo cảm giác thoải mái cho người dùng - Có mục đánh giá, tương tác người dùng để thuận tiện cho khách hàng sau có thêm thông tin, cũng như cửa hàng, doanh nghiệp có số liệu thống kê để định hướng phát triển - Có đầy đủ chức năng cơ bản, độ chính xác cao - Tạo dựng niềm tin phải được ưu tiên, nội dung khách quan, thông tin đầy đủ, xác thực. Nhóm sẽ xây dựng website tìm kiếm địa điểm tốt, đạt được những yếu tố đã đưa ra từ việc khảo sát, cũng như khắc phục những nhược điểm của các trang web đã khảo sát. CHƯƠNG 3: MÔ HÌNH HÓA YẾU CẦU VÀ THIẾT KẾ CƠ SỞ DỮ LIỆU 3. USECASE DIAGRAM Hình 2.2 CHI TIẾT CÁC ACTOR 3.1 Các nghiệp vụ 28 do an STT Tên nghiệp vụ Loại nghiệp vụ Qui định Biểu mẫu Ghi chú 1 Đăng ký Lưu trữ QĐ_ĐK BM_ĐK 2 Đăng nhập Tra cứu QĐ_ĐN BM_ĐN 3 Quên mật khẩu Tra cứu QĐ_QMK BM_QMK 4 Xem trang chủ Tra cứu QĐ_XTC BM_XTC 5 Tìm kiếm địa điểm Tra cứu QĐ_TK BM_TK 6 Xem bài viết Tra cứu QĐ_XBV 7 Xem bình luận Tra cứu QĐ_XBL Bảng 2.
1 Nghiệp vụ Guest 29 do an 3.2 Các quy định 1 QĐ_ĐK Đăng ký 1. Use case cho phép guest đăng ký tạo 1 tài khoản để lưu trữ thông tin cá nhân. Điều kiện kích hoạt: người dùng click vào nút đăng nhập trên trang web, sau đó chọn đăng ký. Luồng sự kiện chính: 3.
Người dùng phải nhập đủ thông tin cần thiết: Tên tài khoản, mật khẩu, tên, email, sđt. Tên tài khoản có các kí tự cho phép: chữ in hoa (A-Z), chữ thường (a-z), chữ số (0-9), dấu gạch dưới, dấu gạch ngang, dâu chấm, không được bắt đầu bằng chữ số 0, độ dài từ (6-16) kí tự 3. Mật khẩu: Không được giống với tên tài khoản, các kí tự cho phép: chữ in hoa (A-Z), chữ thường (a-z), chữ số (0-9), độ dài từ (6-16) ký tự, không được bắt đầu bằng chữ số 0. Hệ thống kiểm tra thông tin đăng ký có hợp lệ.4 Nếu thành công hệ thống hiển thị thông báo.
Kết thúc use case 4. Luồng sự kiện phụ: 4. Tài khoản hoặc mật khẩu nhập không hợp lệ: 4. Hiển thị thông báo thông tin đăng ký không đúng 4.