Đồ án Xây dựng trang Web cho Hợp tác xã Nông nghiệp và Du lịch cộng đồng Cổ Loa

MỤC LỤC LỜI MỞ ĐẦU1 GIỚI THIỆU Mục tiêu đề tài 2 Giải pháp cách thực đề tài Giới thiệu Hợp tác xã nông nghiệp du lịch cộng đồng Cổ Loa Ý nghĩa CHƯƠNG 1: TỔNG QUAN 1.1 Tổng quan World Wide Web 4 1.1.1 Khái niệm 1.1.2 Cách tạo trang web 1.1.3 Trình duyệt web (web Client hay web Browser) 1.1.4 Web Server 1.2 Tổng quan HTML – CSS 1.2.1 Giới thiệu HTML 1.2.2 Giới thiệu CSS 1.3 Ngôn ngữ PHP 1.3.1 Định nghĩa PHP 9 1.3.2 Lý nên dùng PHP 10 1.3.3 Hoạt động PHP 10 1.3.4 Tổng quan PHP 11 1.3.5 Hàm PHP 12 1.3.6 Session Cookie 13 1.3.7 Mơ hình MVC 15 1.4 Cơng cụ sử dụng 16 1.4.1 Hệ quản trị sở liệu MySQL 16 1.5.2 Ứng dụng Xampp 18 CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ HỆ THỐNG 19 2.1 Khảo sát đặc tả yêu cầu 19 2.2 Phân tích thiết kế hướng đối tượng UML 19 2.2.1 Khái niệm phân tích thiết kế hướng đối tượng 19 2.2.2 Khái niệm UML 19 2.2.3 Phát biểu toán 22 2.2.4 Back-end 23 2.2.5 Front-end 24 2.3 Các yêu cầu phi chức 25 2.4 Phân tích thiết kế hệ thống 25 2.5 Biểu đồ use case 27 2.5.1 Biểu đồ Use – case tổng quát 27 2.5.2 Use case đăng nhập 28 2.5.3 Use case quản lý danh mục 29 2.5.4 Use case quản lý quản trị viên 32 2.5.5 Use case quản lý viết 35 2.5.6 Use case quản lý liên hệ 38 2.5.7 Use case quản lý giới thiệu 40 2.5.8 Use case quản lý ảnh/video 43 2.5.9 User case Backup/Restore Database 46 2.6 Biểu đồ 49 2.6.1 Biểu đồ chức đăng nhập 49 2.6.2 Biểu đồ quản lý giới thiệu 50 2.6.3 Biểu đồ quản lý danh mục 51 2.6.4 Biểu đồ quản lý viết 52 2.6.5 Biểu đồ quản lý quản trị viên 53 2.6.6 Biểu đồ quản lý ảnh/video 54 2.6.7 Biểu đồ quản lý liên hệ 55 2.5.8 Biểu đồ Backup/Restore Database 55 2.7 Biểu đồ hoạt động 2.7.1 Biểu đồ hoạt động chức thêm danh mục 56 56 2.7.2 Biểu đồ hoạt động chức sửa danh mục 57 2.7.3 Biểu đồ hoạt động chức xóa danh mục 57 2.7.4 Biểu đồ hoạt động chức thêm viết 58 2.7.5 Biểu đồ hoạt động chức sửa viết 58 2.7.6 Biểu đồ hoạt động chức xóa viết 59 2.7.7 Biểu đồ hoạt động chức thêm quản trị viên 59 2.7.8 Biểu đồ hoạt động chức sửa quản trị viên 60 2.7.9 Biểu đồ hoạt động chức xóa quản trị viên 60 2.7.10 Biểu đồ hoạt động chức thêm giới thiệu 61 2.7.11 Biểu đồ hoạt động chức sửa giới thiệu 62 2.7.12 Biểu đồ hoạt động chức xóa giới thiệu 63 2.7.13 Biểu đồ hoạt động chức thêm ảnh/video 64 2.7.14 Biểu đồ hoạt động chức sửa ảnh/video 65 2.7.15 Biểu đồ hoạt động chức xóa ảnh/video 65 2.7.16 Biểu đồ hoạt động chức Backup Database 66 2.7.17 Biểu đồ hoạt động chức Restore Database 67 2.7.18 Biểu đồ hoạt động chức xóa liên hệ 68 2.8 Biểu đồ lớp 69 2.8.1 Danh sách đối tượng 69 2.8.2 Mơ hình hóa lớp đối tượng 70 2.9 Thiết kế sở liệu 70 2.9.1 Danh sách bảng 70 2.9.2 Bảng Categories 71 2.9.3 Bảng Contacts 71 2.9.4 Bảng Admins 72 2.9.5 Bảng Introduction 72 2.9.6 Bảng News 73 2.9.7.Bảng Image_video 73 CHƯƠNG 3: DEMO WEBSITE 75 3.1 Demo Back-end 75 3.1.1 Giao diện trang chủ đăng nhập 75 3.1.2 Giao diện quản trị viên 76 3.1.3 Giao diện quản lý danh mục 77 3.1.4 Giao diện quản lý người viết 79 3.1.5 Giao diện quản lý liên hệ 81 3.2 Demo Front-end 82 3.2.1 Giao diện trang chủ 82 3.2.2 Giao diện chi tiết viết 83 3.2.3 Giao diện trang liên hệ 85 3.2.4 Giao diện website di động 86 KẾT LUẬN 87 TÀI LIỆU THAM KHẢO 88 BẢNG CÁC KÝ HIỆU, CHỮ VIẾT TẮT STT Từ viết tắt Tên đầy đủ RDBMS CSS Cascading Style Sheet CSDL Cơ sở liệu HTML PHP SEO Relational Database Management System Hypertext Markup Language Hypertext Preprocessor Search Engine Optimization Giải thích Hệ quản trị sở liệu quan hệ Ngôn ngữ kịch quy định cách trình bày thẻ HTML Ngơn ngữ đánh dấu siêu văn Ngơn ngữ lập trình PHP Tối ưu hố cơng cụ tìm kiếm DANH MỤC BẢNG Bảng 2.1: Các yêu cầu phi chức ứng dụng Bảng 2.2: Kịch chức đăng nhập Bảng 2.3: Kịch chức quản lý danh mục Bảng 2.4: Kịch chức thêm danh mục Bảng 2.5: Kịch chức sửa danh mục Bảng 2.6: Kịch chức xóa danh mục Bảng 2.7: Kịch chức quản lý quản trị viên Bảng 2.8: Kịch chức thêm quản trị viên Bảng 2.9: Kịch chức sửa quản trị viên Bảng 2.10: Kịch chức xóa quản trị viên Bảng 2.11: Kịch chức quản lý viết Bảng 2.12: Kịch chức thêm viết Bảng 2.13: Kịch chức sửa viết Bảng 2.14: Kịch chức xóa viết Bảng 2.15: Kịch chức xem chi tiết viết Bảng 2.16: Kịch quản lý liên hệ Bảng 2.17: Kịch xóa liên hệ Bảng 2.18: Kịch chức quản lý giới thiệu Bảng 2.19: Kịch chức thêm giới thiệu Bảng 2.20: Kịch chức sửa giới thiệu Bảng 2.21: Kịch chức xóa giới thiệu Bảng 2.22: Kịch chức quản lý ảnh/video Bảng 2.23: : Kịch chức thêm ảnh/video Bảng 2.24: Kịch chức sửa viết Bảng 2.25: Kịch chức xóa video hình ảnh Bảng 2.26: Kịch chức Backup/Restore Database Bảng 2.27: Kịch chức Backup Database Bảng 2.28: Kịch chức Restore Database Bảng 2.29: Danh sách đối tượng Bảng 2.30: Danh sách bảng sở liệu Bảng 2.31: Bảng Categories Bảng 2.32: Bảng Contacts Bảng 2.33: Bảng Admins Bảng 2.34: Bảng Introduction Bảng 2.35: Bảng News Bảng 2.36: Bảng Image_video DANH SÁCH HÌNH ẢNH Hình 1.1: Cấu trúc tài liệu Html Hình 1.2: Hình minh hỏa quy tắc CSS Hình 1.3: Sơ đồ hoạt động cookie 14 Hình 1.4: Mơ hình MVC 15 Hình 2.1: Các phần tử UML Error! Bookmark not defined Hình 2.2: Sơ đồ phân cấp chức 26 Hình 2.3: Biểu đồ Use case tổng quát 27 Hình 2.4: Biểu đồ Use case đăng nhập 28 Hình 2.5: Biểu đồ Use case quản lý danh mục 29 Hình 2.6: Biểu đồ use case quản lý quản trị viên 32 Hình 2.7: Biểu đồ use case quản lý viết 35 Hình 2.8: Biểu đồ use case quản lý liên hệ 38 Hình 2.9: Biểu đồ use case quản lý giới thiệu 40 Hình 2.10: Biểu đồ use case quản lý ảnh/video 43 Hình 2.11: Biểu đồ use case Backup/Restore Database 46 Hình 2.12: Biểu đồ chức đăng nhập 49 Hình 2.13: Biểu đồ quản lý giới thiệu 50 Hình 2.14: Biểu đồ quản lý danh mục 51 Hình 2.15: Biểu đồ quản lý viết 52 Hình 2.16: Biểu đồ quản lý quản trị viên 53 Hình 2.17: Biểu đồ quản lý ảnh/video 54 Hình 2.18: Biểu đồ quản lý liên hệ 55 Hình 2.19: Biểu đồ hoạt động chức thêm giới thiệu 61 Hình 2.20: Biểu đồ hoạt động chức sửa giới thiệu 62 Hình 2.21: Biểu đồ hoạt động chức xóa giới thiệu 63 Hình 2.22: Biểu đồ hoạt động chức thêm ảnh/video 64 Hình 2.23: Biểu đồ hoạt động chức sửa ảnh/video 65 Hình 2.24: Biểu đồ hỏa động chức xóa ảnh/video 65 Hình 2.25: Biểu đồ hoạt động chức Backup Database 66 Hình 2.26: Biểu đồ hoạt động chức Backup Database 67 Hình 2.27: Biểu đồ hoạt động chức xóa liên hệ 68 Hình 2.28: Mơ hình hóa lớp đối tượng 70 Hình 3.1: Giao diện đăng nhập 75 Hình 3.2: Giao diện người dùng đăng nhập 75 Hình 3.3: Giao diện quản lý quản trị viên 76 Hình 3.4: Giao diện thêm quản trị viên 76 Hình 3.5: Giao diện chỉnh sửa quản trị viên 77 Hình 3.6: Giao diện quản lý danh mục 77 Hình 3.7: Giao diện chức thêm viết 79 Hình 3.8: Giao diện chỉnh sửa viết 80 Hình 3.9: Giao diện quản lý liên hệ 81 Hình 3.10: Giao diện trang chủ Website 82 Hình 3.11: Giao diện trang chi tiết viết 83 Hình 3.12: Giao diện trang chi tiết người viết 84 Hình 3.13: Giao diện trang liên hệ 85 Hình 3.14: Giao diện website di động 86 LỜI MỞ ĐẦU Ngày nay, khoa học công nghệ có bước phát triển mạnh mẽ chiều rộng đến chiều sâu Máy tính hay điện thoại trở thành cơng cụ làm việc, giải trí thơng dụng người công sở mà cịn chí cịn gia đình, việc áp dụng công nghệ, khoa học kỹ thuật vào lĩnh vực đời sống người ngày cao nên công cụ thiếu, tảng cho truyền tải, trao đổi thơng tin tồn cầu Việt Nam đất nước có tỉ lệ người dùng Internet cao, thuộc vào nhóm đầu giới Điều chứng tỏ cần thiết thiếu Internet Vì tạo điều kiện thuận lợi cho việc chia sẻ quảng bá du lịch thương mại Trong thời đại mà Internet trở nên phổ biến lĩnh vực kinh tế, trị, xã hội, phổ biến rộng rãi đến tầng lớp xã hội, việc thiết kế website để quảng bá sản phẩm dịch vụ trở nên đặc biệt doanh nghiệp tổ chức kinh doanh mà chưa có website Một cơng ty sản phẩm dịch vụ chất lượng phục vụ tốt chưa đủ, họ phải quảng bá thương hiệu qua internet nhằm người biết tới đến với Nhận thấy tiềm phát triển khả áp dụng thực tế cao, em định chọn đề tài là: “Xây dựng trang web cho Hợp tác xã Nông nghiệp Du lịch cộng đồng Cổ Loa” updated_at timestamp Null Thời gian cập nhật admin_id Int(11) Khóa ngồi Id người đăng keywords varchar(255) Not Null Từ khóa CHƯƠNG 3: DEMO WEBSITE 3.1 Demo Back-end 3.1.1 Giao diện trang chủ đăng nhập Hình 3.1: Giao diện đăng nhập Giao diện đăng nhập để vào người dùng phải có tài khoản quản trị viên Hình 3.2: Giao diện người dùng đăng nhập Trong phần quản trị có chức quản lý thống kê website tổng lượt xem, tổng viết, tổng lượt xem, tổng số quản trị viên 3.1.2 Giao diện quản trị viên Hình 3.3: Giao diện quản lý quản trị viên Giao diện quản lý quản trị viên hiển thị thông tin quản trị viên hình ảnh admin, họ tên, email, số điện thoại,địa chỉ, ngày tạo Hình 3.4: Giao diện thêm quản trị viên Giao diện thêm quản trị viên cần điền thông tin người quản trị mới, với thơng tin có form Hình 3.5: Giao diện chỉnh sửa quản trị viên Giao diện chỉnh sửa quản trị viên người dùng thay đổi mật thông tin cần thay đổi 3.1.3 Giao diện quản lý danh mục Hình 3.6: Giao diện quản lý danh mục Giao diện quản lý danh mục gồm có thông tin danh mục tên danh mục, thứ tự hiển thị, trạng thái có hiển thị Quản trị viên thêm xóa danh mục Hình 3.1: Giao diện thêm danh mục Hình 3.2: Giao diện chỉnh sửa danh mục Giao diện thêm sửa danh mục gồm có thêm danh mục lựa chọn danh mục cha hay danh mục con, thứ tự hiển thị website, lựa chọn hiển thị trang có khơng 3.1.4 Giao diện quản lý người viết Hình 3.3: Giao diện quản lý viết Giao diện quản lý viết gồm có thơng tin ảnh đại diện cho viết, tiêu đề, danh mục, số lượt xem, người đăng, ngày tạo Ngồi cịn hiển thị chức thêm xóa xem chi tiết tin Hình 3.7: Giao diện chức thêm viết Giao diện chức thêm viết quản trị viết cần điền thông tin form thêm viết Hình 3.8: Giao diện chỉnh sửa viết Giao diện chỉnh sửa viết cho phép quản trị viên thay đổi thông tin viết cần sửa nhập thêm từ khóa 3.1.5 Giao diện quản lý liên hệ Hình 3.9: Giao diện quản lý liên hệ Quản trị viên nhìn thấy liên hệ phản hồi họ tên, email, số điện thoại, nội dung quản trị viên xóa liên hệ 3.2 Demo Front-end 3.2.1 Giao diện trang chủ Hình 3.10: Giao diện trang chủ Website Tại giao diện trang chủ, hiển thị thông tin Hợp tác xã, hiển danh sách danh mục, viết bật tin tức vừa cập nhật Ngoài trang chủ cịn có mục hiển thị Facebook, Zalo giúp người cho việc chia sẻ website có đồ hiển thị tới Hợp tác xã 3.2.2 Giao diện chi tiết viết Hình 3.11: Giao diện trang chi tiết viết Giao diện chi tiết viết hiển thị tiêu đề nội dung viết thời gian đăng tải viết Hình 3.12: Giao diện trang chi tiết người viết Cuối trang chi tiết viết có tin tức có liên quan có nút chia sẻ sang trang mạng xã hội khác 3.2.3 Giao diện trang liên hệ Hình 3.13: Giao diện trang liên hệ Trang liên hệ cho phép gửi thông tin liên hệ mà người dùng cần phản hồi lại gồm có họ tên, nội dung, số điện thoại, email Hiển thị đồ đường tới địa hợp tác xã 3.2.4 Giao diện website di động Hình 3.14: Giao diện website di động KẾT LUẬN Về hiểu trình xây dựng website ngơn ngữ lập trình PHP Xây dựng trang với giao diện thân thiện, từ ngữ dễ hiểu dễ sử dụng với người dùng Đồng thời tạo chức quản lý nội dung khiến người dùng dễ dàng thao tác, quản lý Xây dựng chức phân quyền người dùng đăng nhập để quản lý nội dung Xây dựng trang web hiển thị nội dung linh hoạt, giúp cập nhập tin tức, hình ảnh, viết dễ dàng Thiết kế giao diện với màu sắc bố cục hài hòa tạo cho người sử dụng cảm thấy thoải mái sử dụng Tuy nhiên số hạn chế, Website nhỏ Thiếu chức tìm kiếm nội dung, chức đăng ký, đăng nhập, chức chat trực tuyến với người dùng Nội dung chưa đáp ứng đầy đủ tới người dùng Trong thời gian tới em hoàn thành chức tìm kiếm nội dung, chức đăng ký, đăng nhập, chức chat trực tuyến với người dùng Tạo sở liệu phong chú, xây dựng trang chi tiết đa dạng hơn, nội dung thuận tiện tới người dùng TÀI LIỆU THAM KHẢO [1] Trần Đình Quế, Nguyễn Mạnh Sơn, Phân tích thiết kế hệ thống thông tin, Học viện Công nghệ Bưu Viễn Thơng, 2007 [2]https://kungfuphp.com/mysql/gioi-thieu-ve-he-quan-tri-co-so-du-lieumysql.html [3] https://topdev.vn/blog/mo-hinh-mvc-trong-php/ [4]https://tuhoclaptrinh.cachhoc.net/2017/03/25/php-mvc-code-thuan-bai-1gioi-thieu/ [5] https://www.w3schools.com/ ... để xây dựng website, số thư viện hỗ trợ việc xây dựng website Giới thiệu Hợp tác xã nông nghiệp du lịch cộng đồng Cổ Loa Hợp tác xã nông nghiệp du lịch cộng đồng Cổ Loa hay gọi tên viết tắt Hợp. .. chọn đề tài là: ? ?Xây dựng trang web cho Hợp tác xã Nông nghiệp Du lịch cộng đồng Cổ Loa? ?? GIỚI THIỆU Mục tiêu đề tài Xây dựng Website giới thiệu dịch vụ sản phẩm mơ hình nơng nghiệp cách nhanh... ích việc xây dựng trang website Hợp tác xã nông nghiệp du lịch cộng đồng Cổ Loa cần thiết quan trọng, giúp ích cho việc truyền đạt thông tin đến người đọc quảng bá hình ảnh sản phẩm nơng nghiệp