Skip to content

Instantly share code, notes, and snippets.

@danferth
Last active July 19, 2019 18:17
Show Gist options
  • Save danferth/dd94e35342468183962dd363ed98264d to your computer and use it in GitHub Desktop.
Save danferth/dd94e35342468183962dd363ed98264d to your computer and use it in GitHub Desktop.
Development environment setup for wordpress

DigitalOcean Dev Environment Setup + wordpress install

Software needed

  • Text editor (Atom or Sublime is good)
  • Putty
  • WinSCP

Services Needed

  • Github
  • DigitalOcean Droplet

Initial Setup

Text Editor

  • Set working directory

PuttyGen

  • Create RSA public and Private Keys
  • Reopen Public key in Puttygen and resave, this puts it into a format that Digital ocean can use
  • Save keys in secure location on machine

Digital Ocean

  • Create LAMP Droplet
  • Use Public Key created with PuttyGen

Set up communication with droplet

  • use putty to log into Droplet
  • Use WinSCP to log into droplet
  • Open Text Editor

At this point you should have a droplet and be connected to it with putty and Win SCE We are now goint to configure the droplet for wordpress. Most of this will come from this tutorial.

Set up a Sudo User

//create user
$ adduser [username]
//grant admin privileges
$ usermod -aG sudo [username]

Allow new sudo user to log in with roots ssh keys

$ rsync --archive --chown=[sudoUser]:[sudoUser] ~/.ssh /home/[sudoUser]

A few PHP extentions that may not be already installed

$ sudo apt update
$ sudo apt install php-curl php-gd php-mbstring php-xml php-xmlrpc php-soap php-intl php-zip
$ sudo systemctl restart apache2

Set up UFW firewall

//view list of available apps
$ ufw app list
//allow SSH connections so you can log back in lol
$ ufw allow OpenSSH
//enable ufw firewall
$ ufw enable
//check status of ufw
$ ufw status

Aquire a free domain name with dot.tk

A free domain name from dot.tk or any other TLD will work fine. We can just use the IP address and a self signed certificat but why not use an actual domain and hide it with an htaccess file and robots.txt from the rest of the world.

Set up domain root and sub directory

  • in /var/www/html create two folders main and sub
  • Change directory to /etc/apache2/sites-available
$ sudo cp 000-default.conf main.conf
$ sudo cp 000-default.conf sub.conf

we are setting up the virtual host files. In main.conf make sure it looks similar to this

<VirtualHost *:80>
        ServerAdmin webmaster@localhost
        ServerName [our free domain].[tk, ga whatever the TLD is]
        DocumentRoot /var/www/html/main

        <Directory /var/www/html/main/ >
            Options FollowSymLinks
            AllowOverride All
            Require all granted
        </Directory>
        .... other stuffs ...
</VirtualHost>

And for the sub.conf file

<VirtualHost *:80>
        ServerAdmin webmaster@localhost
        ServerName sub.[our free domain]
        DocumentRoot /var/www/html/sub

        <Directory /var/www/html/sub/ >
            Options FollowSymLinks
            AllowOverride All
            Require all granted
        </Directory>
          ... other stuff ...
</VirtualHost>

Enable the sites with

$ sudo a2ensite main.conf
$ sudo a2ensite sub.conf

//Enable the rewrite module
$ sudo a2enmod rewrite
$ sudo apache2ctl configtest
// everything ok?
$ sudo systemctl restart apache2

Don't forget about the host file!

edit the etc/hosts file

127.0.1.1 [domain] [domain.com]
127.0.0.1 localhost
#here are the additions for domains
127.0.0.1 danferth
127.0.0.1 chords

adjust ufw firewall to allow SSL traffic

$ sudo ufw allow 'Apache Full'
$ sudo ufw delete allow 'Apache'

//test apache configuation text
$ sudo apache2ctl configtest

//Everything OK? if so restart apache
$ sudo systemctl restart apache2

Set up Certbot

// Install Certbot
$ sudo apt-get update
$ sudo apt-get install software-properties-common
$ sudo add-apt-repository universe
$ sudo add-apt-repository ppa:certbot/certbot
$ sudo apt-get update
$ sudo apt-get install certbot python-certbot-apache

// set up certbot - You will have to do this for each subdirectory as well
$ sudo certbot --apache

Some final security settings for Apache

X-Content-Type-options: sameorigin needs to be set to prevent clickjacking also if you use WP and go into plugins the plugin info is displayed in an ifram so if this isn't set you will see domain refused connection or something.

$ sudo vim /etc/apache2/conf-avialable/security.conf

//uncomment lines toward the bottom for 
Header set X-Content-Type-Options: "nosniff"
and
Header set X-Frame-Options: "sameorigin"

//you have to enable mod_headers or your site will not connect anymore
$ sudo a2enmod headers

//if there is ssl-params.conf then...
$ sudo vim /etc/apache2/conf-avialable/ssl-params.conf

//change
Header always set X-Frame-Options DENY
to
Header always set X-Frame-Options SAMEORIGIN

$ sudo systemctl restart apache2

Install bindfs

so with the website files and such in /var/www/html and with owner:group set to www-data you can run into permission issues with gulp or just editing files here and there. So....

We can use bindfs to create a sym link of sorts in your users home directory and use that as our workbench. and the files and directorys will still have the appropriate permisions and owners as they should to work with apache.

//log in as root and install bindfs
$ apt update
$ apt install bindfs

//while as root create the mountpoint
$ cd [home/directory/of/user]
$ mkdir html
$ chown -Rf [user]:[user] html
$ chmod -Rf 770 html

//edit the file /etc/fstab with vim as root
//add this line (just one line, without line wraps):
bindfs#/var/www/html /home/[user]/html fuse force-user=[user],force-group=[user],create-for-user=www-data,create-for-group=www-data,create-with-perms=0770,chgrp-ignore,chown-ignore,chmod-ignore 0 0
//save and close

//now mount directory
$ mount /home/[user]/html
//If your system yells about force-user or force-group not being defined:

//replace force-user with owner
//replace force-group with group
//in the file /etc/fstab and save/close and rerun the above command

Install node & npm

// SSH in as user if still root from bindfs installation
$ cd ~
//Start by downloading the NVM install script
$ curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash
//as per instructions close terminal and reopen and log in as user
// install node
$ nvm install node

To be able to compile and install native add-ons from npm you need to install the development tools.

The following command will install all the necessary packages:

$ sudo apt install gcc g++ make

Create ssh for github

You will need an ssh key for interaction with github so

$ ssh-keygen -t rsa -b 4096 -C "[email protected]"
  • Use winSPC to go into ~/.ssh and grab the public key
  • Open in a text editor and copy paste into the settings area for SSH and GPG keys creating a new key
  • cd into the sub directory (or wht ever directory you wnat to start a project in) and run
$ git init
$ git clone https://github.com/danferth/start.git
// this puts the danferth/start repository into the folder say its ~/html/sub

//copy the contents into the sub directory from sub/start
$ cp -a start/. ~/html/sub

//Try a git push
$ git push origin master
//if everything is a go you're good

from here you should be able to SSH into the servier with [user] and $ cd ~/html and see the web files for our main site and sub directory. You should also be able to run npm install and use gulp from here while retaining all permisions and ownership for apache in /var/www/html

Wordpress if you like

Download wordpress and install

// cd to /var/www/html/main
$ sudo mkdir tmp 
$ cd tmp
$ curl -O https://wordpress.org/latest.tar.gz
$ tar xzvf latest.tar.gz

//move everything over to /var/www/html/main (the trailing . in the first argument ensures that hidden files are copied over)
$ sudo cp -a /tmp/wordpress/. /var/www/html/main

//cd into /var/www/html/main and create some files and folders
$ touch .htaccess
$ sudo cp wp-config-sample.php wp-config.php
$ sudo mkdir wp-content/upgrade

Wordpress permissions

we are setting the user:owner and file and directory permisions here

$ sudo chown -R www-data:www-data /var/www/main
$ sudo find /var/www/html/main/ -type d -exec chmod 750 {} \;
$sudo find /var/www/html/main/ -type f -exec chmod 640 {} \;

MySQL database time!

//log into mysql
$ sudo mysql

mysql>

mysql> CREATE DATABASE [dbname] DEFAULT CHARACTER SET utf8 COLLATE utf8_unicode_ci;
mysql> GRANT ALL ON [dbname].* TO '[dbuser]'@'localhost' IDENTIFIED BY '[password]';
mysql> FLUSH PRIVILEGES;
mysql> EXIT;

Wordpress configuration file

wp-config.php in root of directory

  • add the salt from
  • change the database name, user, and user pass

Add this to after the database connections so wordpress won't ask for ftp credentials

define('FS_METHOD', 'direct');

In browser go to https://[IP of droplet] and finish wordpress instalation

Disable the Gutenberg editor

// Add this line to the end of the functions.php in the root
add_filter('use_block_editor_for_post', '__return_false');
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment