Use the left/right arrow keys to navigate.

Welcome to

Code Management

for Designers

Future of Web Design, NYC November 2011

What it says on the tin

"Become a more powerful designer by learning how to deploy your sites with Git and cloud hosting solutions like Heroku."

Hi!

  • I'm @jonathanpberger
  • I use Git every day to make stuff at @pivotallabs
  • My background is in philosophy and then design and now development

Who are you?

Show of hands:

  • Who's used any version control before?
  • Who's used git before?
  • Who uses the terminal regularly?

The Plan

  • 40m to Speed through a ton of material.
  • Try to show actual use and common workflows. No time to be exhaustive
  • This will be a live-coded technical talk.
  • Act 1 - Solo Git & Heroku
  • Act 2 - Team Git
  • Act 3 - Setting-up, links to more

I'm going to tell a story about ping pong.

Act 1 - Solo Git

Copy an Open Source project for use.

Using Github

Github.com is a web-based hosting service for projects that use the Git revision control system.

Copying a project with Git Clone

  • First we'll fork the Pivot Pong project.
  • Then we'll take our fork and git clone pivot-pong.

"Git clone diagram."

Making an edit

  • Let's change the name of the app.

"Editing a file."

Seeing what changed

  • git status
  • git diff

Commiting Changes

  • git commit -am

"Git commit."

Distributed VCS

  • This works even if when you're offline(!)

Pushing code to the Repo

  • git status
  • git log
  • git push origin master

"Git staging diagram."

Let's try another

  • Let's try running the app.
  • Change the db.
  • Change the styling.

Staging multiple files

  • Let's use the GUI: GitX
  • Each commit should be a unit of work.
  • This isn't always a single file or single line.

"Pushing multiple commits."

Deploying to the Web

"Heroku is a cloud application platform...[that] lets app developers spend 100% of their time on their application code, not managing servers, deployment, ongoing operations, or scaling."

Deploying with Heroku

  • heroku create
  • git push heroku master: deploy to new heroku instance
  • heroku rename

"Deploying to Heroku."

Act 2 - Team Git

In which the A17 House Style is applied.

  • My friend, Mr. FakeyPants didn't like the styling, so he made his own changes.
  • I'll set him up as a collaborator on the site.
  • I want to work on top of those.

Mr. Fakeypants Goes to Work

Mr. Fakeypants does:

  • In real life, he'd git clone, edit, git commit, git push, etc.
  • For the purposes of this demo, we'll use GitHub's live edtiing feature.

I do some more work

  • Makes changes and commits them (git add, git ci)
  • git push origin master

Oh noes! It breaks. Conflict!

  • I want to work on top of his changes
  • First I have to git rebase
  • Now I can git push
  • Push successfully.
  • Deploy again to Heroku.

Act 3 - Setting-up

Trying this at home

You've seen me do it; here's what you need to do:

  • To use git: Install Git on your machine using Homebrew.
  • To backup and share: create a Github account, set up a remote repo
  • To deploy to the web: set up a Heroku account
  • Install gem install heroku to make deploying easier

The Links Slide:

Some other fun stuff to explore:

This is intermediate git that I use every day:

  • git branch
  • git stash
  • git reset HEAD^
  • git blame

For more info

  • http://jonathanpberger.com/code_management
  • Say hi at @jonathanpberger
  • or jonathanpberger on github, gmail, forrst, etc...

Thanks!

Experiment safely

  • git branch

Attribute changes to someone

  • git blame

Quickly get back to a clean state

  • git stash

Unstage your last few commits

  • git reset HEAD^

Thanks again!