You need a local LEMP environment
You are ready, the client is ready, the site is ready. The time has come to push yet another WordPress site to the internet. You deploy the files. You migrate the database. The site has gone live! And something has broken.
But the site worked both locally and on the testing server! The only difference is…nginx.
There’s always this plugin or something that works perfectly well while running on your local LAMP stack, but once deployed to the production server, which happens to use nginx instead of Apache, some part of the plugin breaks for some reason.
One of the selling points of Vagrant is that it gives you the power to set up a local environment that is almost identical to production. Sure, you might get away with using PHP 5.4 on your local machine and 5.5 on the production server. But you might not be as lucky if nginx is the difference.
That’s why you also need a LEMP (Linux, [engine-x], MySQL, PHP) environment on your computer.
The steps
The following guide requires you to have Vagrant installed and also have a basic understanding about the subject.
0.
Create a new folder that will store your local nginx projects. I’ll call mine nginx
.
$ mkdir nginx && cd $_
1.
Download the excellent Vagrantfile from Vaprobash. Open the Vagrantfile in your editor of choice and find these lines:
# Provision Nginx Base
# config.vm.provision "shell", path: "#{github_url}/scripts/nginx.sh", args: [server_ip, public_folder, hostname, github_url]
Uncomment (remove the #) the second line and save the file.
2.
Let’s install everything!
$ vagrant up
3.
After a while, when everything is downloaded and ready, create a folder for your new project inside nginx
. Also create an index.html
and write something random like <h1>Hello nginx</h1>
in it.
$ mkdir project1
$ cd project1
$ touch index.html
Now you should be able to browse to http://192.168.22.10.xip.io/project1
and see Hello nginx
.
4.
Okey, cool, that wasn’t so hard. But how do you set up a virtual host with nginx? Let’s try to create a vhost called project1.dev
!
# Log in to the virtual machine
$ vagrant ssh
# Copy the default configuration file and create a new one.
$ sudo cp /etc/nginx/sites-available/default /etc/nginx/sites-available/project1.dev
Open the new virtual host file with Vim:
$ sudo vim /etc/nginx/sites-available/project1.dev
Go down to line 20 where this block of code is located:
server {
listen 80 default_server;
listen [::]:80 default_server ipv6only=on;
root /usr/share/nginx/html;
index index.html index.htm;
# Make site accessible from http://localhost/
server_name localhost;
Replace localhost
with project1.dev
and change the root to vagrant/project1
.
root /vagrant/project1
index. index.html index.htm
# Make site accessible from http://localhost/
server_name project1.dev;
Save the file and exit out of Vim (ESC :wq
).
Next we need to enable the vhost configuration and restart nginx.
$ sudo ngxen project1.dev
$ sudo service nginx reload
The last thing we have to do is to edit the hosts file on the local machine.
# Exit out of Vagrant
$ exit
$ sudo vim /etc/hosts
Add this line and save the hosts file:
192.168.22.10 project1.dev
Now you should be able to browse to http://project1.dev
with your browser and see Hello nginx
. Well done!
5.
Why a fifth step? It’s already working? Yes, with HTML files. Try to rename the index file to index.php
and you’ll notice that it doesn’t work anymore. But don’t worry, it’s an easy fix!
# Log in to Vagrant again
$ vagrant ssh
# Open the configuration file for the vhost once again
$ sudo vim /etc/nginx/sites-available/project1.dev
Go down to line 54 or where you can find this:
#location ~ \.php$ {
# fastcgi_split_path_info ^(.+\.php)(/.+)$;
# # NOTE: You should have "cgi.fix_pathinfo = 0;" in php.ini
#
# # With php5-cgi alone:
# fastcgi_pass 127.0.0.1:9000;
# # With php5-fpm:
# fastcgi_pass unix:/var/run/php5-fpm.sock;
# fastcgi_index index.php;
# include fastcgi_params;
#}
Uncomment the two first and the four last lines.
location ~ \.php$ {
fastcgi_split_path_info ^(.+\.php)(/.+)$;
# # NOTE: You should have "cgi.fix_pathinfo = 0;" in php.ini
#
# # With php5-cgi alone:
# fastcgi_pass 127.0.0.1:9000;
# # With php5-fpm:
fastcgi_pass unix:/var/run/php5-fpm.sock;
fastcgi_index index.php;
include fastcgi_params;
}
You also need to add index.php
at line 25:
index index.php index.html index.htm;
Reload nginx once again and you would be done!
$ sudo service nginx reload
That’s it. A local LEMP environment.