BTL mã nguồn mở web tin tức bóng đá

Mã Nguồn Mở...........................................................................................................................................................................................................................................................................................................................................................................................................................

TRƯỜNG ĐẠI HỌC CÔNG NGHIỆP HÀ NỘI

KHOA CÔNG NGHỆ THÔNG TIN - -

BÁO CÁO BÀI TẬP LỚN

Hà Nội, Năm 2020

Nhận thức được nhu cầu tìm hiểu thông tin, giải trí của xã hội, là sự ra đời của hàng loạt website cho các mục đích thương mại, giải trí, tin tức,… Để đáp ứng với việc cập nhật thông tin hàng ngày, tình hình xã hội, chính trị, thời sự, và sức khỏe,

… thì website tin tức ra đời là một nhu cầu tất yếu

Do đó, nhóm em đã vận dụng Wordpress để xây dựng ứng dụng Website Tin tức bóng đá

2

Mục Lục

Chương 1:Tổng quan

1. Giới thiệu về website tin tức

“Tin tức tích lũy trong mỗi chúng ta được gọi là kiến thức, tài sản quý giá nhất của con người”

Với sự bùng nổ thông tin trên internet, vai trò của các trang thông tin điện tửtrực tuyến càng trở nên quan trọng Khác với báo chí truyền thông có giớihạn thời gian cập nhật tin tức, các tờ báo trực tuyến đã cung cấp được sự tiệnlợi trong việc cập nhật và phát hành thông tin Về phía người dùng, họ có thểxem thông tin mọi lúc mọi nơi Về phía những người cung cấp thông tin, cácnhà báo, họ có thể dễ dàng cập nhật những tin tức mới nhất, thời sự nhất Do

đó việc sử dụng các trang thông tin trực tuyến luôn là điều cần thiết hiện naynhằm đáp ứng nhu cầu cập nhật thông tin của mỗi người

Tin tức là những việc đã xãy ra dù tốt dù xấu, để giúp con người biết nhữngchuyện xung quanh và trên Thế giới.Ngày nay nhờ thông tin truyền thôngnhanh,cho nên bất cứ chuyện gì vừa xãy ra ở đâu trên thế giới thì ta đều cóthể biết ngay, nhờ đó mà có thể học được nhiều cái hay

Tin tức vô cùng quan trọng nó cho người ta tri thức và là cơ sở để người ta tiến hành mọi việc lớn nhỏ Khi có Internet, tin tức càng quan trọng vì tốc độlan truyền nhanh ảnh hưởng ngay tức thì trên diện rộng

2. Mục tiêu website

- Giúp người đọc dễ dàng tiếp cận, tìm kiếm các thông tin nổi bật

- Tin tức được cập nhật thường xuyên

3. Một số phần mềm được sử dụng

- Sử dụng ngôn ngữ PHP và hệ quản trị CSDL MySql

4

- WordPress được phát triển nhằm phục vụ đối tượng người dùng phổthông Không cần có quá nhiều kiến thức về lập trình hay website nângcao Vì các thao tác trong WordPress rất đơn giản Giao diện quản trị trựcquan, giúp bạn có thể nắm rõ cơ cấu quản lý một website WordPresstrong thời gian ngắn.

1.2. Một số ưu nhược điểm của Wordpress

- Ưu điểm:

 Chi phí phù hợp hoàn hảo cho các doanh nghiệp vừa và nhỏ

 Thích hợp cho những người mới tạo và quản lý trang web

 Máy chủ chia sẻ không giới hạn ở WordPress

1.3. Lý do nên sử dụng Wordpress

- Dễ sử dụng:

 Wordpress được phát triển nhằm phục vụ đối tượng người dùng phổbiến, không có nhiều kiến thức về lập trình website nâng cao Cácthao tác trong Wordpress đơn giản, giao diện quản trị trực quan giúpbạn có thể nắm rõ cơ cấu quản lý của 1 website WordPress trong thờigian ngắn

- Cộng đồng hỗ trợ đông đảo:

 Là một mã nguồn CMS mở phổ biến nhất thế giới, điều này cũng cónghĩa bạn sẽ được nhiều người hỗ trợ khi gặp khó khăn trong quátrình sử dụng

- Nhiều gói giao diện có sẵn:

 Trong WordPress , khái niệm giao diện cho website Wordpress thườngđược gọi là theme Hiện nay thì có rất nhiều theme miễn phí khácnhau giúp dễ dàng thay đổi giao diện cho website của mình

- Nhiều Plugin hỗ trợ:

 Plugin là một trình cắm thêm vào website để bạn có thể bổ sung cácchức năng mà bạn cần

- Dễ phát triển cho lập trình viên:

- Có thể làm nhiều loại website:

2. Cài đặt localhost trên máy tính để tìm hiểu WordPress

2.1. Cài đặt localhost trên máy tính với XAMPP

*Localhost là gì?

- Localhost là từ ghép của hai chữ “local” và “host” Local theo định nghĩa IT

là máy tính của bạn, host theo định nghĩa IT là máy chủ Vậy localhost nghĩa

là một máy chủ được vận hành trên máy tính của bạn

- Localhost bao gồm nhiều ứng dụng đi kèm với nhau và tất cả các ứng dụng

đó sẽ kết hợp với nhau để tạo ra một môi trường có thể chạy mã nguồnWordPress trên máy tính của bạn bao gồm:

+ Phần mềm Webserver tên Apache, đây là webserver thông dụng nhất.+ Phần mềm PHP để xử lý PHP vì WordPress viết bằng ngôn ngữ PHP

+ Phần mềm MySQL Server để lưu trữ dữ và xử lý cơ sở dữ liệu, doWordPress sử dụng MySQL làm nền tảng cơ sở dữ liệu (database)

+ Phần mềm PHPMyAdmin để xem và quản lý cơ sở dữ liệu MySQL

*Localhost vận hành như thế nào:

- Khi cài đặt Localhost vào máy tính rồi, thì máy tính của bạn đã có một phần mềm Webserver để chạy ứng dụng website với địa chỉ là http://127.0.0.1 Đây là địa chỉ IP dạng localhost, ngoài ra bạn cũng có thể chạy localhost với đường dẫn là

http://localhost thông thường khi cài đặt Localhost, mỗi khi cần sử dụng bạn sẽ cần

6

mở bảng điều khiển của localhost lên và kích hoạt nó khỏi động các ứng dụng đi kèm.

- Lưu ý trước khi cài đặt:

+ Xóa toàn bộ ứng dụng liên quan tới localhost: Nếu bạn có cài đặt các phầnmềm khác liên quan đến việc làm localhost như PHP, MySQL thì hãy xóa hết

Và bạn không nên cài XAMPP trên Windows Server đã cài đặt IIS

+ Tắt tường lửa: Nếu máy tính của bạn có cài đặt tường lửa từ Windows hay

từ một phần mềm Antivirus nào khác thì hãy tắt nó đi vì nó có thể sẽ chặncổng 80 hoặc các ứng dụng webserver

+ Tắt UAC trên Windows: Nếu máy tính của bạn đang dùng window và cóbật chức năng User Account Control thì hãy tắt nó đi khi dùng localhost đểtránh các vấn đề giới hạn quyền

* Hướng dẫn cài đặt Localhost:

- Để cài đặt Localhost chúng ta có rất nhiều cách và phần mềm, ở đây chúng

ta xử dụng XAMPP để cài đặt localhost vì:

+ XAMPP hoàn toàn miễn phí

+ Dễ sử dụng

+ Hỗ trợ các hệ điều hành thông dụng như Windows, Mac, Linux

- Để tải XAMPP, đầu tiên ta truy cập vào địa chỉ:

https://www.apachefriends.org và chọn phiên bản XAMPP phù hợp với hệ điềuhành với máy tính đang sử dụng, và chúng ta nên chọn phiên bản PHP 5.4.31.Lưu ý XAMPP chỉ có phiên bản cho hệ điều hành 32bit nhưng 64bit vẫn hoạtđộng bình thường

- Sau khi tải file cài đặt về xong, hãy chạy nó, sau đó chọn Next.

8

- Ở phần chọn đường dẫn, bạn hãy chọn đường dẫn lưu cài đặt của XAMPP.Lưu ý rằng đường dẫn này bạn phải nhớ vì khi cài đặt web lên localhost bạnphải truy cập vào thư mục này Bạn nên để mặc định là c:\xampp Tiếp tục bấm

“Next”

- Ở trang kế tiếp bạn bỏ chọn phần “Lear more about Bitnami for XAMPP” và

ấn “Next” 2 lần nữa để hoàn tất quá trình cài đặt

- Sau khi cài xong ấn nút “Finish” để kết thúc quá trình cài đặt và mở bảngđiều khiển của XAMPP Tuy nhiên hãy khởi động lại máy sau khi cài đặt xong

để tránh tình trạng không khởi động được localhost

- Khởi động Localhost:

+ Bây giờ bạn hãy vào thư mục C\xampp và mở file xampp-panel.exe lên đểbật bảng điều khiển của XAMPP

10

Bảng điều khiển của XAMPP

- Bạn để ý sẽ thấy hai ứng dụng Apache và MySQL có nút Start, đó là dấu hiệubảo 2 ứng dụng này chưa được khởi động, hãy ấn vào nút Start của từng ứngdụng để khởi động webserver Apache và MySQL Server lên thì mới chạy đượclocalhost

- Nếu cả hai ứng dụng chuyển sang màu xanh như hình dưới là đã khởi độngthành công

- Sau khi khởi động xong, bạn hãy truy cập vào địa chỉ website với địa chỉ là:httm://localhost để thấy nó hiển thị ra trang giới thiệu XAMPP như hình dưới:

12

Sau khi cài đặt xong một localhost hoàn chỉnh rồi, bây giờ chúng ta có thể tiến hành cài đặt WordPress vào localhost để khởi tạo một website trên mạng host ảo của mình nhé.

2.2. Các bước cài đặt WordPress trên Localhost

* Bước 1: Tải mã nguồn website WordPress.org

Trước tiên bạn hãy tải phiên bản mới nhất của mã nguồn WordPress tại địachỉ:

http://wordpress.org/latest.zip

Sau đó bạn giải nén ra sẽ có được một thư mục mang tên “wordpress” Có thể thư mục wordpress này sẽ được lồng trong một thư mục khác tên là wordpress-x (x ở đây là số hiệu phiên bản), nhưng nói chung bạn cứ vào sẽ có được một thư mục wordpress như hình dưới:

Thư mục sau khi giải nén mã nguồn.

Tiếp theo, hãy truy cập vào thư mục wordpress, bạn sẽ thấy có một số thư mục tên

là admin, includes,content và một số tập tin tên là index.php,

wp-config-sample.php, Tất cả các tập tin và thư mục này, chúng ta gọi nó là mã

nguồn WordPress

*Bước 2: Copy mã nguồn WordPress vào Localhost.

Bây giờ, hãy copy toàn bộ file và thư mục này vào thư mục website của bạn trong localhost (ví dụ: C:\xampp\htdocs\toan) Nghĩa là bạn chỉ copy các file và thư mục mã nguồn vào thư mục toan

14

* Bước 3: Tạo một database mới.

Để chạy được WordPress thì localhost của bạn phải có một database dùng MySQL để nó có thể lưu các dữ liệu mềm vào đó như bài viết, các thiết lập, trên web

* Bước 4: Chạy website để cài đặt:

Sau khi copy xong, hãy mở bảng điều khiển của xampp lên và khởi động apache và MySQL Sau đó truy cập vào website với đường dẫn:

http://localhost:8888/toan

Lúc này, nó sẽ hiện ra bảng chọn ngồn ngữ cần cài đặt cho WordPress, hãy chọn là English và ấn Continue

3.

Chọn ngôn ngữ khi cài đặt WordPress.

Ở bước tiếp theo nó sẽ nhắc nhở bạn là chưa tiến hành đổi file

wp-config-sample.php thành wp-config.php và khai báo thông tin database vào đso Hãy ấn

Let’s Go để nó tự làm việc đó cho bạn.

16

Và bây giờ là nhập thông tin database:

Khi nhập xong thông tin database, hãy ấn nút Submit để làm bước tiếp theo.Nếu bước kế tiếp nó hiện ra như hình dưới thì bạn hãy nhập thông tin databasechính xác, hãy ấn nút Run the install để bắt đầu cài đặt.

Ở bước cài đặt này, các bạn sẽ cần phải thiết lập các thông tin quan trọng chowebsitenhư tên của website, tên tài khoản admin, mật khẩu, Nhập xong hãy

ấn nút Istall WordPress

18

Và nếu nó hiện chữ Success! Như thế này là bạn đã thành công, click vào nútLog in để đăng nhập vào bảng quản trị WordPress.

Và đây là giao diện trang quản trị WordPress.

Khi chúng tra truy cập vào địa chỉ: http://localhost :8888 / toan nó sẽ ra trangchủ có giao diện:

20

Như vậy là chúng ta đã cài đặt thành công WordPress Việc tiếp theo là chúng

ta sẽ đi xây dựng website “Tin Tức Bóng Đá”

2.3.Xây dựng trang web “Tin tức Bóng Đá”

* Để xây dựng được một trang web sử dụng WordPress trước hết cần lựa chọn một themes phù hợp với nội dụng của trang web muốn trình bày Chúng ta có thể sử dụng theme có sẵn trên trang wordpress.org hoặc có thể sử dụng các theme trả phí được bán trên mạng Ở đây chúng ta sẽ sử dụng theme “Elegant Pink” để trình bày trang web “tin tức bóng đá”

- Website tin tức du lịch cung cấp các thông tin về lĩnh vực du lịch, ẩm thực, đến người dùng Khi người dùng truy cập vào trang web có thể dễ dàng tìm thấy các thông tin

- Sau khi đã lựa chọn được cho mình một theme thích hợp Chúng ta sẽ đi xây dựng trang web như ý muốn

- Trang web tin tức du lịch sẽ bao gồm các bài viết, mỗi bài biết thuộc các chuyên mục khác nhau Để tạo các chuyên mục và bài viết ta chỉ cần thực hiện các thao tácclick chuột và lựa chọn trong các menu của trang admin.

- Để thêm một chuyên mục ta lựa chọn Post > Category > Add new Category sau

đó nhập tên của chuyên mục và ấn nút “add new”

Sau khi đã tạo được các chuyên mục chúng ta sẽ đi viết bài tin tức thuộc các

chuyên mục đó

Giao diện viết bài viết mới:

22

Sau khi có các bài viết và các chuyên mục Chúng ta sẽ đi bố cục cách hiển thị các bài viết và tuy chỉn giao diện trang tin tức theo ý muốn.

Để làm cho trang web hiển thị đẹp hơn, có nhiều chức năng hơn chúng ta có thể sử dụng thêm các plugin hỗ trợ:

Sau đó chúng ta sẽ đi tuy chỉnh lại cách hiển thị của các bài viết, sử dụng các

plugin để cho trang web đẹp hơn

Đây là giao diện trang chủ:

24

- Website tin tức du lịch cung cấp các thông tin về lĩnh vực thể thao bóng đá, đến người dùng Khi người dùng truy cập vào trang web có thể dễ dàng tìm thấy các thông tin cần thiết và bổ ích Các thông tin về bóng đá, tình hình bóng đá của các quốc gia và đội tuyển được cập nhật liên tục.

Bên cạnh đó người dùng còn có thể tìm thấy các danh lam thắng cảnh ở việt nam

và trên thế giới

26

Chuyên mục khám phá sẽ đưa đến bạn các thông tin về bóng đá hấp dẫn ở Việt Nam và trên toàn thế giới.

Tiếp theo là chuyên mục Cúp sẽ đem đến cho bạn thông tin về nhiều món ăn, đặc sản nổi tiếng

Ngoài việc tìm kiếm thông tin trong các bài viết, người đọc còn có thể để lại nhữngbình luận, những ý kiến đóng góp của mình để chia sẻ những thông tin với người dùng khác qua phần bình luận tại mỗi bài viết.

28

Người dùng cũng có thể gửi các ý kiến đóng góp, phản hồi đến admin để cải thiện

và phát triển trang web

Chương 3: Thiết kế hệ thống

1. Cơ sở dữ liệu

- Bảng wp commentmeta – Mỗi bình luận có một thông tin gọi là

metadata, thông tin này đặt trong phần này:

- Bảng wp comments – Mọi bình luận trong WordPress sẽ được lưu trong

bảng này:

30

- Bảng wp links – Phần này chứa thông tin liên quan đến link mà bạn nhập

khi sử dụng tính năng Links của

WordPress:

- Bảng wp options – Phần này chứa các thông tin cấu hình của

WordPress:

- Bảng wp postmeta – Mỗi bài viết có một thông tin duy nhất gọi là

metadata, thông tin này sẽ được lưu bảng này:

- Bảng wp posts – Trong WordPress, “posts” là bài viết bạn viết trên blog

Bảng này lưu thông tin này, Pages và Menu điều hướng cũng được lưu tạiđây:

32

- Bảng wp termmeta – Mỗi term có thông tin duy nhất gọi là metadata,

thông tin đó sẽ được lưu trong phần này:

- Bảng wp terms – Categories cho bài viết, links và tags được lưu tại

đây:

- Bảng wp term relationships – Categories và tag từ trong bảng wp_terms

sẽ lưu các mối liên hệ của nó tại bảng này:

- Bảng wp term taxonomy – Bảng này mô tả taxonomy (category, link, và

tag) cho các dữ liệu trong bảng wp_terms:

- Bảng wp usermeta – Mỗi người dùng có thông tin duy nhất gọi là

metadata, thông tin này được lưu tại bảng wp usermeta này:

34

- Bảng wp users – Người dùng được lưu trong bảng này:

2. Cấu trúc website

- Phần Header:

- Phần Menu ngang:

- Phần Menu dọc:

- Phần Tin tức mới:

36

- Phần Content:

- Phần Fooster:

- Giao diện trang admin:

38

Chương 4: Kết luậnVới kiến thức hiện có của mình, chúng em đã hoàn thành bài tập này, chúng

em đã cố gắng thực hiện như các yêu cầu ở trên khi tiến hành xây dựng trang tintức thể thao Hệ thống còn một số chức năng chưa thực hiện được Đây là hướngphát triển trong tương lai Tuy nhiên, trong quá trình làm sẽ không tránh khỏinhững thiếu sót, hoặc cũng sẽ có những chỗ còn vướng mắc, chính vì vậy,chúng

em mong được sự góp ý giúp đỡ của thầy giáo, để bài này được hoàn thiện hơn !

Chúng em xin gửi lời cảm ơn chân thành tới giảng viên Trần Thanh Huân làgiảng viên giảng dạy môn phần mềm mã nguồn mở của lớp HTTT – K11 đã tậntình hướng dẫn hoàn thành đề tài này!

Chúng em xin chân thành cảm ơn.!