ĐỀ tài WEBSITE bất ĐỘNG sản

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN & TRUYỀN THÔNG VIỆT HÀN Khoa Khoa Học Máy Tính BÁO CÁO ĐỒ ÁN TỐT NGHIỆP WEBSITE BẤT ĐỘNG SẢN Sinh viên thực : Phan Thị Tú Anh Lớp : 19I1 Giảng viên hướng dẫn: TS LÊ THỊ THU NGA Đà Nẵng, tháng 11 năm 2021 TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN & TRUYỀN THÔNG VIỆT HÀN Khoa Khoa Học Máy Tính BÁO CÁO ĐỒ ÁN TỐT NGHIỆP WEBSITE BẤT ĐỘNG SẢN Sinh viên thực hiện: Phan Thị Tú Anh Mã sinh viên: 191C900001 Giảng viên hướng dẫn: TS LÊ THỊ THU NGA Đà Nẵng, tháng 11 năm 2021 i NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN ii LỜI CẢM ƠN Đầu tiên em xin cảm ơn thầy, cô giảng viên khoa Công Nghệ Thơng Tin Truyền Thơng Việt – Hàn, nhờ có giảng dạy tận tình thầy, trường mà em nắm kiến thức HTML, CSS, Javascript, biết cách sử dụng công cụ để xây dựng website, làm tảng cho phát triển nghề nghiệp sau Tiếp theo, em xin cảm ơn công ty THCMedia cho phép em sử dụng dự án website bất động sản để làm đồ án tốt nghiệp, cảm ơn anh tin tưởng giao cho em dự án khách hàng để em tìm hiểu, trải nghiệm dự án thực tế Trong q trình làm, có thứ em chưa hiểu anh hỗ trợ để em hồn thành dự án cách hồn thiện Cảm ơn cô Lê Thị Thu Nga hướng dẫn, nhận xét, giúp đỡ em trình thực đồ án tốt nghiệp hoàn thành báo cáo cách chỉnh chu Em xin chân thành cảm ơn! Sinh viên, Phan Thị Tú Anh iii MỤC LỤC DANH MỤC CÁC TỪ VIẾT TẮT vi DANH MỤC BẢNG vii DANH MỤC HÌNH VẼ vii MỞ ĐẦU .1 Giới thiệu đề tài Bố cục đề tài Chương CÔNG CỤ NGÔN NGỮ SỬ DỤNG .2 1.1 Worspress 1.2 Boostrap 1.3 Javascript 1.4 HTML 1.5 CSS 1.6 PHP 1.7 Visual Studio Code 1.8 PhpMyAdmin Chương PHÂN TÍCH YÊU CẦU KHÁCH HÀNG 2.1 Mẫu website khách hàng mong muốn 2.2 Thay đổi bổ sug theo yêu cầu khách hàng 15 Chương PHÂN TÍCH MƠ HÌNH HỆ THỐNG 19 3.1 Thiết kế hệ thống 19 3.2 Biểu đồ use case 20 3.1.1 Biểu đồ use case admin 20 3.1.2 Biểu đồ use case người dùng 21 3.3 Mô tả chi tiết chức 21 3.4 Thiết kế sở liệu 23 3.4.1 Bảng admin 23 3.4.2 Bảng wphw_bwg_album 23 iv 3.4.3 Bảng wphw_bwg_image 23 3.4.4 Bảng wphw_comments 24 3.4.5 Bảng wphw_posts 24 Chương XÂY DỰNG DỰ ÁN .26 4.1 Giao diện người dùng 26 4.1.1 Giao diện header 26 4.1.2 Giao diện footer 26 4.1.3 Giao diện trang chủ 27 4.1.4 Giao diện trang giới thiệu 29 4.1.5 Giao diện trang bất động sản 31 4.1.6 Giao diện trang chi tiết bất động sản 32 4.1.7 Giao diện trang blog 33 4.1.8 Giao diện trang tin tức 35 4.1.9 Giao diện trang liên hệ 36 4.2 Giao diện người quản trị 37 KẾT LUẬN 38 TÀI LIỆU THAM KHẢO 39 v DANH MỤC CÁC TỪ VIẾT TẮT VIẾT TẮT NỘI DUNG PHP Hypertext Preprocessor HTML Hypertext Markup Language CSS Cascading Style Sheets vi DANH MỤC BẢNG Bảng Bảng admin 23 Bảng Bảng wphw_bwg_album 23 Bảng Bảng wphw_bwg_image 23 Bảng Bảng wphw_comments 24 Bảng Bảng wphw_post 25 DANH MỤC HÌNH VẼ Hình Header Hình Footer Hình Chuyển đổi ngơn ngữ Hình Cơng cụ tìm kiếm Hình Trang chủ Hình Trang giới thiệu 10 Hình Trang bất động sản 11 Hình Trang chi tiết bất động sản 13 Hình Trang tin tức 13 Hình 10 Trang liên hệ 14 Hình 11 Wordpress Hình 12 Boostrap Hình 13 Javascript Hình 14 HTML Hình 15 CSS Hình 16 PHP Hình 17 Visual Studio Code Hình 18 Biểu đồ use case admin 20 Hình 19 Biểu đồ use case người dùng 21 Hình 20 Giao diện haeder 26 Hình 21 Giao diện footer 26 Hình 22 Giao diện trang chủ 28 Hình 23 Giao diện trang giới thiệu 30 Hình 24 Giao diện trang bất động sản 31 Hình 25 Giao diện trang chi tiết sản phẩm 33 Hình 26 Giao diện trang blog 34 Hình 27 Giao diện trang tin tức 35 Hình 28 Giao diện trang liên hệ 36 Hình 29 Giao diện admin 37 vii MỞ ĐẦU Giới thiệu đề tài Cho đến thời điểm bây giờ, kinh tế Việt Nam dần bước sang bước ngoặc mới, bước ngoặc gần hoàn thiện mảng phát triển kinh tế Điều đó, giúp cho Việt Nam từ nước nghèo nàn kinh tế tài nguyên, vươn lên thành nước có kinh tế vững mạnh Đứng vững kinh tế Việt Nam nói riêng giới nói chung Là người dân Việt Nam mong muốn đóng góp phần nhỏ để giúp kinh tế nước ta ngày phát triển nữa.Vì tình hình dịch COVID-19 ngày căng thẳng người dân ngồi tìm kiếm,xem trực tiếp đất đai, nhà xưởng, Nay em đưa đến website bất động sản công ty Chi Strategies Đây website dễ sử dụng, tiện lợi, tiếp xúc tình hình dịch Covid-19, website đáp ứng nhu cầu việc lựa chọn đất đai, thuê, mua nhà xưởng, Website bất động sản cung cấp đủ địa điểm,hình ảnh, kích thước, số tính chi tiết khác để người mua xem, lựa chọn tùy ý Ngồi website cịn hỗ trợ thêm ngơn ngữ tiếng anh để người nước ngồi dê dàng đọc, hiểu Bố cục đề tài - Chương Phân tích u cầu khách hàng Chương trình bày mẫu website khách hàng mong muốn thay đổi, bổ sung thêm website theo yêu cầu khách hàng - Chương Công cụ công nghệ sử dụng Chương trình bày số cơng cụ sử dụng để xây dựng website như: Wordpress,Bootstrap, Javascript, - Chương Phân tích mơ hình hệ thống Chương phân tích sơ đồ use case, mơ tả chi tiết chức - Chương Xây dựng dự án Chương cuối kết đạt như: giao diện người dùng, giao diện người quản trị Chương CƠNG CỤ NGƠN NGỮ SỬ DỤNG 1.1 Worspress Hình Wordpress - WordPress mã nguồn mở viết ngơn ngữ lập trình PHP sử dụng hệ quản trị sở liệu MySQL Nó cơng cụ tạo trang web miễn phí, bạn cần cài lên host có website Sau bạn cài Theme để thay đổi giao diện cho trang web Muốn tăng sinh động tối ưu hoạt động web, bạn thay đổi Theme cài đặt thêm vài Plugin 1.2 Boostrap Hình Boostrap - Bootstrap: sưu tập miễn phí mã nguồn mở cơng cụ dùng để tạo mẫu webiste hoàn chỉnh Với thuộc tính giao diện quy định sẵn kích thước, màu sắc, độ cao, độ rộng…, designer sáng tạo nhiều sản phẩm mẻ tiết kiệm thời gian làm việc với framework trình thiết kế giao diện website post_modified_gmt post_content_filtered post_parent guid menu_order post_type post_mime_type comment_count datetime longtext bigint(20) varchar(255) int(11) varchar(20) varchar(100) bigint(20) Bảng Bảng wphw_post 25 Khóa phụ Khóa phụ Chương XÂY DỰNG DỰ ÁN 4.1 Giao diện người dùng 4.1.1 Giao diện header Hình 20 Giao diện haeder 4.1.2 Giao diện footer Hình 21 Giao diện footer 26 4.1.3 Giao diện trang chủ 27 Hình 22 Giao diện trang chủ - Cơng cụ chuyển đổi ngơn ngữ: Hình 23 Cơng cụ chuyển đổi ngơn ngữ 28 - Cơng cụ tìm kiếm Hình 24 Cơng cụ tìm kiếm 4.1.4 Giao diện trang giới thiệu 29 Hình 25 Giao diện trang giới thiệu 30 4.1.5 Giao diện trang bất động sản Hình 26 Giao diện trang bất động sản 31 4.1.6 Giao diện trang chi tiết bất động sản 32 Hình 27 Giao diện trang chi tiết sản phẩm 4.1.7 Giao diện trang blog 33 Hình 28 Giao diện trang blog 34 4.1.8 Giao diện trang tin tức Hình 29 Giao diện trang tin tức 35 4.1.9 Giao diện trang liên hệ Hình 30 Giao diện trang liên hệ 36 4.2 Giao diện người quản trị Hình 31 Giao diện admin 37 KẾT LUẬN Kết đạt Sau thời gian thực tập thực dự án thực tế em đạt nhiều tiến mặt tìm hiểu lý thuyết lẫn kỹ lập trình Có thể nói, thơng qua dự án này, em đạt sau: - Hiểu biết nhiều kỹ lập trình - Biết thêm nhiều công cụ hỗ trợ xây dựng website - Nâng cao tinh thần tự học, tìm hiểu - Nâng cao kỹ tư logic Hạn chế hướng phát triển - Hạn chế Đây website dựa mơ hình client/server với số lượng người truy cập lớn tốc độ tải website khơng ổn định điều xảy khắc phục - Hướng phát triển o Tối ưu chuẩn SEO Để tăng lưu lượng truy cập vào website doanh nghiệp, cập nhật trang website khách hàng thường xuyên o Thu hút người dùng, tăng tương tác Điều thực cách quán nhằm giữ cho website hoạt động ổn định Tối ưu hóa cho việc tăng traffic website o Nâng cấp website thường xuyên, chăm chút, tỉ mỉ o Theo kịp xu hướng thiết kế công nghệ 38 TÀI LIỆU THAM KHẢO [1] https://www.google.com/ [2] https://mona.media/wordpress-la-gi-huong-dan-wordpress-va-nhung-luu-y-quantrong-nhat-ve-wordpress/ [3] https://wiki.matbao.net/bootstrap-la-gi-cai-dat-bootstrap-web-chuan-responsive/ [4] https://topdev.vn/blog/css-la-gi/ [5] https://www.hostinger.vn/huong-dan/javascript-la-gi [6] https://wiki.matbao.net/html-la-gi-nen-tang-lap-trinh-web-cho-nguoi-moi-bat-dau/ [7] https://www.hostinger.vn/huong-dan/php-la-gi 39 ... thiệu Hình 13 Trang giới thiệu 10 - Trang bất động sản Hình 14 Trang bất động sản 11 - Trang chi tiết bất động sản 12 Hình 15 Trang chi tiết bất động sản - Trang tin tức Hình 16 Trang tin tức... sửa hình ảnh o Xóa: xóa hình ảnh - Chức danh sách bất động sản: o Thêm: thêm bất động sản o Chỉnh sửa: chỉnh sửa bất động sản o Xóa: xóa bất động sản - Chức liên hệ: o Thêm: admin thêm liên hệ o... thiệu 30 4.1.5 Giao diện trang bất động sản Hình 26 Giao diện trang bất động sản 31 4.1.6 Giao diện trang chi tiết bất động sản 32 Hình 27 Giao diện trang chi tiết sản phẩm 4.1.7 Giao diện trang