Setup staging and git for development

Today I will show you how to set up staging and git of a website for development purpose.

Why?

Because coding in live site is very dangerous, the example below will show you how much its cost when you find a bug in live site (production)

So, avoid coding directly in live site to avoid bug as much as you can.

How?

We will need setup git for the live website and clone the website to our development server, so you can check your code in staging server first, then push it to live server if everything is ok.

There are 2 main steps you need follow to do it:

1. Setup git repository

I will use github to take example for this one. Currently, our team is using vietartisans to manage repository on github (it’s premium account and can create private repository).

First, go to this link: https://github.com/new (make sure you logged in vietartisans account before), create a repository like that

Done, you will have a repository like this:

2. Clone website to our staging server

There are 2 popular cases (WordPress):

1. SSH Enabled

This is the fastest solution to achieve the purpose, but you will need to know some knowledges about command line in OS. Please follow step by step:

1. Setup git, please follow step by step, () is for description:

  • Go to the root folder of live website.
  • git init (initialize git repository).
  • git remote add origin <remember the link that i notice you to save above, put it here>(Add remote repository).
  • git pull origin master (pull the current files from remote repository, in this case is .gitignore file and README.md file).
  • git config user.email <your email> && git config user.name <your name> (config email and name).
  • git add . && git commit -m "First init" && git push origin master (push initialize code to staging website).
  • Modify .gitignore file: standard .gitignore file for WordPress is good but it is not enough, we will need to add *.sql and *.sql before clone (add it inside .gitignore file).

2. Clone website to our development server (staging website).

+ Dump database

  • If live server already installed WP CLI (you can check by type which wp command), dump database by this way: wp db export <sql file name>
  • If live server not installed WP CLI yet, you will need to dump database in manual way: mysqldump -u<database username> -p<database user password> <database name> > <sql file name> (Remember that using password directly in command is not secure)

+ Zip all files and folders:

  • This one is simple: zip -r <zip file name> ./ (run in root folder)

+ Create a staging website in our server, currently we are using serverpilot (sondoha@gmail.com account) to handle these tasks:

  • Create a staging site, with these information: Note that we will not need to create fresh WordPress site
  • Setup database, the database information you can find in wp-config.php file in root folder of live website:

+ Download zip file from live website to staging website: wget http://live-website/<zip file name> (run in root folder of staging website)

+ Unzip the zip file: unzip <zip file name>

+ Import database:

  • Again, check if your development server installed WP CLI or not, if yes: wp db import <sql file name>. If no: mysql -u<database username> -p<database user password> <database name> < <sql file name>.

+ Search and replace database:

  • Because you import database live website to staging website, so we will need to search and replace all the string <live-website-domain> to <staging-website-domain>.
  • With WP CLI, you can do it by this command: wp search-replace <live-website-domain> <staging-website-domain> (Don’t put http:// in)
  • If you don have WP CLI already installed, using this tool.

Boom, you can go to staging website domain to see the result.

2. SSH not enabled, but we have admin credential

1. Clone website to staging website:

  • Using serverpilot to create new fresh WordPress site: 
  • Using this article to clone live website to staging website via UpdraftPlus

2. Setup git: This one is simillar to “SSH Enabled” section above.

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *

%d bloggers like this: