Upgrade to Pro — share decks privately, control downloads, hide ads and more …

WordCamp St Louis 2014

WordCamp St Louis 2014

My chat on speeding up your theme development workflow with automation. I showed some tools I use regularly YeoPress Grunt and Git for installation, live reload and compiling as well as basic deployments.

Joshua Ray

March 01, 2014
Tweet

More Decks by Joshua Ray

Other Decks in Programming

Transcript

  1. Adding Automation
    to your theme development workflow
    Joshua Ray
    WordCamp St. Louis 2014
    @pdxOllo
    http://ollomedia.com
    http://github.com/Ollo

    View full-size slide

  2. Take the repetitive tasks for every WP project
    set up localhost
    set up local database
    find WP core or download again because you can’t remember
    where you saved it last.
    run 5 minute install
    install favorite theme or boiler
    install favorite plugins
    build push to git
    set up WP on remote server { dev, staging, production }
    install favorite plugins
    use ftp? to upload modified theme / boiler for review

    View full-size slide

  3. Automate it
    Install
    Build
    Deploy

    View full-size slide

  4. Automation isn't about
    being lazy its about being
    efficient.
    ~Addy Osmani

    View full-size slide

  5. As an engineer, there is a short list of
    tools that you must be rabid about.
    Rabid. Foaming at the mouth crazy.
    ~Michael Lopp

    View full-size slide

  6. Don’t fear your terminal

    View full-size slide

  7. The officially un-official Yeoman
    generator for WordPress
    https://github.com/wesleytodd/YeoPress
    Requires Node
    http://nodejs.org/
    Requires Yeoman
    http://yeoman.io/

    View full-size slide

  8. $ npm install -g yo
    $ npm install -g yo generator-wordpress
    $ yo wordpress

    View full-size slide

  9. Grunt
    The Javascript Taskrunner

    View full-size slide

  10. Already Installed by Yeoman :D
    Grunt Cli
    http://gruntjs.com/getting-started#installing-the-cli
    Plugins
    http://gruntjs.com/plugins
    $ npm install -g grunt-cli

    View full-size slide

  11. distributed version control system

    View full-size slide

  12. If you’re not already using a version control
    system START NOW!

    View full-size slide

  13. Webhooks
    http://developer.github.com/webhooks/

    View full-size slide

  14. // Init vars
    $LOCAL_ROOT = "/var/www/my_new_site";
    $LOCAL_REPO_NAME = "public_html";
    $LOCAL_REPO = "{$LOCAL_ROOT}/{$LOCAL_REPO_NAME}";
    $REMOTE_REPO = "[email protected]:jonathanstark/my_new_site.git";
    $DESIRED_BRANCH = "dev";
    // Delete local repo if it exists
    if (file_exists($LOCAL_REPO)) {
    shell_exec("rm -rf {$LOCAL_REPO}");
    }
    // Clone fresh repo from github using desired local repo name and checkout the
    desired branch
    echo shell_exec("cd {$LOCAL_ROOT} && git clone {$REMOTE_REPO} {$LOCAL_REPO_NAME} &&
    cd {$LOCAL_REPO} && git checkout {$BRANCH}");
    die("done " . mktime());

    View full-size slide

  15. Dandelion
    https://github.com/scttnlsn/dandelion
    Incremental Git repository deployment for OS X and Linux.
    $ gem install dandelion

    View full-size slide

  16. scheme: sftp
    host: example.com
    username: user
    password: pass
    path: path/to/deployment
    exclude:
    - .gitignore
    - dandelion.yml
    - folder/
    additional:
    - public/css/print.css
    - public/css/screen.css
    - public/js/main.js

    View full-size slide

  17. $ git commit -am “my new feature”
    $ git push origin master
    $ dandelion deploy

    View full-size slide

  18. Others
    Beanstalk
    http://beanstalkapp.com/
    FTPloy
    http://ftploy.com/
    Capistrano
    http://capistranorb.com/
    Rocketeer
    http://rocketeer.autopergamene.eu/

    View full-size slide