Grow your CSS skills. Land your dream job.

#109: Getting off FTP and onto Git Deployment with Beanstalk

In this screencast I move my own personal website from my old live FTP editing ways to a proper version controlled system including deployment. I haven't had much experience with this, so forgive me if it's a bit rough.

We start by moving the live website local, including bringing all the files down and copying the database. Then we set up a Git repository in Beanstalk and push it all up to that. Then we give Beanstalk our FTP credentials and set up how we want deployment done. Then we make some local changes to our site, and commit/push them to Beanstalk, which does the deployment for us. By then end, it's all working perfectly.

If you've got questions/comments/suggestions on this workflow, I'd love to hear!

Links from the video:

Followup:

Mark Jaquith on Working with WordPress Locally (specifically, dealing with plugins and config).

Comments

  1. Perfect timing! I was just setting this up when I saw your tweet. Thanks. :)

  2. Permalink to comment#

    We use beanstalk for handling the theme development at the new kid in town, MonsterThemes. And I love it.

  3. Permalink to comment#

    How do you manage database changes? Do you any easy way for that?

    • For WordPress, you could look into: http://crowdfavorite.com/wordpress/ramp/

      Otherwise I don’t have a good solution. It’s one of those things I don’t think there are perfect answers for yet.

    • Permalink to comment#

      I’ve not had many projects where I would be nice to have database versioning too. With normal WordPress themes, create a theme-centric repo would work fine.

    • There isn’t really a good solution for this yet. RAMP does content addition, but more complex changes aren’t supported. What I recommend is that you script the changes you want to make, using the WordPress APIs (PHP, not the remote APIs). Get it working locally, on a fresh DB snapshot, then commit it, deploy it, and run it on production.

  4. I love how Chris is willing to “do it live” and still share with all of you. Awesome job.

    If anyone has questions about Beanstalk’s deployment tools (or anything else Beanstalk specific, drop me a comment and I can help you out.

    -Alex
    wildbit.com

  5. shawn
    Permalink to comment#

    Thank you for the introduction to beanstalk and git.

    I would like to request an extended vs. of the tutorial on how to properly setup staging deployments and best practices for setting up multiple repositories for each theme/plugin etc.

    I am new to beanstalk and git, but it makes sense to me that I might not want to necessarily push directly to my live site, but more to a staging site first to make sure all is perfect before going live. (also it would give me benefit of a backup site just in case)

    Finally the best practice of using multiple repositories would be nice. That way I could update the WordPress core without messing around with my theme files etc.

    *One thing am learning quickly is that Windows is nowhere near as nice as the apple when it comes to these apps. Can’t find anything nearly as nice as Tower for windows, closest seems to be Smartgit, would love suggestions on apps for Windows in the meantime.

  6. Permalink to comment#

    Great screencast, Chris.

    I haven’t really seen the appeal of SVN or Git in isolation, and have always thought that what was missing was a method of integrated deployment, which has always left me in the just-do-FTP camp (although I do use a local copy, so I’m not completely ‘commando’, as you put it). It’s very nice to see how it can now all hang together (stubborn MAMP notwithstanding!). Surely though it doesn’t have to be this complicated, and future products (like Coda, as you suggest in an earlier comment) will offer a smoother all-in-one interface. I can imagine a single service that has both a local app for editing and committing, and also a web-based service like BeanStalk as one complete offering. Let’s hope someone comes up with a simpler solution soon.

    Did you have several coffees before making this? I felt like I needed to watch it at a slower speed! :-)

  7. Scott
    Permalink to comment#

    @ChrisCoyier

    What is the password manager called that you used in Chrome?

  8. Permalink to comment#

    I’m getting my beanstalk set up right now. Awesome! I’ve been trying to figure out how I could do things locally for such a long time. Thank you!

    And thank you for having the best sense of humor, too. I get almost as much pure entertainment value out of these screencasts as I do learning value. :)

    Adding in LiveReload to the mix would complete the cycle. Are you still using that in this current setup?

    Thanks again. :)

  9. Permalink to comment#

    Ugh! I’m getting a “The path already contains a git repository” error…

    No matter what path I choose, that’s what I get.

    Any clues?

    • Permalink to comment#

      Very weird… I figured out what the problem was. When I was using Tower to create my local path, it would tell me that a git repo was already there. Only when I manually created a new directory would it work the way demoed on in your screencast.

      Just an FYI in case someone else runs into this issue.

      I’m about to but into beanstalk, this is WAY powerful and awesome.

    • Lucas
      Permalink to comment#

      I’m still getting “The path already contains a git repository” error, even after I create the folder manually :/

  10. I found this tutorial by Jeffrey Way useful to understand how tower works, he’s using a beta version, but the concepts still apply:

    http://net.tutsplus.com/tutorials/other/quick-tip-first-look-at-the-git-tower-gui/

    I’m up and running with beanstalk (free account for now) and git tower. I like the workflow a lot and I feel like I’m starting to understand the purpose of branches and merging etc.

    I still have a couple of questions:
    1. Auto deployment in beanstalk is not working for me. Is this because I’m on a free account?
    2. To revert to an earlier version in tower git should I be using “revert to this commit” or “roll back to this commit” ? I’m getting a bunch of errors when trying to go back up to the latest version after reverting down to a previous version.

    • Hi Paul,

      Deployments is included in all paid accounts, but not the trial plans, sorry.

      If you haven’t already, email Beanstalk support. We can help you with those errors.

  11. Great run through for people new to GIT. You might like Magic Bean for Mac to deploy sites straight from your Mac’s Status bar through Beanstalk. Useful for those manual deployments to live environments. :)

    http://www.magicbeanapp.com/

    Andy

  12. Does anybody know of something that would work like beanstalk, but free (basically multiple free repositories).

  13. Does anybody know of something that would work like beanstalk, but free (basically multiple free repositories)?

    • Permalink to comment#

      you can use Assembla.com for free private repos. then you can use capistrano for deploying via SSH. Better than using FTP.
      initial setup is a bit convoluted, but once that’s done, adding new sites is quite straightforward.

  14. Hello,

    Thanks for the video.

    I noticed that you created a new folder/repo, and later copy into the new from the old. I would recommend that you just init a new repo in the exisiting folder, and then add the Beanstalk as a remote. That way I believe it just just to add this into Tower as an existing repo.

    This is more for the command-line lovers like myself. But it does get the work done, and I’m sure it can we done with Tower as well. That way you remove the copy step :)

    
    cd #PROJECT#
    git init
    git add .
    git remote add origin git://ototkdjsfjsdj-cosofjsf
    git fetch origin (to make the below work)
    git branch --set-upstream master origin/master
    git commit -m 'Initial commit.'
    git push

    Good luck with Git! I love it.

  15. Permalink to comment#

    Great s-cast!!

    Would love to see another git episode with push/pulls from 2 people working on same site as is often the case.

    Keep up the great work!

  16. Permalink to comment#

    You rule Chris, I was actually doing this setup.

  17. Permalink to comment#

    Thanks a million man, I was trying to figure this out for a week.

  18. Permalink to comment#

    @Chris,

    First thank you for all your screencasts, they are great!

    I am fairly new to Git as well. I am NOT a programmer by any means just a front-end developer, but after learning the basics of what I need to know to use it through ssh and cmd line (terminal/bash/etc) I would never use all the applications you used in this screencast. It seems like 4 times the work and 4 times the amount of time as well. Even though, great screencast for getting people started with some type of versioning.

  19. Andy
    Permalink to comment#

    Chris, I laughed so hard …. “cmon Sql!”
    It was really useful, I’m just starting a new project that requires version control and I was just struggling last night between tower and beanstalk..push, commit..I was lost, thanks for making it so clear.

  20. Permalink to comment#

    LOL, total car crash! was a good basic intro to Beanstalk though, thanks!

  21. Permalink to comment#

    thanks Chris for doing this – I was also a bit apprehensive about getting this set up.
    You had me laughing, especially when you’re talking to mySql, lol

    for doing the search / replace thing when moving a site there are a couple of tools to make it easier:

    a php script, I’ve used it many times

    http://interconnectit.com/124/search-and-replace-for-wordpress-databases/

    and a WordPress plugin

    http://wordpress.org/extend/plugins/wp-migrate-db/

    • Permalink to comment#

      Yes! Thank you. I’m in the middle of watching the video and shouting “WP Migrate DB” at the screen. :-)

  22. Permalink to comment#

    also check out the correct way to manage the wp-config file here:

    http://markjaquith.wordpress.com/2011/06/24/wordpress-local-dev-tips/

  23. Permalink to comment#

    I found this awesome Shell script by René Moser git-ftp with this script you can deploy your git-repo to ftp without using Beanstalk.

  24. SpallingNuzi
    Permalink to comment#

    I haven’t had much experience with this, so forgive me if it’s a big rough.

    Please fix that typo or the kitten get’s it!

  25. Hey Chris, if you are still having a problem with restarting your MySQL in MAMP, just open your terminal and type this:

    killall -9 mysqld

    It work`s for me ;-)

  26. Goog job chris!

  27. Permalink to comment#

    Awesome Chris, thanks!! I bypassed MAMP and set up my own stack on my Mac to get my local environment going, it was easier than I thought it would be…

    Moved my current project into the repo and successfully deployed to my pre-production (staging) server. Tower is awesome, Beanstalk is awesome… signed up for the silver plan, you should get a commission! :)

    One thing I started thinking; it’s probably best to only track your themes and custom plugins vs the entire WP core files. If you upgrade WP on your live or staging server via the admin panel it’s likely you’ll have a major mess on your hands the next time you deploy from Beanstalk.

    • I agree with Ken about keeping WP core files separate, although I recently learned about using Git “submodules” which allow you to keep independent repos within one, kind of like symbolically linking. This means that submodule files are kept clean and up-to-date (hopefully) since they are maintained as separate, usually canonical repos.

  28. Permalink to comment#

    First off, thank you for everything you do.

    One quick question, say I make some changes to a simple page within a WordPress installation…maybe just updating some text. Will that update via the workflow you demonstrated? Or will I still need to do that updating on the live site?

    I successfully got Tower, GitHub, Beanstalk rolling but it seems to be only committing changes in the actual file structure i.e. updating a plugin, etc.

    • Ken
      Permalink to comment#

      This workflow only monitors the files you are tracking with Git. Changes made in WP are saved to your MySQL database. If you want your local dev copy to match your live site you’ll need to import your latest MySQL dump after making changes to the live site.

  29. Gustav Nikolaj
    Permalink to comment#

    As an alternative to ignoring the file from the git repo, you could use different database credentials depending on the servers hostname.

    With PHP it is done using the value of the _SERVER arrays SERVER_NAME key. An example:

    if ($_SERVER['SERVER_NAME'] == ‘cc.local’) {
    // if the hostname matches your local one use
    // the local database connection info
    } else {
    // if its not, assume that we must be on the
    // production site so use…
    // the production database info
    }

  30. Hi Chris

    I love your screencasts. I also like watching you make those little silly errors and then going back to correct them, it tells me its OK to make mistakes as we code and that’s as normal as it sounds it is :P

    Its fun! I wanted to ask if you’ve ever considered enabling your iSight camera with a little picture playing in the bottom right corner as you speak. I think it would make it more personal but then I am sure you must have thought about this and there must be a very good reason not doing it.

    Fill me up!

  31. I hate when chrome doesn’t support local domains.
    Erh. But there is a faster way of going around that.
    Instead http://mydomain.whatup just
    go
    mydomain.whatup/

  32. Aborady
    Permalink to comment#

    I’m using wamp server on win7
    it works great and has a full simulation of PhpMyAdmin
    i love it

  33. Tony
    Permalink to comment#

    Hi Chris
    Why not use bitbucket.org? It’s free for up to 5 users and it has both Git and Mercurial.
    I like your screencast, nice work.

  34. What’s the best way to go about using beanstalk with site built off of EE? Make everything “Save Template as File”?

  35. Henrik Helmers
    Permalink to comment#

    While Beanstalk is great for teams, if you just need version control for yourself, I use a post-commit-hook in Git in a way not too different from this: http://ryanflorence.com/deploying-websites-with-a-tiny-git-hook/

    • There are more elegant solution to what that articles suggests, but yes, if you have git installed on your server, you don’t need beanstalk. The problem is you don’t have git installed in almost all shared hosting and when you do client work, you either have to buy a beanstalk plan or go with git-ftp.

  36. Kwame
    Permalink to comment#

    Always great to learn from here

  37. Awesome stuff… you’ve inspired us and kept us smiling(again). Thanks Chris!

    Our latest “how to” video to translate all of this for non-technical folks (BitNami cooperated!)

    http://labzip.com/develop-wordpress-sites-locally-then-deploy-with-git-tower-beanstalk-thanks-chris-coyier-mark-jaquith/

  38. Thanks for this screencast. I may still suck at git and I’m on windows. But I got a Free account on Beanstalk and after using it I was so amazed. I felt stupid for not using it with some of my own projects as I needed deployment and after going live, updating was such a pain in the ass. I kept breaking everything.

    Now I just create a setup for Public Test Realm where people can test stuff and point out bugs. Once I’m happy I can manually Deploy the updated website to my Live server and be setup without problems.

  39. Martin
    Permalink to comment#

    Hola Cris, como va! Desde Argentina te escribo para saber que pasa con los screencast que no haces mas. Aprendo muchísimo y ya los vi a todos 100 veces y quisiera que hagas mas. Saludos.

  40. It’s so funny watching you stumble through this :) I’m all like “Wait, wait, I know what’s wrong, and I know where that is!” watching that video :P

    Great screencast though :) thanks!

  41. LittleG
    Permalink to comment#

    That was groktastic

    Confirmed/answered a ton of things i’ve had rattling around in there for ages .

    Thanks a lot.

  42. Great walkthrough! I am guessing if you decided you wanted to keep a full git repo like you did you would simply exclude the wp-config.php file from your commits?

  43. Thanks, great tutorial.

    After watching this tutorial I want out and upgraded my beanstalk account so I could make use of deployment, works great however i’m having trouble deploying to godaddy.com hosted website.

    When trying to deploy i’m getting a “While trying to deploy revision 7977a… of your repository to the .com server an error occurred. Your FTP server is blocking connections from Beanstalk’s IP address: 69.20.73.216.” error.

    I have contacted my host and they insure me they are not blocking this URL.

    Anyone has success deploying to a godaddy.com shares hosting server?

    Thanks again.

    • Spencer Hurst
      Permalink to comment#

      Alas! I’ve been having the same issue but with Bluehost. Stayed up laaaate talking to their customer service, with them assuring me that no IP address is being blocked from Beanstalk’s IPs and that I was inputing the credentials incorrectly. Credentials that I was literally copying verbatim from my FTP client that was connecting no problemo.

      Then I talked to Bluehost this morning and they informed me that yes – in fact – they are blocking those IP addresses and there is nothing that they can do about it. They said services like that generally don’t work on their servers and no they will not unblock them for me.

      Woe is me. Looks like I’m switching hosting…any recommendations?

  44. Chris, this video is awesome and the timing couldn’t have been better. I was just evaluating GitHub vs Beanstalkapp and checking out Tower as well. Keep up the good work!

  45. Wow I wish I saw this video sooner. We started using Git also. We were befuddled about how to efficiently launch changes to the website. I’m going to suggest Beanstalk because right now, we’re doing manual backups and putting them on the production server.

    Thanks Chris!

  46. paaul

    nice

  47. Hey Chris,

    Loved the screencast, I’ve tossed MAMP in favor of a native Apple setup. Ran into too many problems.

    For future reference, MAMP will often keep the mysql process running with a restart. The easy way to kill it is a little command line magic:
    run top
    find the mysql process id # and run the command kill -9 [pid]

    Like yourself, I’ve been getting away from Coda in favor of local development and git. In my case I’m luvin phpFog for my WPsites

    Thanks again Chris

  48. fran
    Permalink to comment#

    a very sincere screencast! (or vlog or whatever), I like it very much, thats how must of us work “lets try to hit this button”. thanks to making me feel normal. This really helps me, I tried beanstalk before and forgot about it because I didnt get it. Right now I am using Coda and Tower and thats how I found you, I googled “coda 2 tower git”.

  49. Scott Rod
    Permalink to comment#

    With the Coda 2.0.1 update, Git issues have been mostly fixed, so I’ve been using that to manage my repos on Bitbucket.
    For anyone else who needs a dedicated GUI for Git, I recommend Gitbox IMO, Gitbox has a very straightforward UI, especially in comparison to SourceTree. It’s cheaper than GitTower, too.

  50. Matthew
    Permalink to comment#

    My only issue with this method for deployment… databases. Deploying them and keeping them accurate is the biggest pain between local and remote. All the users are editing content on remote, but if I add a plugin that changes some database settings. How do I keep them separate?

  51. Scott Rod
    Permalink to comment#

    Chris,

    Part of me wishes you weren’t using Beanstalk for automatic deployment. This takes the pain/fun from setting up an automated “hook.”

    Perhaps another video tut, “Git from the Ghitto” for us folks using free Git UI tools and Bitbucket would be greatly appreciated.

    Although, I use the Terminal for simple tasks, I am too dumb for it. Therefore, tutorials overloaded with command lines tend to melt my brain.

    I develop locally. My repo is hosted on BitBucket. Anytime I push an updated file to my repo, I’d like it to automatically pull from my repo and update it on my live production site.

    Using SSH via Terminal, I have cloned my repo (.git directory) onto my production site as well.

    To make deployment happen, I call the command, git pull origin master

    A question for anyone – Is there an automated deployment method for the rest of us who don’t use Beanstalk?

    The following tutorials have given some helpful insight, but I’ve hit a wall.
    http://ryanflorence.com…
    http://brandonsummers.name/…

  52. I recently found this article that teaches you how to do automatic deployment to server from BitBucket (or GitHub). I haven’t tried it out yet to see if it works with my cheap shared GoDaddy hosting plan, but if anyone figures it out let me know.

    http://brandonsummers.name/blog/2012/02/10/using-bitbucket-for-automated-deployments/

    Tri

  53. Philip Hetue
    Permalink to comment#

    Here’s an article from NetTuts that does automatic deployment using the “Post-Receive URLs” GitHub hook and a php file that runs the pull command on the server. Seems straightforward enough…are there issues with this that I’m not seeing?

    • I love the idea of that and I’ve tried it myself. Even talked to Jeffrey about it. But the fact is very few web hosts (literally none that I’ve ever tried) allow you to run BASH from PHP e.g. the final baller move:

      <?php `git pull`;  ?>

      They won’t even let you turn it on if you know what you’re doing.

  54. Thank you dude. You rock.

    I have been in petrified and in denial about the whole git thing for so long now and your clumsy screencast got me onboard. In fact, the clumsiness of your screencast (and I mean that with all respect) actually helped me get on board because you helped me realise it’s okay to be scared of it and to stumble your way through.

    I am now committing and pushing. Boom!

    Keep up the awesomeness.

    Troy.

  55. Antonio Lettieri
    Permalink to comment#

    Hey Chris.

    Thanks for another great screen cast!

    A quick note on filtering values in SQL.

    You would want to use “LIKE” to filter through the results, combined with the percent (%) symbol as a wildcard. In your case you would have wanted to use option_value -> LIKE -> % chriscoyier.net%.

    That would have returned all rows containing chriscoyier.net.

    Thanks man! Keep up the awesome!

  56. Chris Peckham
    Permalink to comment#

    Is there anyone reading this who is using GIT or SVN (or anything else for that matter) and has experience regarding non-latin characters in the directory names (which may be necessary to support International URLs)?

    I’d be especially interested to hear from anyone who manages branches containing files with non-latin pathnames on a variety of platforms (Windows, Mac, Linux), as I understand that this may be a challenging scenario.

    Cheers,
    Chris

  57. Thanks, Chris. Helpful as always. And please explain how you avoided throwing an f-bomb or two. Or did you edit those out?

    Loving the SQL and local-config tips in the threads as well. I’m always surprised how much time I spend at migration time. WIll have to try that plugin, but I’m skeptical.

  58. Great screen cast as always! Thanks a lot.

    Have you taken a look at FTPloy its a service that will deploy commits to github or Bitbucket repo’s to your live server via FTP. Its still in Beta at the moment but its been working well for me. A good option if you dont want to pay for the beanstalk account perhaps.

    • Looks awesome! Like you said though, only free in Beta so I wouldn’t advise anyone to switch to it JUST because it’s free right now.

    • Permalink to comment#

      FTPloy is nice looking. My only concern at the moment being you can only deploy to one server so if you deploy to staging but also, need to deploy to production right after that then you’re out of luck.

      Thanks for the link, though!

  59. Petri
    Permalink to comment#

    Thank you Chris, that was awesome. I’ve been to css-tricks several times trough googling solutions for some problems, but I had no idea you have such awesome screencasts. I love how this was not like the cooking shows where they have all the ingredients cut in advance and in lovely little cups…But more like how it’s in real life :D
    Laughed out loud several times.

    Before I’m going to dig in, getting beanstack and tower (and probably going trough all the comments to solve problems I’m going to be facing), I just want to make sure it works both ways with this method?
    So if I make changes to the remote version, can I sync it with my local version using this method?

    Also, this screencast is now about one year old. Is this still the easiest way to accomplish what we’re after?

    Thank you Chris!

    • Hi Petry,
      I found a great blog post about that problem. The advantage is that you don’t need beanstalk to push your changes to your remote server.

      Check it out, really worth it.
      http://mattbanks.me/wordpress-deployments-with-git

    • Spencer Hurst
      Permalink to comment#

      Thank you so much Sebastian…I was struggling to get beanstalk working with Bluehost and that article by Matt Banks is the perfect solution. Aaand I can save a few bucks by not having to use Beanstalk, although it does look like a pretty fantastic solution.

  60. Daniel Nice
    Permalink to comment#

    HI Chris,

    Great post, you seem to have the exact problems and solutions that I have, I am finding myself coming to CSS Tricks more and more, thanks for the great content and the real life screencasts, great work! Keep it up!

  61. Sebastian
    Permalink to comment#

    I’m glad the article helped somebody else as well but you should thank Matt! :-)

  62. Does anyone know of a free / one time purchase solution for git + auto deployment? I can’t believe Beanstalk is the only solution that exists for transferring wordpress sites from local to live via git.

    For full-time developers paying for Beanstalk makes sense, but not for those of us who where many hats and probably do web projects less often. It’s too expensive to justify for part-timers life myself.

    • I’m in the same position where I can’t really justify paying for Beanstalk with the few free-lance projects I pick up. Luckily, it really isn’t rocket science setting it up yourself.

      As mentioned above, Matt Banks has a really good article on setting this up manually on your server. It’s basically setting up a git repo on your server and adding a post commit hook to push it to a specific directory after the commit. It takes a little bit more work, but is free and worth the effort.

  63. Landon Baine
    Permalink to comment#

    I use webenabled.com as my staging server. Basically, I work locally, then use Coda 2 to publish the changes to webenabled. This is not using git or any version control. I am looking at using git (via Tower) but confused on whether beanstalk replaces my need for webenabled or if they just work together. I currently use webenabled to give the client access to the site while in production also.

    My thinking is create local > submit to beanstalk > deploy to webenabled staging > once complete deploy to production.

    Am I thinking correctly?

    Landon

  64. For those looking for a completely free solution to Git Deployment, check out this post I wrote:

    http://adamjohnsondesign.com/blog/moving-ftp-git-deployment-designers-guide/

    Hope folks find it useful.

  65. Simon MacFadyen
    Permalink to comment#

    I absolutely love this video. It reminds me a little of the ‘Live Webcast Fail’. http://www.youtube.com/watch?v=et_MmlTxMXA

    Would be nice to see a revisited version maybe with collaboration between a team?

  66. Permalink to comment#

    Any opensource alternatives for Beanstalk?

  67. For those looking for a local alternative of hosted deployments, I’ve written a little PHP script that heps with that. It si called PHPloy and is tightly-coupled with Git to determine what which files where edited/added/deleted and uploads them accordingly. You put your FTP details in a deploy.ini file and run just a command to deploy:

    phploy
    

    You can also deploy to multiple servers at once. And if you have multiple servers configured, you can select to deploy to one of them like this:

    phploy --server staging
    

    There is more that can be done – check it out on Github: https://github.com/banago/PHPloy

Leave a Comment

Posting Code

  • Use Markdown, and it will escape the code for you, like `<div class="cool">`.
  • Use triple-backticks for blocks of code.
    ``` 
    <div>
      <h1>multi-line block of code</h1>
      <span>be cool yo.</span>
    </div>
    ```
  • Otherwise, escape your code, like <code>&lt;div class="cool"&gt;</code>. Markdown is just easier though.

Current ye@r *

*May or may not contain any actual "CSS" or "Tricks".