BÁO CÁO CHUYỀN đề HỌC PHẦN PHẦN MỀM MÃ NGUỒN MỞ đề tài QUẢN LÍ WEBSITE đọc TRUYỆN ONLINE

TRƯỜNG ĐẠI HỌC ĐIỆN LỰC KHOA CÔNG NGHỆ THÔNG TIN BÁO CÁO CHUYỀN ĐỀ HỌC PHẦN PHẦN MỀM MÃ NGUỒN MỞ ĐỀ TI: QUẢN LÍ WEBSITE ĐỌC TRUYỆN ONLINE Sinh viên thực : NGUYỄN VĂN HUY, NGUYỄN VĂN TRÚC, ĐẶNG CAO MINH, NGUYỄN TIẾN LỢI Giảng viên hướng dẫn : TG CŨ VIỆT DŨNG Ngành : CÔNG NGHỆ THÔNG TIN Chuyên ngành : CÔNG NGHỆ PHẦN MỀM Lớp : D14CNPM4 Khóa : 2019-2024 Hà Nội, tháng 10 năm 2021 PHIẾU CHẤM ĐIỂM ST T Họ tên sinh viên Nguyễn Văn Huy Nguyễn Văn Trúc Nguyễn Tiến Lợi Đặng Cao Minh Họ tên giảng viên Nội dung thực Chữ ký Giảng viên chấm 1: Giảng viên chấm 2: MỤC LỤC Điểm Chữ ký Ghi LỜI MỞ ĐẦU CHƯƠNG I.TỔNG QUAN VỀ PHẦN MỀM MÃ NGUỒN MỞ VÀ WORDPRESS 1.1 Tìm hiểu phần mềm mã nguồn mở .5 1.2 Lợi ích phần mềm mã nguồn mở .5 1.3 Tìm hiểu phần mềm mã nguồn mở Wordpress 1.4 Cài đặt localhost máy tính với XAMPP 1.5 Các bước cài đặt WordPress Localhost 10 1.6 Chuyển trang web từ Localhost lên Hosting 14 1.6.1 Thông tin tên miền (Domain) 14 1.6.2 Thông tin hosting 15 1.6.3 Deploy trang web 15 CHƯƠNG II.THIẾT KẾ GIAO DIỆN VÀ KIỂM THỬ .20 2.1 Giao diện người dùng 20 2.1.1 Trang chủ .20 2.1.2 Blog .20 2.1.3 Manga 21 2.1.3 Liên hệ 21 2.1.4 Thông tin 22 2.2 Trang quản trị hệ thống 22 2.3 Thông tin phần mềm 23 2.3.1 Giao diện sử dụng(theme) .23 2.3.2 Các plugin sử dụng .23 LỜI MỞ ĐẦU Do nhu cầu đòi hỏi ngày cao xã hội người ngày cao, để đáp ứng nhu cầu giải trí người tinh thần thể chất đòi hỏi nhiều Hiện xã hội phát triển không ngừng kéo theo lớn mạnh dịch vụ giải trí nhiều tảng khác Trong đó, truy cập website internet phương tiện hữu ích đa số người dùng lựa chọn Đây lí mà thiết kế web truyện đời phát triển mạnh mẽ Với phát triển công nghệ thông tin cố gắng đáp ứng yêu cầu người Việc đưa công nghệ thông tin áp dụng vào thiết kế tạo dựng website giải trí quan trọng cần thiết.Vì em chọn đề tài:” Xây dựng website đọc truyện online” em muốn tạo website kết nối người dùng với chương trình giải trí, manga, truyền hình, thơng qua internet CHƯƠNG I.TỔNG QUAN VỀ PHẦN MỀM MÃ NGUỒN MỞ VÀ WORDPRESS 1.1 Tìm hiểu phần mềm mã nguồn mở Mã nguồn mở (Open source) phần mềm cung cấp dạng mã nguồn, khơng miễn phí giá mua mà chủ yếu miễn phí quyền: Người dùng có quyền sửa đổi, cải tiến, phát triển, nâng cấp theo số nguyên tắc định giấy phép Phần mềm nguồn mở (ví dụ General Public Licence – GPL) mà khơng cần xin phép Tiện ích mà Open Source mang lại quyền tự sử dụng chương trình cho mục đích, quyền tự để nghiên cứu cấu trúc chương trình, chỉnh sửa phù hợp với nhu cầu, truy cập vào mã nguồn, quyền tự phân phối lại phiên cho nhiều người, quyền tự cải tiến chương trình phát hành cải tiến mục đích cộng đồng 1.2 Lợi ích phần mềm mã nguồn mở - Phần mềm chép hồn tồn miễn phí, bạn hồn tồn an tâm chia sẻ chương trình tuyệt vời với bạn bè - Các định dạng file khơng hồn tồn bị kiểm sốt vài nhà cung cấp Điều xảy liệu nằm phần mềm độc quyền? Việc sử dụng định dạng file bí ẩn khiến bạn dùng chương trình cơng ty Do yêu cầu công việc, bạn muốn sử dụng liệu cho ứng dụng khác chương trình quyền khơng cho phép! Cịn nhà cung cấp chấm dứt hỗ trợ ngưng việc nâng cấp sản phẩm, chắn liệu bạn phải vứt xó Với phần mềm quyền, có nhà cung cấp giải vấn đề bạn Nhưng với Open Source bạn gặp nhiều nhà cung cấp làm vừa lòng - Hầu hết sản phẩm Open Source có khả bảo mật tuyệt vời, vết nứt tìm thấy, thường xử lý nhanh phần mềm có quyền - Các hệ thống Open Source, hệ thống dựa UNIX thường linh hoạt đến khó tin Bởi chúng xây dựng từ nhiều khối thống miêu tả cặn kẽ, rấ dễ để bạn thay nhiều phần hệ thống với phần có giao diện tương tự - Có cộng đồng hỗ trợ lớn, khơng bị phụ thuộc vào cơng ty 1.3 Tìm hiểu phần mềm mã nguồn mở Wordpress - WordPress phần mềm nguồn mở (Open Source Software) viết ngơn ngữ lập trình website PHP (Hypertext Preprocessor) sử dụng hệ quản trị sở liệu MySQL Wordpress mắt lần vào ngày 27/05/2003 tác giả Matt Mullenweg Mike Little Hiện WordPress sở hữu phát triển công ty Automattic có trụ sở San Francisco, California thuộc hợp chủng quốc Hoa Kỳ - WordPress mã nguồn mở ngôn ngữ PHP để hỗ trợ tạo tạo blog cá nhân nhiều người sử dụng ủng hộ tính dễ sử dụng, nhiều tính hữu ích Qua thời gian, số lượng người sử dụng tăng lên, cộng tác viên lập trình viên tham gia đơng đảo để phát triển mã nguồn Wordpress có thêm tính tuyệt vời WordPress xem hệ quản trị n ội dung (CMS – Content Management System) vượt trội để hỗ trợ người dùng tạo nhiều thể loại website khác blog, website tin tức/tạp chí, giới thiệu doanh nghiệp, bán hàng – thương mại điện tử, chí với loại website có độ phức tạp cao đặt phòng khách sạn, thuê xe, đăng dự án bất động sản Hầu hình thức website với quy mơ nhỏ vừa có thê triển khai tảng WordPress 1.4 Cài đặt localhost máy tính với XAMPP * Hướng dẫn cài đặt Localhost: - Để cài đặt Localhost có nhiều cách phần mềm, xử dụng XAMPP để cài đặt localhost vì: + XAMPP hồn tồn miễn phí + Dễ sử dụng + Hỗ trợ hệ điều hành thông dụng Windows, Mac, Linux Để tải XAMPP, ta truy cập vào địa chỉ: https://www.apachefriends.org chọn phiên XAMPP phù hợp với hệ điều hành với máy tính sử dụng, nên chọn phiên PHP 8.0.9 Lưu ý XAMPP có phiên cho hệ điều hành 32bit 64bit hoạt động bình thường Hình 1.Tải XAMPP từ trang https://www.apachefriends.org - Sau tải file cài đặt xong, chạy nó, sau chọn Next Hình 2.Bắt đầu cài đặt XAMPP - Ở phần chọn đường dẫn, bạn chọn đường dẫn lưu cài đặt XAMPP Lưu ý đường dẫn bạn phải nhớ cài đặt web lên localhost bạn phải truy cập vào thư mục Bạn nên để mặc định c:\xampp Tiếp tục bấm “Next” Hình 3.Chọn đường dẫn cài đặt XAMPP - Ở trang bạn bỏ chọn phần “Lear more about Bitnami for XAMPP” ấn “Next” lần để hồn tất q trình cài đặt Hình 4.Tìm hiểu thêm Bitnami cho Xampp - Sau cài xong ấn nút “Finish” để kết thúc trình cài đặt mở bảng điều khiển XAMPP Tuy nhiên khởi động lại máy sau cài đặt xong để tránh tình trạng khơng khởi động localhost - Khởi động Localhost: + Bây bạn vào thư mục c:\xampp mở file xampp-panel.exe lên để bật bảng điều khiển XAMPP Hình 5.Bảng điều khiển XAMPP - Bạn để ý thấy hai ứng dụng Apache MySQL có nút Start, dấu hiệu bảo ứng dụng chưa khởi động, ấn vào nút Start ứng dụng để khởi động webserver Apache MySQL Server lên chạy localhost - Nếu hai ứng dụng chuyển sang màu xanh hình khởi động thành cơng Hình 6.Khởi động Apache MySQL - Sau khởi động xong, bạn truy cập vào địa website với địa là: httm://localhost:81/dashboard để thấy hiển thị trang giới thiệu XAMPP hình dưới: Hình 7.Cài đặt XAMPP thành cơng 1.5 Các bước cài đặt WordPress Localhost * Bước 1: Tải mã nguồn website WordPress.org Trước tiên bạn tải phiên mã nguồn WordPress địa chỉ: http://wordpress.org/latest.zip Sau bạn giải nén có thư mục mang tên “wordpress” Có thể thư mục wordpress lồng thư mục khác tên wordpress-x (x số hiệu phiên bản), nói chung bạn vào có thư mục wordpress hình dưới: Hình 8.File Wordpress tải giải nén Tiếp theo, truy cập vào thư mục wordpress, bạn thấy có số thư mục tên wp-admin, wp-includes, wp-content số tập tin tên index.php, wp-config-sample.php, Tất tập tin thư mục này, gọi mã nguồn WordPress Hình 9.File Wordpress *Bước 2: Copy mã nguồn WordPress vào Localhost Bây giờ, copy toàn file thư mục vào thư mục website bạn localhost (ví dụ: C:\xampp\htdocs\namnguyen) Nghĩa bạn copy file thư mục mã nguồn vào thư mục tiendung Hình 10 Copy mã nguồn WordPress vào Localhost (XAMPP) * Bước 3: Tạo database Để chạy WordPress localhost bạn phải có database dùng MySQL để lưu liệu mềm vào viết, thiết lập, web * Bước 4: Chạy website để cài đặt: Sau copy xong, mở bảng điều khiển xampp lên khởi động apache MySQL Sau truy cập vào website với đường dẫn: http://localhost:8888// Lúc này, bảng chọn ngồn ngữ cần cài đặt cho WordPress, chọn English ấn Continue Hình 11 Chọn ngôn ngữ cài đặt WordPress Ở bước nhắc nhở bạn chưa tiến hành đổi file wp-configsample.php thành wp-config.php khai báo thông tin database vào Hãy ấn Let’s Go để tự làm việc cho bạn Hình 12 Nhắc nhở trước cài đặt Và nhập thông tin database: Hình 13.Nhập thơng tin database Khi nhập xong thông tin database, ấn nút Submit để làm bước Nếu bước hình bạn nhập thơng tin database xác, ấn nút Run the install để bắt đầu cài đặt Hình 14 Bắt đầu trình cài đặt Ở bước cài đặt này, bạn cần phải thiết lập thông tin quan trọng cho website tên website, tên tài khoản admin, mật khẩu, Nhập xong ấn nút Istall WordPress Hình 15 Thiết lập thơng tin quan trọng cho website Và chữ Success! Như bạn thành công, click vào nút Log in để đăng nhập vào bảng quản trị WordPress Hình 16.Cài đặt thành cơng Wordpress Và giao diện trang quản trị WordPress (LocalHost) Hình 17 Trang quản trị WordPress (Localhost) 1.6 Chuyển trang web từ Localhost lên Hosting 1.6.1 Thông tin tên miền (Domain) Hình 18.Thơng tin tên miền 1.6.2 Thơng tin hosting Hình 19 Thơng tin hosting 1.6.3 Deploy trang web Đầu tiên, ta cần nén file namnguyen C:\xampp\htdocs thành file có đi.zip Hình 20.Nén file wordpress Tiếp theo, ta Export sử liệu từ trang: http://localhost:81/phpmyadmin/index.php? route=/database/structure&server=1&db=wordpress Hình 21.Export sở liệu localhost Sau export sở liệu, truy cập vào trang: https://host212.vietnix.vn:2083/cpsess9372961143/frontend/paper_lantern/sql/i ndex.html để bắt đầu tạo Database thực Add New User Hình 22 Tạo Database Cpanel Hình 23.Thêm User Cpanel Và sau đó, thực bước upload file Wordpress lên File Manager Cpanel Hình 24 Upload file Wordpress Ở bước tiếp theo, ta thực Import cho Database vừa tạo hình 2.22 Hình 25 Import sở liệu cho Database Để website nhận sở liệu deploy lên, ta cần phải thực bước Add User to Database MySQL Databases hình đây: Hình 26 Add User to Database Khi thực bước xong, ta cần phải cấu hình lại tên database, username database mật database ngư file wp-config.php File Manager Hình 27 Cấu hình lại wp-config.php Cuối bước thay đổi giá trị cột option_value từ: localhost:81/namnguyen sang tên miền đăng ký sử dụng nqshop.xyz wp_options database tạo trước Hình 28 Thay đổi tên miền CHƯƠNG II.THIẾT KẾ GIAO DIỆN VÀ KIỂM THỬ 2.1 Giao diện người dùng 2.1.1 Trang chủ 2.1.2 Blog Hình 29:Trang chủ Hình 30: Blog 2.1.3 Manga Hình 31:Manga 2.1.3 Liên hệ Hình 32: Liên hệ 2.1.4 Thơng tin chúng tơi Hình 33: Thông tin 2.2 Trang quản trị hệ thống Hình 33: Trang quản trị hệ thống Mơ tả: người quản trị sử dụng tài khoản để đăng nhập vào hệ thống Nhiệm vụ: giúp người quản trị bắt đầu với hệ thống 2.3 Thơng tin phần mềm 2.3.1 Giao diện sử dụng(theme) Hình 34: Giao diện sử dụng 2.3.2 Các plugin sử dụng Hình 35: Các plugin sử dụng KẾT LUẬN Kết nhóm em đạt được: * Đối với người dùng:  Các cách tìm kiếm, tra cứu theo truyện khác nhau, đọc truyện thân yêu thích  Xem mnoo tả sơ tóm tắt truyện  Cho phép khách hàng đăng ký thông tin để thực việc đọc theo dõi truyện  Kiểm tra tính hợp lệ khách hàng đăng nhập hệ thống  Yêu thích đánh giá truyện * Đối với người quản trị:  Xem thông tin đề mục cần quản lý như: Tài khoản, truyện, đăng truyện  Đưa form để nhập liệu loại truyện  Có thể sửa đổi, cập nhật liệu  Trong việc thêm sản phẩm chương trình tự động sinh mã sản phẩm, điều tiện lợi cho người quản trị liệu đồng  Các chức thực thông qua giao diện web Vấn đề website đọc sách on line Từ đó, bên cạnh việc đăng sách vấn đề cần phải tập trung thu hút khách hàng va quảng cáo để thêm thu nhập Do vậy, thời gian sau cần bổ sung chức năng: tối ưu tốc độ website Quản lý kho truyện (kiểm tra tên nội dung với độ khả dụng truyện) Bổ sung thêm số chức kiểm tra liệu nhập, thay đổi mật mã truy cập khách hàng nhà quản trị Mặc dù cố gắng hoàn chỉnh yêu cầu báo cáo em nhiều thiếu sót, em mong nhận bảo hướng dẫn thầy cô để giúp đỡ xem xét, đề xuất cho em thêm ý kiến bổ sung vấn đề phục vụ cho việc xây dựng website để em hồn chỉnh Em xin chân thành cảm ơn quý thầy cô! ... nghệ thông tin áp dụng vào thiết kế tạo dựng website giải trí quan trọng cần thiết.Vì em chọn đề tài:” Xây dựng website đọc truyện online? ?? em muốn tạo website kết nối người dùng với chương trình... để hỗ trợ người dùng tạo nhiều thể loại website khác blog, website tin tức/tạp chí, giới thiệu doanh nghiệp, bán hàng – thương mại điện tử, chí với loại website có độ phức tạp cao đặt phòng khách... thiết lập thông tin quan trọng cho website tên website, tên tài khoản admin, mật khẩu, Nhập xong ấn nút Istall WordPress Hình 15 Thiết lập thơng tin quan trọng cho website Và chữ Success! Như bạn