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

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 3.5 Biểu đồ hoạt động 25 3.5.1 Biểu đồ Admin 25 3.5.2 Biểu đồ người dùng 27 Chương XÂY DỰNG DỰ ÁN .29 4.1 Giao diện người dùng 29 4.1.1 Giao diện header 29 4.1.2 Giao diện footer 29 4.1.3 Giao diện trang chủ 30 4.1.4 Giao diện trang giới thiệu 32 4.1.5 Giao diện trang bất động sản 34 4.1.6 Giao diện trang chi tiết bất động sản 35 4.1.7 Giao diện trang blog 36 4.1.8 Giao diện trang tin tức 38 4.1.9 Giao diện trang liên hệ 39 4.2 Giao diện người quản trị 40 KẾT LUẬN 41 TÀI LIỆU THAM KHẢO 42 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 Wordpress Hình Boostrap Hình Javascript Hình HTML Hình CSS Hình PHP Hình Visual Studio Code Hình Header Hình Footer Hình 10 Chuyển đổi ngôn ngữ Hình 11 Cơng cụ tìm kiếm Hình 12 Trang chủ Hình 13 Trang giới thiệu 10 Hình 14 Trang bất động sản 11 Hình 15 Trang chi tiết bất động sản 13 Hình 16 Trang tin tức 13 Hình 17 Trang liên hệ 14 Hình 18 Biểu đồ use case admin 20 Hình 19 Biểu đồ use case người dùng 21 Hình 20 Đăng nhập 25 Hình 21 Đăng viết 26 Hình 22 Đăng bất động sản 27 Hình 23 Tìm kiếm 27 Hình 24 Chuyển đổi ngơn ngữ 28 Hình 25 Giao diện haeder 29 Hình 26 Giao diện footer 29 Hình 27 Giao diện trang chủ 31 Hình 28 Cơng cụ chuyển đổi ngơn ngữ 31 Hình 29 Cơng cụ tìm kiếm 32 Hình 30 Giao diện trang giới thiệu 33 Hình 31 Giao diện trang bất động sản 34 Hình 32 Giao diện trang chi tiết sản phẩm 36 Hình 33 Giao diện trang blog 37 Hình 34 Giao diện trang tin tức 38 Hình 35 Giao diện trang liên hệ 39 Hình 36 Giao diện admin 40 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 khơng thể 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 yê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 hồ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 - Chuyển đổi ngơn ngữ Hình 24 Chuyển đổi ngôn ngữ 28 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 25 Giao diện haeder 4.1.2 Giao diện footer Hình 26 Giao diện footer 29 4.1.3 Giao diện trang chủ 30 Hình 27 Giao diện trang chủ - Cơng cụ chuyển đổi ngơn ngữ: Hình 28 Cơng cụ chuyển đổi ngơn ngữ 31 - Cơng cụ tìm kiếm Hình 29 Cơng cụ tìm kiếm 4.1.4 Giao diện trang giới thiệu 32 Hình 30 Giao diện trang giới thiệu 33 4.1.5 Giao diện trang bất động sản Hình 31 Giao diện trang bất động sản 34 4.1.6 Giao diện trang chi tiết bất động sản 35 Hình 32 Giao diện trang chi tiết sản phẩm 4.1.7 Giao diện trang blog 36 Hình 33 Giao diện trang blog 37 4.1.8 Giao diện trang tin tức Hình 34 Giao diện trang tin tức 38 4.1.9 Giao diện trang liên hệ Hình 35 Giao diện trang liên hệ 39 4.2 Giao diện người quản trị Hình 36 Giao diện admin 40 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ệ 41 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 42 ... 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 33 4.1.5 Giao diện trang bất động sản Hình 31 Giao diện trang bất động sản 34 4.1.6 Giao diện trang chi tiết bất động sản 35 Hình 32 Giao diện trang chi tiết sản phẩm 4.1.7 Giao diện trang