Git-it, Share it - Speaker Deck

Slide 1

Slide 1 text

Git-it, Share it Building servers and tools to teach the Gits! Jessica Lord, GitHub github/jlord ! ⚡ #

Slide 2

Slide 2 text

Why Git-it Building Git-it Git-it and GitHub ? # $

Slide 3

Slide 3 text

Why Git-it ?

Slide 4

Slide 4 text

Wanted: GitHub hosted hack night Leave with your first pull request, shiny green contribution squares Late 2013

Slide 5

Slide 5 text

NodeConf 2013 @substack creates `stream-adventure` module @rodvagg creates `workshopper` framework Summer 2013 NodeSchool

Slide 6

Slide 6 text

Summer 2013

Slide 7

Slide 7 text

www.nodeschool.io `stream-adventure` `learnyounode` `levelmeup` `byewiser` `functional javascript` …

Slide 8

Slide 8 text

jlord finds ways to write Node at GitHub Alternative talk title: (we do a lot of Ruby)

Slide 9

Slide 9 text

Building Git-it #

Slide 10

Slide 10 text

Building Git-it fork`workshopper` GitHub API create fork-able repo @reporobot teaching Git #

Slide 11

Slide 11 text

Git Real Real terminal. Real Git. Real GitHub. And one non-real human, but real robot.

Slide 12

Slide 12 text

GitHub Flow » GET GIT ! » REPOSITORY » COMMIT TO IT » GITHUBBIN » REMOTE CONTROL » FORKS AND CLONES » BRANCHES AREN'T JUST FOR BIRDS » IT'S A SMALL WORLD » PULL, NEVER OUT OF DATE » REQUESTING YOU PULL, PLEASE » MERGE TADA!

Slide 13

Slide 13 text

Building Git-it fork`workshopper` GitHub API create fork-able repo @reporobot teaching Git #

Slide 14

Slide 14 text

No content

Slide 15

Slide 15 text

`workshopper` typical Compare console.log(“Hello World”) // Hello World console.log(“Hello World”) // Hello World Expected: Submitted:

Slide 16

Slide 16 text

But Git — Fork of `workshopper` that lets me run Git and requests in the background to verify user did the right thing. Is not JS, isn’t in files.

Slide 17

Slide 17 text

$ Git-it git-it verify the! verify.js! for each challenge run Git in background hit GitHub API hit my server other things

Slide 18

Slide 18 text

Toolbox $ Git-it patchwork GitHub API @reporobot

Slide 19

Slide 19 text

$ Git-it patchwork user

Slide 20

Slide 20 text

$ Git-it GitHub API @reporobot patchwork user

Slide 21

Slide 21 text

Git-it, checking user’s Git in verify.js: exec('git --version', function(err, stdout, stdrr) { var gitOutput = stdout.trim() if (gitOutput.match("git version")) console.log("Found Git installed.") else console.log("Found no Git installed.” }) Compare Git Expected/Actual

Slide 22

Slide 22 text

git --config user.username jlord Useful Made up Thing So that I can always know a user’s GitHub name for which to make queries with! exec('git config user.username', function(e, so, se) { var user = stdout.trim() })

Slide 23

Slide 23 text

Building Git-it fork`workshopper` GitHub API create fork-able repo @reporobot teaching Git #

Slide 24

Slide 24 text

Git-it to GitHub API Verify user set up GitHub account request(url + user + '.json', {json: true}, function (error, response, body) { if (error) return console.log(error) if (!error && response.statusCode == 200) { if (body.error) return console.log("GitHub account matching…”) else console.log("You're on GitHub!") } }) Use require(‘request’) directly from app

Slide 25

Slide 25 text

Building Git-it fork`workshopper` GitHub API create fork-able repo @reporobot teaching Git #

Slide 26

Slide 26 text

A repo to fork GH Pages hosted site with the names of all who have completed the workshop. jlord/patchwork User submits name in Pull Request.

Slide 27

Slide 27 text

No content

Slide 28

Slide 28 text

Building Git-it fork`workshopper` GitHub API create fork-able repo @reporobot teaching Git #

Slide 29

Slide 29 text

@reporobot

Slide 30

Slide 30 text

No content

Slide 31

Slide 31 text

@reporobot Node.js server Digital Ocean Droplet maxogden/taco GitHub API via michael/github $5

Slide 32

Slide 32 text

No hooks on added as a collaborator :( reporobot.jlord.us/push #8: It’s a small world @reporobot account email with cloudmailin.com which sends JSON to server. {JSON}

Slide 33

Slide 33 text

#8: It’s a small world Check if user added @reporobot as collaborator http://reporobot.jlord.us/collab?username= Git-it verify @reporobot, GitHub API permissions.push?

Slide 34

Slide 34 text

@reporobot, GitHub API write to repo

Slide 35

Slide 35 text

Git-it sends request to @reporobot who hits the GitHub API to check for a PR, responds true/false #10: Request you pull http://reporobot.jlord.us/pr?username= Webhook on patchwork sends push on PR to @reporobot http://reporobot.jlord.us/orderin

Slide 36

Slide 36 text

Check filename (contributors/add-username.txt) #10: Request you pull Check file content (ascii art) Not Ok? Comment. All ok? Merge!

Slide 37

Slide 37 text

add name, date, ascii to contributors.json on server Rebuild Patchwork Site rebuilds /patchwork site @reporobot is a collaborator on jlord/patchwork @reporobot also a static site generator

Slide 38

Slide 38 text

No content

Slide 39

Slide 39 text

Node.js, GitHub API FTW email json requests in collab. check PR check requests out write ascii permission.push loop PRs comment PR merge PR push patchwork

Slide 40

Slide 40 text

a little crazy Testing use test accounts and run through: create branch, create file (with ascii art), create PR. @reporobot is doing the writing which means each test account must have patchwork fork & RR as a collaborator. then delete it all & repeat.

Slide 41

Slide 41 text

Share Git-it $

Slide 42

Slide 42 text

Patchwork Night

Slide 43

Slide 43 text

No content

Slide 44

Slide 44 text

NUX Team NUX Team: designers, developers,! user research How can GitHub.com be easier, better for new users? What is being new to GitHub like? What tools can we make to help? Experiment!

Slide 45

Slide 45 text

Patchwork at GitHub Future? Soon to be more places! UK! % Merge conflict!

Slide 46

Slide 46 text

Share what you know Host an event! nodeschool.io/events Build a workshop! Mentor at an event! nodeschool.io/events Watch the GitHub blog - github.com/blog

Slide 47

Slide 47 text

Takk! @jllord gh/jlord