Hướng dẫn thao tác trên Xampp

Localhost là một môi trường lí tưởng để test Blog và website mà bạn không cần mạng Internet. Thông thường người dùng thường sử dụng Xampp hoặc Wamp để tạo Localhost trên máy tính của mình. Trong đó Xampp luôn có lá phiếu được dùng nhiều nhất. Trong bài viết này chúng tôi sẽ hướng dẫn các bạn thao tác trên Xampp và giúp bạn khám phá thêm những tiện ích được tích hợp trên Xampp.

  1. Làm việc với thư mục và tập tin

Một điều khá cơ bản nhưng rất quan trọng khi bạn làm việc với website mà bất kể là localhost hay hosting đó là hiểu cơ chế phân thư mục của WordPress.

Bây giờ bạn hãy vào thư mục C:\xampp\htdocs\ và tạo một thư mục tên “thuemaychu.local“, thư mục này sẽ chứa website của mình.

Như ở trên, mình đã hướng dẫn bạn tạo một thư mục tên là thuemaychu.local và bạn có thể sử dụng đường dẫn http://localhost/thuemaychu.local để chạy. Vậy bây giờ mình có thể nói, thư mục C:\xampp\htdocs\thuemaychu.local chính là thư mục gốc của tên miền http://localhost/thuemaychu.local

Bây giờ bạn thử copy một file hình ảnh nào đó vào trong thư mục C:\xampp\htdocs\thuemaychu.local rồi chạy tên miền http://localhost/thuemaychu.local, bạn sẽ thấy nó liệt kê file mà bạn vừa copy vào.

Nếu bạn click vào file ảnh đó thì trình duyệt sẽ hiển thị ảnh với đường dẫn là http://localhost/thuemaychu.local/Chrysanthemum.jpg. Đây được xem là một link ảnh trong website của bạn.

Tương tự, hãy thử tạo một thư mục bất kỳ rồi copy một file ảnh nào đó vào, thì bây giờ bạn có thể truy cập xem ảnh với đường dẫn là http://localhost/thuemaychu.local/tên-folder/file.jpg.

Như vậy bạn có thể hiểu, cái đường dẫn trên website nó sẽ phân thứ cấp tùy theo cấu trúc thư mục và file trong đó.

  1. Tạo cơ sở dữ liệu MySQL (Database)

Thao tác này bạn sẽ phải làm trong bước cài đặt WordPress trên localhost nhưng ở đây mình sẽ hướng dẫn trước để bạn có thể làm thử luôn.

Khi nhắc đến database, bạn phải nhớ là nó bao gồm 3 thành phần chính là:

Tên user của database.

Mật khẩu của user database.

Tên database.

Database Host (thường thì điền là localhost, bất kể là bạn dùng ở localhost hay host bình thường).

Bạn hãy tưởng tượng rằng, user của database sẽ có nhiệm vụ đọc và ghi dữ liệu vào database nên khi sử dụng các mã nguồn PHP, bạn phải khai báo cùng lúc cả user của database và tên database.

Đối với localhost, bạn không cần tạo user cho database mà sẽ sử dụng thông tin user như sau:

Tên user database: root

Mật khẩu: bỏ trống

Do vậy, chúng ta chỉ cần tạo database là đủ.

Để tạo database, bạn hãy truy cập vào localhost với đường dẫn http://localhost/phpmyadmin. Sau đó bạn nhấp vào menu Databases.

Sau đó ở phần Create database, bạn nhập tên database cần tạo vào ô Database name, phần Collation bạn hãy chọn là utf8_unicode_ci như hình dưới rồi ấn nút Create kế bên.

Tạo xong hãy nhìn bên menu tay trái, nếu nó xuất hiện tên database vừa tạo là thành công. Vậy bây giờ, chúng ta tạm có một databse với các thông tin như:

Database Host: localhost

Database user: root

Database password: trống

Database name: thuemaychublog

Còn cách sử dụng với nó như thế nào thì mình sẽ nói ở bước cài WordPress cho thực tế.

Cách dùng Localhost nâng cao

Các hướng dẫn ở dưới đây có thể sẽ hơi phức tạp và rườm rà nên bạn có thể bỏ qua nếu chưa thật sự hiểu về localhost, bạn có thể nhảy qua phần Cài đặt website WordPress trên localhost để bắt đầu bài tiếp theo.

Thêm tên miền ảo vào Localhost trong XAMPP

Mặc định localhost sẽ chạy với tên miền là http://localhost, http://localhost/website1, http://localhost/website2,…Như thế có vẻ hơi bất tiện và không chuyên nghiệp lắm.

Bạn có thể thay domain đó thành một domain ảo khác như thuemaychu.local chẳng hạn.

Bước 1. Thiết lập tên miền ảo trỏ về IP 127.0.0.1

Mặc định bạn có thể chạy được tên miền http://localhost là do Windows nó đã trỏ sẵn cái tên này về IP 127.0.0.1, do đó nếu bạn muốn dùng một tên miền khác như thuemaychu.local thì cũng phải trỏ nó về IP này.

Bạn vào thư mục C:\Windows\System32\drivers\etc và ấn chuột phải vô file hosts rồi chọn Properties.

Sau đó chuyển qua tab Security và ấn Edit như ảnh dưới.

Sau đó chọn Users và ấn chọn Full Control như ảnh dưới.

Sau đó lưu lại, và mở file hosts ra rồi chèn đoạn này vào cuối file rồi lưu lại.

127.0.0.1     thuemaychu.local

Bạn có thể sửa lại tên miền mà bạn cần chèn vào localhost.

Bước 2. Thêm tên miền vào Localhost (VirtualHost)

Để thêm tên miền ảo, đầu tiên là bạn vào thư mục c:\xampp\htdocs và tạo một thư mục dành riêng cho tên miền ảo đó, ví dụ như thuemaychu.local/.

Sau đó mở bảng điều khiển của XAMPP lên, click vào nút Config của Apache và chọn <Browse> [Apache].

Sau đó vào thư mục conf/extra và mở file httpd-vhost.conf  bằng Notepad++ hoặc Notepad

Tìm:

##NameVirtualHost *:80

Xóa 2 dấu ## cho thành

NameVirtualHost *:80

Và thêm đoạn này vào cuối file:

<VirtualHost *:80>

    ServerAdmin contact@thuemaychu.com

    DocumentRoot “C:/xampp/htdocs/thuemaychu.local”

    ServerName thuemaychu.local

    ErrorLog “logs/thuemaychu.local-error.log”

    ##CustomLog “logs/dummy-host2.example.com-access.log” common

</VirtualHost>

Trong đó, bạn cần sửa lại các thông tin sau:

ServerAdmin: Email của bạn.

DocumentRoot: Đường dẫn tới thư mục mà bạn vừa tạo trong htdocs.

ServerName: Tên miền ảo cần sử dụng.

ErrorLog: Đường dẫn lưu file thống kê lỗi trong website.

Và thêm đoạn này vào nữa vì nếu không thêm thì khi bạn gõ http://localhost nó sẽ không ra trang quản trị Localhost như lúc đầu:

<VirtualHost *:80>

ServerAdmin contact@thuemaychu.com

DocumentRoot “C:/xampp/htdocs”

ServerName localhost

ErrorLog “logs/local-error.log”

##CustomLog “logs/dummy-host2.example.com-access.log” common

</VirtualHost>

Sau đó lưu lại, vào bảng điều khiển XAMPP ấn Stop hết rồi ấn Start lại.

Bây giờ hãy thử truy cập vào tên miền vừa thêm, nếu nó hiển thị ra trang như ở dưới thì thành công.

Đây là một mẫu thêm nhiều domain vào localhost:

<VirtualHost *:80>

    ServerAdmin contact@thuemaychu.com

    DocumentRoot “C:/xampp/htdocs”

    ServerName localhost.dev

    ServerAlias www.localhost.dev

    ErrorLog “logs/dummy-host.example.com-error.log”

    ##CustomLog “logs/dummy-host.example.com-access.log” common

</VirtualHost>

<VirtualHost *:80>

    ServerAdmin contact@thuemaychu.com

    DocumentRoot “C:/xampp/htdocs/domain1.local”

    ServerName domain1.local

    ServerAlias www.domain1.local

    ErrorLog “logs/domain1.local-error.log”

    ##CustomLog “logs/dummy-host2.example.com-access.log” common

</VirtualHost>

<VirtualHost *:80>

    ServerAdmin ezit92@gmail.com

    DocumentRoot “C:/xampp/htdocs/domain2.local”

    ServerName domain2.local

    ServerAlias www.domain2.local

    ErrorLog “logs/domain2.local-error.log”

    ##CustomLog “logs/dummy-host2.example.com-access.log” common

</VirtualHost>

Note: Nếu bạn đổi cổng 80 thành một cổng khác như hướng dẫn phía dưới thì toàn bộ số 80 trong file vhost.conf này đều thay thành cổng đã đổi và truy cập với tên miền domain1.local:8080 (trong đó, 8080 là cổng webserver mới).

Hẳn bạn đã hiểu được phần nào về chức năng trên phần mềm Xampp và môi trường Webserver Localhost. Hãy thử trải nghiệm những tính năng hoàn hảo này trên Xampp và thoải mái thực hiện những ý tưởng về Website, Blog mà không cần tới mạng Internet nhé!

Chúc các bạn thành công!

Nguồn thachpham.com