Step by step guide to building your first personal website (Part 1)

Preface

With the popularity of cloud computing, server prices are constantly decreasing. Therefore, this article is written to help those who are interested in IT or want to make themselves unique build their own personal website more conveniently. Show your uniqueness on your own website!

1. Introduction

1. Server

This time we use UCloud's server (cloud host UHost), and the IP uses UCloud's elastic IP (if you are using other servers or cloud hosts from other friendly companies, the experimental steps in this article remain the same).

2. Backend

The backend configuration is collectively referred to as LNMP, LNMP=Linux+Nginx+MySQL+PHP (that is, Nginx, MySQL, and PHP5 services are built in the Linux system).

Nginx: Nginx (pronounced the same as engine x) is a web server that can reverse proxy HTTP, HTTPS, SMTP, POP3, IMAP protocol links, as well as a load balancer and an HTTP cache.

MySQL: A relational database management system

PHP: A scripting language that is executed on the server and embedded in HTML documents

The Linux system is centos 6.5, and other services are installed using yum using the atomic package.

3. Frontend

The front-end configuration is WordPress, which is a blogging platform developed using the PHP language. Users can build their own websites on servers that support PHP and MySQL databases. WordPress can also be used as a content management system (CMS).

WordPress is configured as the latest configuration. (The package is latest.tar.gz)

4. Service comparison

Generally, website services are built using LAMP or LNMP (A stands for Apache, N stands for Nginx).

• Apache's advantages: open source, stable, and rich modules
• Nginx's advantages: less resource consumption, support for high concurrent connections, high efficiency

Use environment:

• LNMP: saves memory, has more static content, high concurrency, and small scale
• LAMP: Strive for stability, more dynamic content, more functions, and large scale

2. Backend Configuration

1. Preparation

(1) Tools:

It is recommended to use xshell for remote operation. If you are using a cloud host, you need to log in to the console to operate when you encounter commands to turn on, off, or restart the machine (such as reboot).

(2) Quickly locate the line number in Linux

Enter the number of rows after the colon and press enter.

Figure 1: Row number positioning

(3) Linux quickly locates the character

Enter the / character after the colon and press the enter key (to find the next one, press N)

Figure 2: Character positioning

(4) Enable iptables (open ports 80 and 3306)

Note: Port 80 is open for http protocol (i.e. web pages); port 3306 is open for MySQL database

1) Add two iptables rules to enable it.

 #vim /etc/sysconfig/iptables 
 
 
 
 -A INPUT -m state --state NEW -m tcp -p tcp
 --dport 80 -j ACCEPT 
 
 -A INPUT -m state --state NEW -m tcp -p tcp
 --dport 3306 -j ACCEPT

Figure 3: Modify iptables rules (put after 22)

2) Restart iptables

 # /etc/init.d/iptables restart

Figure 4: Restarting the firewall

(5) Disable SELinux

1) Modify two SELinux rules

 # vim /etc/selinux/config 
 
 
 
 SELINUX = disabled   
 
 # SELINUXTYPE = targeted  

Figure 5: Modifying SELinux rules

2) Restart the server

 #reboot

(6) Install a third-party yum repository

1) Download the wget tool

 #yum install wget

Figure 6: Downloading the wget tool

2) Download the atmoic package

Note: Atomic repositories support YUM package management for Fedora, RHEL, and CentOS

 # wget

http://www.atomicorp.com/installers/atomic

Figure 7: Downloading the atomic package

3) Install the atomic package

 # sh ./atomic

Figure 8: Installing the atomic package

4) Update the yum source

 #yum check-update

Figure 9: Updating the atomic package

2. Install backend services

(1) Install Nginx

1) Delete the system's own software package

 # yum remove httpd* php*

2) Install Nginx using yum

 #yum install nginx -y

Figure 10: Installing Nginx

3) Set Nginx to start at boot

 # chkconfig nginx on

4) Start Nginx

 # service nginx start

Figure 11: Starting Nginx

(2) Install MySQL

1) Install MySQL using yum

 #yum install mysql mysql-server -y

Note: yum install package name – y: automatically install all in the package, y means yes

Figure 12: Installing MySQL

2) Start MySQL

 # /etc/init.d/mysqld start

Figure 13: Starting MySQL

3) Set MySQL to start at boot

 #chkconfig mysqld on

4) Copy the my-medium.cnf configuration file

 #cp /usr/share/mysql/my-medium.cnf
 /etc/my.cnf

Note: If there is a my.cnf file in the /etc directory by default, you can directly overwrite it.

Figure 14: Copying the my-medium.cnf configuration file

5) Set the MySQL root password

 #mysql_secure_installation 

Figure 15: Click enter

Figure 16: Enter Y to create a root password

Figure 17: Enter password twice

Figure 18: Remove anonymous user, enter Y

Figure 19: Do not allow remote login with root privileges, enter Y

Figure 20: Remove the test library and access it, enter Y

Figure 21: Reload the privilege table, enter Y

6) Restart MySQL service

 # /etc/init.d/mysqld restart

Figure 22: Restarting the MySQL service

(3) Install PHP5

1) Install PHP with yum

 #yum install php php-fpm -y

Figure 23: Restarting the MySQL service

2) Install PHP components (PHP5 supports MySQL)

 # yum install php-mysql php-gd libjpeg* php-imap php-ldap php-pear php-xml php-xmlrpc php-mbstring php-mcrypt
 php-bcmath php-mhash libmcrypt

Figure 24: Install PHP component, select yes

Figure 25: Final result of installing PHP components

3) Set php-fpm to start at boot

 #chkconfig php-fpm on

4) Start php-fpm

 #/etc/init.d/php-fpm start

Figure 26: Starting php-fpm

3. Configure backend services

(1) Nginx supports PHP

1) Back up the nginx.conf configuration file

 #cp /etc/nginx/nginx.conf /etc/nginx/nginxbak

Figure 27: Back up the nginx.conf configuration file

2) Edit the nginx.conf configuration file

 #vim /etc/nginx/nginx.conf

user nginx nginx; The user name of the user added to the Nginx group is nginx

Figure 28: Editing the nginx.conf configuration file

3) Back up the default.conf configuration file

 #cp /etc/nginx/conf.d/default.conf /etc/nginx/conf.dbak

Figure 29: Back up the default.conf configuration file

4) Edit the default.conf configuration file

 #vim /etc/nginx/conf.d/default.conf

Add in location

 index index.php index.html index.htm;

Figure 30: Adding index format in location

Add a

 location ~ \.php$ { 
 
 root html; 
 
 fastcgi_pass 127.0.0.1:9000; 
 
 fastcgi_index index.php; 
 
 fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name; 
 
 include fastcgi_params; 
 
 }

Figure 31: Add a php rule

5) Restart Nginx

 #service nginx restart

Figure 32: Restarting Nginx

(2) Configure PHP

1) Edit configuration

 #vim /etc/php.ini

Line 211: Change to short_open_tag=ON

Figure 33: Modify line 211

Line 375: Change to expose_php = off

Figure 34: Modify line 375

Line 878: Change to date.timezone = PRC

Figure 35: Modify line 878

(3) Configure php-fpm

1) Back up the php-fpm configuration file

 #cp /etc/php-fpm.d/www.conf/etc/php-fpm.d/www.confbak

2) Edit the configuration

 #vim /etc/php-fpm.d/www.conf

Change apache to nginx

 user = nginx   
 
 group = nginx  

Figure 36: Original www.conf diagram

Figure 37: Current www.conf diagram

(4) Testing

1) Enter HTML

 #cd /usr/share/nginx/html

4.2) Edit the index.php file

 #vim index.php

Editing content:

 <? php   
 
 $ link = mysql_connect ("localhost","root","111111"); 
 
 if(!$link) echo "FAILD!Please check your password!"; 
 
 else echo "OK!Your connection is successful"; 
 
 ?>  

Note: The parameters of the mysql_connect() function are: mysql server name or IP, mysql user name, and mysql user password.

Figure 38: Edit index.php content

3) Set permissions

 # chown nginx.nginx /usr/share/nginx/html
 -R

4) Restart nginx

 #service nginx restart

Figure 39: Restart Nginx

5) Restart php-fpm

 #service php-fpm restart

Figure 40: Restart php-fpm

Log in to the website using a personal computer:

Figure 41: MySQL connection successful

Prove that MySQL connection is successful!

6) Modify the index.php file

 #vim index.php

Modifications:

 <? php   
 
 phpinfo(); 
 
 ?>  

Figure 42: index.php content

7) Restart nginx

 #service nginx restart

Figure 43: Restarting Nginx

8) Restart php-fpm

 #service php-fpm restart

Figure 44: Restart php-fpm

9) Enter the server IP address to access the web page

UCloud cloud host:

 #curl myip.ipip.net

Figure 45: Cloud host searches for the eip address

Log in to the website using a personal computer:

Figure 46: Personal computer browser login web page

Prove that LNMP's backend test was successful!

[This article is an original article by 51CTO columnist "Big U's Technology Classroom". For reprinting, please contact the author through the WeChat public account (ucloud2012)]

Click here to read more articles by this author