Mục tiêu để xây dựng website giới thiệu thông tin về các cây cầu bắc trên sông Hàn Đà Nẵng là giúp khách du lịch nắm r những thông tin chính xác về thông tin, lịch sử hình thành, các tin chất lượng, mới nhất về các cây cầu tại Đà Nẵng, cũng như những thông tin liên quan đến du lịch, nghỉ dưỡng, học tập, … mà mọi người quan tâm tại thành phố biển Đà Nẵng xinh đẹp.
TRƯỜNG CAO ĐẲNG CÔNG NGHỆ THÔNG TIN HỮU NGHỊ VIỆT - HÀN KHOA CƠNG NGHỆ THƠNG TIN TĨM TẮT ĐỒ ÁN TỐT NGHIỆP NGÀNH: CÔNG NGHỆ THÔNG TIN Đề tài: NGHIÊN CỨU BOOTSTRAP CSS FRAMEWORK VÀ ỨNG DỤNG ĐỂ XÂY DỰNG WEBSITE GIỚI THIỆU THÔNG TIN VỀ CÁC CÂY CẦU BẮC TRÊN SÔNG HÀN - ĐÀ NẴNG SVTH : Lộc Hồng Ánh Trâm Lớp : CCCT15A Niên khóa : 2015 - 2018 CBHD : TS Nguyễn Thị Hoa Huệ Đà Nẵng, tháng 06 năm 2018 TRƯỜNG CAO ĐẲNG CÔNG NGHỆ THÔNG TIN HỮU NGHỊ VIỆT - HÀN KHOA CÔNG NGHỆ THÔNG TIN ĐỒ ÁN TỐT NGHIỆP NGÀNH: CÔNG NGHỆ THÔNG TIN Đề tài: NGHIÊN CỨU BOOTSTRAP CSS FRAMEWORK VÀ ỨNG DỤNG ĐỂ XÂY DỰNG WEBSITE GIỚI THIỆU THÔNG TIN VỀ CÁC CÂY CẦU BẮC TRÊN SÔNG HÀN - ĐÀ NẴNG SVTH : Lộc Hoàng Ánh Trâm Lớp : CCCT15A Niên khóa : 2015 - 2018 CBHD : TS Nguyễn Thị Hoa Huệ Đà Nẵng, tháng 06 năm 2018 MỞ ĐẦU Lý chọn đề tài Hiện nay, phát triển nhanh chóng cơng nghệ thơng tin nói chung mạng Internet nói riêng đem lại cho người sống hoàn toàn khác Với mạng lưới Internet rộng khắp, người khơng cịn khó khăn việc tìm kiếm thơng tin mà cần Với mật độ phủ sóng Internet thời đại cơng nghệ nay, thơng tin khơng cịn trở nên khan Chỉ với cú click chuột, hàng loạt thông tin vấn đề bạn cần vài giây ngắn ngủi Tuy nhiên, nhiều thông tin gọi dao hai lưỡi nhiều người Bạn hoàn tồn khơng biết đâu thơng tin xác mà bạn cần, đâu thơng tin cải viết bừa bãi nhằm thu hút người đọc Mỗi người hồn tồn tạo website nhằm đáp ứng nhu cầu sở thích riêng Website dạng blog giới thiệu sống thân, sở thích hay vấn đề mà thân quan tâm Thậm chí, bạn tạo website với nội dung review ăn ngon bạn thưởng thức, địa điểm ăn chơi thả ga với giá hạt dẻ Bắt nguồn từ ý tưởng này, em mong muốn đem lại cho người, đặc biệt khách du lịch đến với Đà Nẵng Những thơng tin xác, chất lượng, cầu Đà Nẵng, thông tin liên quan đến du lịch, nghỉ dưỡng, học tập, … mà người quan tâm thành phố biển Đà Nẵng xinh đẹp Chính lí em lựa chọn đề tài: “Nghiên cứu Bootstrap CSS Framework ứng dụng xây dựng website giới thiệu thông tin cầu bắc sông Hàn Đà Nẵng” Thông qua website này, khách du lịch nắm bắt nhiều thông tin lịch sử, q trình hình thành, vị trí địa lý cầu viết liên quan đến Mục tiêu nhiệm vụ nghiên cứu Mục tiêu để xây dựng website giới thiệu thông tin cầu bắc sông Hàn Đà Nẵng giúp khách du lịch nắm r thơng tin xác thơng tin, lịch sử hình thành, tin chất lượng, cầu Đà Nẵng, thông tin liên quan đến du lịch, nghỉ dưỡng, học tập, … mà người quan tâm thành phố biển Đà Nẵng xinh đẹp Nhiệm vụ: Nghiên cứu cơng nghệ Bootstrap CSS Phân tích thiết kế Xây dựng website Đối tƣợng phạm vi nghiên cứu Các công cụ xây dựng hệ thống mơ hình áp dụng: Sublime Tex 3, Framework Bootstrap CSS, PHP Mysql Phạm vi nghiên cứu đề tài xây dựng cầu bắc sông Hàn – Đà Nẵng, bao gồm lịch sử, thông tin hình thành, trình xây dựng, năm hình thành vị trí cầu Phƣơng pháp nghiên cứu Tìm hiểu thu thập thơng tin cầu bắc sông Hàn – Đà Nẵng Tham khảo số website giới thiệu địa điểm du lịch Tìm hiểu nghiên cứu tài liệu liên quan đến Bootstrap CSS, PHP Mysql học hỏi kinh nghiệm anh/chị diễn đàn, nhóm Nghiên cứu công cụ xây dựng hệ thống 3 Dự kiến kết Xây dựng hoàn thiện website giới thiệu thông tin cầu bắc sơng Hàn Đà Nẵng với số chức website Chức người xem gồm có đối tượng: Thành viên đăng kí tài khoản: - Đăng nhập - Xem viết - Bình luận biết Khách: - Đăng kí - Xem viết Quyền quản trị Admin quản lý chung: - Quản lý thành viên - Quản lý tin tức - Đăng nhập vào tài khoản với quyền admin Ý nghĩa khoa học thực tiễn Giúp khách du lịch biết r lịch sử hình thành, trình xây dựng, năm hình thành vị trí đồ cầu bắc sông Hàn Đà Nẵng Hiểu r công nghệ Bootstrap CSS, phục vụ cho việc xây dựng website giới thiệu cầu bắc sông Hàn để áp dụng vào thực tiễn nhiều Dự kiến nội dung đồ án Chương 1: Cơ sở lý thuyết Chương 2: Phân tích thiết kế hệ thống Chương 3: Thiết kế giao diện cài đặt hệ thống Kết luận hướng phát triển CHƢƠNG CƠ SỞ LÝ THUYẾT 1.1 GIỚI THIỆU VỀ HTML 1.2 GIỚI THIỆU VỀ CSS 1.3 GIỚI THIỆU VỀ FRAMEWORK BOOTSTRAP 1.4 GIỚI THIỆU VỀ CÔNG NGHỆ THIẾT KẾ WEB RESPONSIVE 1.5 TỔNG QUAN VỀ NGƠN NGỮ LẬP TRÌNH PHP VÀ HỆ QUẢN TRỊ CƠ SỞ DỮ LIỆU MYSQL 1.1.1 Tổng quan ngơn ngữ lập trình PHP 1.1.2 Hệ quản trị sở liệu Mysql 1.6 NHÓM THẺ PHỤC VỤ CHO VIỆC SEO TRANG WEB CHƢƠNG PHÂN TÍCH THIẾT KẾ HỆ THỐNG 2.1 XÁC ĐỊNH CÁC TÁC NHÂN - Admin Quản trị viên : Là người quản trị nhất, quản lý mặt website - User Thành viên : Đăng nhập, xem viết bình luận tương tác viết - Khách: Người xem viết, khơng thể bình luận 2.2 CÁC TRƢỜNG HỢP SỬ DỤNG 2.2.1 Liệt kê trƣờng hợp sử dụng Admin Quản trị viên : User (Thành viên): Khách: Trang tin tức: 2.2.2 Đặc tả trƣờng hợp sử dụng Tài khoản: Tin tức: Trang Admin: 2.2.3 Biểu đồ trƣờng hợp sử dụng Hình 2.1 Biểu đồ trường hợp sử dụng 6 2.3 XÁC ĐỊNH CÁC LỚP ĐỐI TƢỢNG 2.4 BIỂU ĐỒ LỚP Hình 2.2 Biểu đồ lớp 2.5 THIẾT KẾ CƠ SỞ DỮ LIỆU VẬT LÝ TRÊN HỆ CƠ SỞ QUẢN TRỊ CSDL MYSQL 2.6 BIỂU ĐỒ TRÌNH TỰ 2.6.1 Biểu đồ trình tự đăng nhập Hình 2.3 Biểu đồ trình tự đăng nhập 2.6.2 Biểu đồ trình tự thêm tin tức Hình 2.4 Biểu đồ trình tự thêm tin tức 2.6.3 Biểu đồ trình tự sửa thơng tin viết Hình 2.5 Biểu đồ trình tự sửa thơng tin viết 2.6.4 Biểu đồ trình tự xóa tin tức Hình 2.6 Biểu đồ tình tự xóa viết 2.6.5 Biểu đồ trình tự đăng kí thành viên Hình 2.7 Biểu đồ trình tự đăng kí thành viên 2.6.6 Biểu đồ trình tự xóa tin tức Hình 2.8 Biểu đồ trình tự xóa tin tức 2.6.7 Biểu đồ trình tự bình luận viết Hình 2.9 Biểu đồ trình tự bình luận viết 2.6 BIỂU ĐỒ TRẠNG THÁI 2.7.1 Biểu đồ trạng thái đăng nhập Hình 2.10 Biểu đồ trạng thái đăng nhập 2.7.2 Biểu đồ trạng thái đăng viết Hình 2.11 Biểu đồ trạng thái đăng viết 2.7.3 Biểu đồ trạng thái cập nhật viết 10 Hình 2.12 Biểu đồ trạng thái cập nhật viết 2.7.4 Biểu đồ cập nhật trạng thái đăng kí Hình 2.13 Biểu đồ trạng thái đăng kí thành viên 2.7.5 Biểu đồ trạng thái bình luận viết Hình 2.14 Biểu đồ trạng thái bình luận viết 2.8.BIỂU ĐỒ HOẠT ĐỘNG 11 2.8.1 Biểu đồ hoạt động đăng nhập Hình 2.15 Biểu đồ hoạt động đăng nhập 2.8.2 Biểu đồ hoạt động quản lý tin tức Hình 2.16 Biểu đồ hoạt động quản lý tin tức 12 CHƢƠNG KIẾN TRÚC VẬT LÝ VÀ GIỚI THIỆU WEBSITE 3.1 PHÂN TÍCH YÊU CẦU HỆ THỐNG 3.1.1 Yêu cầu chức hệ thống Hệ thống cho phép lưu trữ, cập nhật số thông tin vào sở liệu như: User: Nơi lưu trữ tài khoản mật thành viên sau đăng nhập hệ thống Post: Mỗi tin tức gồm thông tin cần lưu trữ như: id viết, viết có mã, tên tiêu đề, tóm tắt viết, hình ảnh, nội dung viết, đăng vào ngày tháng Comment: Nội dung bình luận hiển thị viết lưu trữ vào sở liệu như: tên thành viên, nội dung bình luận, ngày bình luận 3.1.2 Một số hình ảnh website 3.2.1 Giao diện trang chủ Hình 3.1 Giao diện trang chủ 13 3.2.2 Giao diện trang giới thiệu cầu Hình 3.2 Giao diện trang giới thiệu cầu 14 3.2.3 Giao diện trang thông tin viết Hình 3.3 Giao diện trang thơng tin viết 15 3.2.4 Giao diện hiển thị tin tức theo tên cầu Hình 3.4 Giao diện trang hiển thị tin tức theo tên cầu3.2.5 Giao diện trang liên hệ HÌnh 3.5 Giao diện trang trang liên h 16 3.2.6 Giao diện trang giới thiệu Hình 3.6 Giao diện trang giới thiệu 17 3.2.7 Giao diện trang đăng nhập Hình 3.7 Giao diện trang đăng nhập 3.2.8 Giao diện trang đăng kí tài khoản Hình 3.8 Giao diện trang đăng kí3.2.9 Giao diện trang quản lý Hình 3.9 Giao diện trang quản lý 18 KẾT LUẬN VÀ HƢỚNG PHÁT TRIỂN Công nghệ dần trở thành điều thiếu sống người, mang lại nhiều lợi ích cho người sử dụng nâng cao hiệu lĩnh vực giải trí cơng việc Ứng dụng CNTT xã hội, người dân doanh nghiệp có chuyển biến tích cực, tầng lớp xã hội miền đất nước tạo điều kiện để khai thác, sử dụng thông tin điện tử ứng dụng công nghệ thơng tin vào hoạt động Việt Nam trở thành nước có số lượng người dùng Internet cao nhất, sở thành tựu bước đầu ngành CNTT vậy, thấy r vai trị động lực nó, điều điều kiện thuận lợi cho website em tiếp cận đến người Sau hồn thành đề tài giúp em có kinh nghiệm việc áp dụng ngôn ngữ cơng nghệ nghiên cứu, để ứng dụng tốt cơng việc sau này, nhiên có số tính chưa nghiên cứu, hứa hẹn thời gian tới hệ thống tiếp tục phát triển hoàn thiện Kết đạt đƣợc Dưới bảo hướng dẫn cô Nguyễn Thị Hoa Huệ với nổ lực em để thực đồ án với đề tài “Nghiên cứu Bootstrap CSS Framework ứng dụng xây dựng website giới thiệu thông tin cầu bắc sông Hàn Đà Nẵng” em hoàn thành Với thuận lợi khó khăn q trình làm việc, website hồn thành khơng tránh phần sai sót Tuy nhiên em nổ lực website tin tức hồn thành nội dung sau: 19 - Vận dụng ngôn ngữ HTML, PHP – MYSQL công cụ Sublime Text vào việc xây dựng website tin tức - Phần giao diện người dùng: giao diện thân thiện, cho phép bạn đọc dễ dàng xem tin - Phần quản trị: xây dựng hệ thống quản lý liệu website, giúp cho người quản trị dễ dàng quản lý thông tin, liệu, xem, thêm, xóa, cập nhật liệu cho website Hƣớng phát triển Ngày Internet trở thành phương tiện tra cứu thông tin khổng lồ tiện dụng cho tất người giới Việc học hành tìm hiểu thơng tin qua mạng trở nên phổ biến Hiểu tầm quan trọng tin tức, em ln muốn hồn thiện website giới thiệu tốt xây dựng giao diện hồn thiện, có tính chun nghiệp mở rộng thêm nhiều chức đọc tin từ động từ trang web khác, thống kê số lượt người truy cập trang web,… ... ĐẲNG CÔNG NGHỆ THÔNG TIN HỮU NGHỊ VIỆT - HÀN KHOA CÔNG NGHỆ THÔNG TIN ĐỒ ÁN TỐT NGHIỆP NGÀNH: CÔNG NGHỆ THÔNG TIN Đề tài: NGHIÊN CỨU BOOTSTRAP CSS FRAMEWORK VÀ ỨNG DỤNG ĐỂ XÂY DỰNG WEBSITE GIỚI... để thực đồ án với đề tài ? ?Nghiên cứu Bootstrap CSS Framework ứng dụng xây dựng website giới thiệu thông tin cầu bắc sơng Hàn Đà Nẵng? ?? em hồn thành Với thuận lợi khó khăn trình làm việc, website. .. trí đồ cầu bắc sông Hàn Đà Nẵng Hiểu r công nghệ Bootstrap CSS, phục vụ cho việc xây dựng website giới thiệu cầu bắc sông Hàn để áp dụng vào thực tiễn nhiều Dự kiến nội dung đồ án Chương 1: Cơ