Developing Robust Deployment Procedures

Once you have developed your site, how do you make it live on your web hosting? For many years the answer was to log on to your server and upload the files via FTP. Over time most hosts and FTP clients began to support SFTP, ensuring your files were transmitted over a secure connection. The process of deploying a site however remained the same.

There are issues with deploying a site in this way. You are essentially transferring files one by one to the server without any real management of that transfer. If the transfer fails for some reason, you may end up with a site that is only half updated. It can then be really difficult to work out what hasn’t been replaced or added, especially where you are updating an existing site. If you are updating some third-party software your update may include files that should be removed, but that may not be obvious to you and you risk leaving outdated files littering your file system. Updating using (S)FTP is a fragile process that leaves you open to problems caused by both connectivity and human error. Is there a better way to do this?

You’ll be glad to know that there is. A modern professional deployment workflow should have you moving away from fragile manual file transfers to deployments linked to code committed into source control.

The benefits of good practice

You may never have experienced any major issues while uploading files over FTP, and good FTP clients can help. However, there are other benefits to moving to modern deployment practices.

No surprises when you launch

If you are deploying in the way I suggest in this article you should have no surprises when you launch because the code you committed from your local environment should be the same code you deploy – and to staging if you have a staging server. A missing vital file won’t cause things to start throwing errors on updating the live site.

Being able to work collaboratively

Source control and good deployment practice makes working with your clients and other developers easy. Deploying first to a staging server means you can show your client updates and then push them live. If you subcontract some part of the work, you can give your subcontractor the ability to deploy to staging, leaving you with the final push to launch, once you know you are happy with the work.

Having a proper backup of site files with access to them from anywhere

The process I will outline requires the use of hosted, external source control. This gives you a backup of your latest commit and the ability to clone those files and start working on them from any machine, wherever you are.

Being able to jump back into a site quickly when the client wants a few changes

When doing client work it is common for some work to be handed over, then several months might go by without you needing to update the site. If you don’t have a good process in place, just getting back to work on it may take several hours for what could be only a few hours of work in itself. A solid method for getting your local copy up to date and deploying your changes live can cut that set-up time down to a few minutes.

The tool chain

In the rest of this article I assume that your current practice is to deploy your files over (S)FTP, using an FTP client. You would like to move to a more robust method of deployment, but without blowing apart your workflow and spending all Christmas trying to put it back together again. Therefore I’m selecting the most straightforward tools to get you from A to B.

Source control

Perhaps you already use some kind of source control for your sites. Today that is likely to be Git but you might also use Subversion or Mercurial. If you are not using any source control at all then I would suggest you choose Git, and that is what I will be working with in this article.

When you work with Git, you always have a local repository. This is where your changes are committed. You also have the option to push those changes to a remote repository; for example, GitHub. You may well have come across GitHub as somewhere you can go to download open source code. However, you can also set up private repositories for sites whose code you don’t want to make publicly accessible.

A hosted Git repository gives you somewhere to push your commits to and deploy from, so it’s a crucial part of our tool chain.

A deployment service

Once you have your files pushed to a remote repository, you then need a way to deploy them to your staging environment and live server. This is the job of a deployment service.

This service will connect securely to your hosting, and either automatically (or on the click of a button) transfer files from your Git commit to the hosting server. If files need removing, the service should also do this too, so you can be absolutely sure that your various environments are the same.

Tools to choose from

What follows are not exhaustive lists, but any of these should allow you to deploy your sites without FTP.

Hosted Git repositories

• GitHub
• Beanstalk
• Bitbucket

Standalone deployment tools

• Deploy
• dploy.io
• FTPloy

I’ve listed Beanstalk as a hosted Git repository, though it also includes a bundled deployment tool. Dploy.io is a standalone version of that tool just for deployment. In this tutorial I have chosen two separate services to show how everything fits together, and because you may already be using source control. If you are setting up all of this for the first time then using Beanstalk saves having two accounts – and I can personally recommend them.

Putting it all together

The steps we are going to work through are:

1. Getting your local site into a local Git repository
2. Pushing the files to a hosted repository
3. Connecting a deployment tool to your web hosting
4. Setting up a deployment

Get your local site into a local Git repository

Download and install Git for your operating system.

Open up a Terminal window and tell Git your name using the following command (use the name you will set up on your hosted repository).

> git config --global user.name "YOUR NAME"

Use the next command to give Git your email address. This should be the address that you will use to sign up for your remote repository.

> git config --global user.email "YOUR EMAIL ADDRESS"

Staying in the command line, change to the directory where you keep your site files. If your files are in /Users/rachel/Sites/mynicewebite you would type:

> cd /Users/rachel/Sites/mynicewebsite

The next command tells Git that we want to create a new Git repository here.

> git init

We then add our files:

> git add .

Then commit the files:

> git commit -m “Adding initial files”

The bit in quotes after -m is a message describing what you are doing with this commit. It’s important to add something useful here to remind yourself later why you made the changes included in the commit.

Your local files are now in a Git repository! However, everything should be just the same as before in terms of working on the files or viewing them in a local web server. The only difference is that you can add and commit changes to this local repository.

Want to know more about Git? There are some excellent resources in a range of formats here.

Setting up a hosted Git repository

I’m going to use Atlassian Bitbucket for my first example as they offer a free hosted and private repository.

Create an account on Bitbucket. Then create a new empty repository and give it a name that will identify the repository easily.

Click Getting Started and under Command Line select “I have an existing project”. This will give you a set of instructions to run on the command line. The first instruction is just to change into your working directory as we did before. We then add a remote repository, and run two commands to push everything up to Bitbucket.

cd /path/to/my/repo
git remote add origin https://myuser@bitbucket.org/myname/24ways-tutorial.git
git push -u origin --all 
git push -u origin --tags 

When you run the push command you will be asked for the password that you set for Bitbucket. Having entered that, you should be able to view the files of your site on Bitbucket by selecting the navigation option Source in the sidebar.

You will also be able to see commits. When we initially committed our files locally we added the message “Adding initial files”. If you select Commits from the sidebar you’ll see we have one commit, with the message we set locally. You can imagine how useful this becomes when you can look back and see why you made certain changes to a project that perhaps you haven’t worked on for six months.

Before working on your site locally you should run:

> git pull

in your working directory to make sure you have all of the most up-to-date files. This is especially important if someone else might work on them, or you just use multiple machines.

You then make your changes and add any changed or modified files, for example:

> git add index.php

Commit the change locally:

> git commit -m “updated the homepage”

Then push it to Bitbucket:

> git push origin master

If you want to work on your files on a different computer you clone them using the following command:

> git clone https://myuser@bitbucket.org/myname/24ways-tutorial.git

You then have a copy of your files that is already a Git repository with the Bitbucket repository set up as a remote, so you are all ready to start work.

Connecting a deployment tool to your repository and web hosting

The next step is deploying files. I have chosen to use a deployment tool called Deploy as it has support for Bitbucket. It does have a monthly charge – but offers a free account for open source projects.

Sign up for your account then log in and create your first project. Select Create an empty project. Under Configure Repository Details choose Bitbucket and enter your username and password.

If Deploy can connect, it will show you your list of projects. Select the one you want.

The next screen is Add New Server and here you need to configure the server that you want to deploy to. You might set up more than one server per project. In an ideal world you would deploy to a staging server for your client preview changes and then deploy once everything is signed off. For now I’ll assume you just want to set up your live site.

Give the server a name; I usually use Production for the live web server. Then choose the protocol to connect with. Unless your host really does not support SFTP (which is pretty rare) I would choose that instead of FTP.

You now add the same details your host gave you to log in with your SFTP client, including the username and password. The Path on server should be where your files are on the server. When you log in with an SFTP client and you get put in the directory above public_html then you should just be able to add public_html here.

Once your server is configured you can deploy. Click Deploy now and choose the server you just set up. Then choose the last commit (which will probably be selected for you) and click Preview deployment. You will then get a preview of which files will change if you run the deployment: the files that will be added and any that will be removed. At the very top of that screen you should see the commit message you entered right back when you initially committed your files locally.

If all looks good, run the deployment.

You have taken the first steps to a more consistent and robust way of deploying your websites. It might seem like quite a few steps at first, but you will very soon come to realise how much easier deploying a live site is through this process.

Your new procedure step by step

1. Edit your files locally as before, testing them through a web server on your own computer.
2. Commit your changes to your local Git repository.
3. Push changes to the remote repository.
4. Log into the deployment service.
5. Hit the Deploy now button.
6. Preview the changes.
7. Run the deployment and then check your live site.

Taking it further

I have tried to keep things simple in this article because so often, once you start to improve processes, it is easy to get bogged down in all the possible complexities. If you move from deploying with an FTP client to working in the way I have outlined above, you’ve taken a great step forward in creating more robust processes. You can continue to improve your procedures from this point.

Staging servers for client preview

When we added our server we could have added an additional server to use as a staging server for clients to preview their site on. This is a great use of a cheap VPS server, for example. You can set each client up with a subdomain – clientname.yourcompany.com – and this becomes the place where they can view changes before you deploy them.

In that case you might deploy to the staging server, let the client check it out and then go back and deploy the same commit to the live server.

Using Git branches

As you become more familiar with using Git, and especially if you start working with other people, you might need to start developing using branches. You can then have a staging branch that deploys to staging and a production branch that is always a snapshot of what has been pushed to production. This guide from Beanstalk explains how this works.

Automatic deployment to staging

I wouldn’t suggest doing automatic deployment to the live site. It’s worth having someone on hand hitting the button and checking that everything worked nicely. If you have configured a staging server, however, you can set it up to deploy the changes each time a commit is pushed to it.

If you use Bitbucket and Deploy you would create a deployment hook on Bitbucket to post to a URL on Deploy when a push happens to deploy the code. This can save you a few steps when you are just testing out changes. Even if you have made lots of changes to the staging deployment, the commit that you push live will include them all, so you can do that manually once you are happy with how things look in staging.

Further Reading

• The tutorials from Git Client Tower, already mentioned in this article, are a great place to start if you are new to Git.
• A presentation from Liam Dempsey showing how to use the GitHub App to connect to Bitbucket
• Try Git from Code School
• The Git Workbook a self study guide to Git from Lorna Mitchell

Get set up for the new year

I love to start the New Year with a clean slate and improved processes. If you are still wrangling files with FTP then this is one thing you could tick off your list to save you time and energy in 2015. Post to the comments if you have suggestions of tools or ideas for ways to enhance this type of set-up for those who have already taken the first steps.