Cài đặt WordPress trên localhost với XAMPP

Cài đặt WordPress trên localhost với XAMPP

Để làm việc với WordPress dễ dàng hơn, chúng ta sẽ cài đặt XAMPP – một phần mềm giả lập máy chủ web. Thông qua XAMPP, chúng ta sẽ cài đặt được WordPress trên máy tính của mình.

Máy chủ web

Máy chủ web (web server) có thể dùng để nói về phần cứng (máy chủ) hoặc một phần mềm (hoạt động trên máy chủ) hoăc cả phần cứng lẫn phần mềm. Trong phạm vi bài viết, mình sẽ sử dụng thuật ngữ này để nói về một phần mềm chạy trên máy chủ.

Đơn giản, máy chủ web là các phần mềm hoạt động trên các máy chủ. Nhằm cung cấp dịch vụ WWW. Nó xử lý các yêu cầu (request) từ người dùng (client) thông qua giao thức HTTP.

web-server

Với ảnh mô tả này, chúng ta có thể hình dung một chu kỳ xử lý của máy chủ web:

  1. Người dùng sử dụng trình duyệt web, gõ địa chỉ cần truy cập. Trình duyệt web sẽ dựa trên địa chỉ đó, xử lý và gửi 1 yêu cầu (HTTP request) đến máy chủ web.
  2. Máy chủ web sẽ dựa trên yêu cầu từ người dùng. Xử lý các logic dựa trên các kịch bản được lập trình sẵn. Sau cùng phản hồi kết quả cho người dùng (HTTP Response).
  3. Dựa trên phản hồi từ máy chủ, trình duyệt web sẽ hiển thị nội dung cho người dùng.

XAMPP

Tổng quan XAMPP

XAMPP là một phần mềm mã nguồn mở được phát triển bởi Apache Friends. Nó được tích hợp sẵn các dịch vụ Apache, PHP, MySQL, FTP Server, Mail Server và các công cụ hỗ trợ như phpMyAdmin.

XAMPP là tết viết tắt của:

  • X – Cross-Platform (X có thể hiểu như là 1 biến, có thể là Linux, Windows hay MacOS…)
  • A – Apache (Máy chủ web)
  • M – MariaDB (Hệ quản trị cơ sở dữ liệu)
  • P – PHP (ngôn ngữ lập trình PHP)
  • P – Perl (ngôn ngữ lập trình Perl)

Nó có đầy đủ các thành phần cơ bản của một hệ thống máy chủ web. Với giao diện quản trị đơn giản, hiệu quả và dễ dàng sử dụng. XAMPP là sự lựa chọn hàng đầu giúp lập trình viên xây dựng một máy chủ web locak để phát triển và kiểm thử web của mình.

Cài đặt XAMPP

Để cài đặt XAMPP cũng rất đơn giản, dưới đây là một số bước minh họa quá trình cài đặt.

Bước 1: Tải mã nguồn. Chúng ta truy cập trực tiếp vào trang chủ của nó. Sẽ thấy ngay khu vực download.

Download XAMPP

Bước 2: Mở trình cài đặt XAMPP vừa download về. Tiến hành cài đặt.

Cài đặt XAMPP - 1
Cài đặt XAMPP – 1
Cài đặt XAMPP - 2
Cài đặt XAMPP – 2
Cài đặt XAMPP - 3
Cài đặt XAMPP – 3
Cài đặt XAMPP - 4
Cài đặt XAMPP – 4
Cài đặt XAMPP - 5
Cài đặt XAMPP – 5
Cài đặt XAMPP - 6
Cài đặt XAMPP – 6
Cài đặt XAMPP - 7
Cài đặt XAMPP – 7
Cài đặt XAMPP - 8
Cài đặt XAMPP – 8

Bước 3: Khởi động XAMPP và tiến hành cài đặt các dịch vụ. Để làm việc với WordPress, tối thiểu chúng ta cần Apache và MySQL. Chúng ta sẽ bấm vào dấu ‘X’ để tiến hành cài đặt 2 dịch vụ này.

Cài đặt dịch vụ trên XAMPP

Nếu không có gì trở ngại, hệ thống sẽ cài đặt vào thông báo cho chúng ta kết quả.

Cài đặt dịch vụ trên XAMPP thành công

Bước 4: Khởi động dịch vụ. Chúng ta cần khởi động 2 dịch vụ Apache và MySQL. Ở giao diện quản trị, chúng ta click vào 2 button ‘Start’.

Khởi động dịch vụ

Nếu khởi động thành công, ở tên dịch vụ có màu xanh lá cây và log thông báo như hình.

Khởi động thành công

Ngược lại, tên dịch vụ có màu đỏ và hiển thị log.

khởi động dịch vụ bị lỗi

Khi xuất hiện lỗi này, các bạn có thể search google để tìm cách khắc phục. Nhưng trước hết hãy đọc những lưu ý bên dưới nhé. Chúng ta cũng có hướng giải quyết rất nhanh gọn.

Bước 5: Kiểm tra thành quả. Nếu ở bước 4 bạn không gặp lỗi, thì port mặc định của HTTP là 80. Nếu bạn có thay đổi theo hướng dẫn bên dưới, thì port sẽ là con số bạn điền vào file cấu hình. Mở trình duyệt lên, gõ vào thanh địa chỉ: “localhost:port”. Ví dụ mình đổi port thành 8888. Vậy, địa chỉ của mình sẽ là “localhost:8888”.

Hoàn thành việc cài đặt XAMPP
Hoàn thành việc cài đặt XAMPP

Một số vấn đề cơ bản khi sử dụng XAMPP

Phiên bản PHP và MariaDB

Phiên bản của ngôn ngữ PHP và hệ quản trị CSDL MariaDB sẽ phụ thuộc vào phiên bản XAMPP mà chúng ta sử dụng. Nếu máy bạn có sẵn XAMPP rồi, nhưng quá cũ. Hãy update hoặc tháo ra cài lại để có thể sử dụng những tính năng mới nhất từ PHP và MariaDB.

Port

Có lẽ khái niệm này sẽ khá xa la với một số bạn. Để dễ hiểu hơn chúng ta cùng tưởng tượng. Có 1 trung tâm thương mại vô cùng lớn. Mặc dù nó rất lớn, nhưng nó cũng chỉ có 1 địa chỉ thôi. Và để giữ trật tự, người ta sẽ xây dựng các cổng khác nhau. Sẽ có cổng riêng cho khách hàng, cổng riêng cho nhân viên và cổng riêng cho đội ngũ giao hàng…vv Trên máy tính của chúng ta cũng vậy. Sẽ có rất nhiều dịch vụ chạy trên cùng một máy tính. Tuy nhiên, máy chúng ta thường chỉ có 1 IP duy nhất. Do đó, người ta thiết kế thêm khái niệm port. Để hệ thống xác định chính xác gói tin của dịch vụ nào trên máy chúng ta.

Port là một giá trị số nguyên nằm trong đoạn [0, 65535]. Người ta thường chia nhỏ nó thành 3 đoạn nhỏ hơn, với ý nghĩa khác nhau:

  • [0, 1023] được gọi là port phổ biến (Well Know): các ports trong đoạn này thường sử dụng cho các dịch vụ thông dụng như web, email, FTP, SSH, SQL …vv
  • [1024-49151] được gọi là port đăng ký (Registered): các ports trong đoạn này có thể được các nhà phát triển phần mềm mới đăng ký.
  • [49152-65535] được gọi là port riêng (Private): các ports này không được quản lý bởi IANA, chúng ta có thể tự do sử dụng port này cho mục đích riêng.

Sửa lỗi trùng port

XAMPP sẽ xử dụng các port mặc định như 80 (HTTP), 443 (HTTPS), 3306 (MariaDB). Tuy nhiên, có thể một số phần mềm khác trên máy chúng ta đang sử dụng các port này. Do đó, để tránh mâu thuẫn giữa các phần mềm, hệ thống sẽ chặn việc XAMPP khởi động các dịch vụ liên quan.

Như ví dụ phía trên phần cài đặt, hệ thống báo port 443 đã bị sử dụng bởi 1 ứng dụng khác. Hoặc các bạn có thể thấy thông báo tương tự với port 80. Vậy để đơn giản, thông thường mình sẽ đổi port HTTP thành 8000 (hay 8080 hoặc 8888). Đổi port HTTPS thành 8443. Để đổi được port của 2 giao thức này, chúng ta có thể thao tác như sau:

Bước 1: Chọn config dịch vụ tương ứng.

config port HTTP

Các bạn sẽ thấy rất nhiều lựa chọn. Chúng ta chỉ quan tâm tới 2 dòng đầu:

  • Apache (httpd.conf) cho HTTP
  • Apache (httpd-ssl.conf) cho HTTPS

chúng ta sẽ lần lượt cập nhật từng file nhé.

Bước 2: Mở file cấu hình. Tùy vào giao thức chúng ta muốn cập nhật sẽ click vào menu dịch vụ ở bước 1. Lúc này file cấu hình sẽ được mở lên. Lưu ý, file này rất quan trọng, nên nếu cẩn thận các bạn có thể copy/paste để lưu nội dung ban đầu, phòng trường hợp thao tác sai.

File cấu hình

Bước 3: Điều chỉnh port. Tùy dịch vụ, chúng ta sẽ dùng chức tăng tìm kiếm (Ctrl + F) để tìm các port mặc định. Ví dụ, mình đang mở file httpd.conf port mặc định bằng 80. Mình sẽ tìm toàn bộ giá trị 80 thay bằng 8888

cập nhật port

Với file httpd-ssl mình sẽ tìm port 443 đổi thành 8443. Sau đó lưu lại, và khởi động lại dịch vụ apache.

htdocs

Thư mục htdocs nằm ở đường dẫn “xampp\htdocs”. Đây là thư mục gốc (DocumentRoot) của XAMPP. Hiểu một cách đơn giản, đây là thư mục chứa mã nguồn của chúng ta trên máy chủ web.

Cài đặt WordPress với XAMPP

Cũng tương tự với việc cài đặt WordPress trên cPanel. Để cài đặt WordPress trên XAMPP, chúng ta cũng cần các bước cơ bản như: chuẩn bị mã nguồn WordPress, tạo CSDL và cài đặt. Các bước cài đặt sẽ được minh họa bên dưới:

Bước 1: Tải mã nguồn WordPress. Truy cập trang download WordPress và tải bản mới nhất về máy.

Download WordPress

Bước 2: Giải nén mã nguồn WordPress, tạo thư mục web (blog_wp) và copy/paste toàn bộ mã nguồn WordPress vào đây.

Tạo thư mục WP

Và copy/paste mã nguồn WordPress vào folder này.

Cài đặt mã nguồn WP

Bước 3: Khởi tạo CSDL. Chúng ta cần truy cập vào dịch vụ phpMyAdmin để tạo mới 1 CSDL.

Khởi tạo CSDL - 1
Khởi tạo CSDL – 1
Khởi tạo CSDL - 2
Khởi tạo CSDL – 2
Khởi tạo CSDL - 3
Khởi tạo CSDL – 3

Bước 4: Tiến hành cài đặt WordPress. Lúc này, đường dẫn đến trang web của chúng ta sẽ là: “localhost:port/folder_name”. Trong ví dụ của mình, port là 8888 và folder chứa mã nguồn là “blog_wp”. Vậy url sẽ là “localhost:8888/blog_wp”

Cài đặt WordPress - 1
Cài đặt WordPress – 1
Cài đặt WordPress - 2
Cài đặt WordPress – 2
Cài đặt WordPress - 3
Cài đặt WordPress – 3
Cài đặt WordPress - 4
Cài đặt WordPress – 4
Cài đặt WordPress - 5
Cài đặt WordPress – 5
Cài đặt WordPress - 6
Cài đặt WordPress – 6

Bước 5: Kiểm tra trang web của chúng ta.

Kiểm tra Login
Kiểm tra Login
Login thành công
Login thành công
Kiểm tra giao diện trang chủ
Kiểm tra giao diện trang chủ

Như vậy, chúng ta đã cài đặt XAMPP thành công. Qua đó, chúng ta cài đặt thành công WordPress trên XAMPP. Trong các bài kế tiếp, chúng ta sẽ xây dựng các trang blog và trang web TMDT nhỏ, dựa trên nền tảng WordPress.