Slide 1

Slide 1 text

Web デザイナ向け
 GitHub ハンズオン Satoshi Ebisawa (@satococoa)

Slide 2

Slide 2 text

自己紹介 • 海老沢 聡 • @satococoa • プログラマ (Ruby, iOS) • #yokohamarb, #p4d, #yurudev

Slide 3

Slide 3 text

今日やること 1. GitとGitHubの違いって? 2. GitHubで開発する手順 3. 最低限の Git 4. やってみよう"(\( ⁰⊖⁰)/)"

Slide 4

Slide 4 text

Gitって何? • 分散バージョン管理システム • コマンドラインツール (黒い画面) • なんか難しそう。怖い。

Slide 5

Slide 5 text

Gitって何? • 分散バージョン管理システム • コマンドラインツール (黒い画面) • なんか難しそう。怖い。 一旦忘れてください!

Slide 6

Slide 6 text

GitHubでコミュニケーション するためのツール

Slide 7

Slide 7 text

(補足…) • Git と GitHub は違います。 • Git はバージョン管理の 『ツール』 • GitHub は Git を使ったコミュニティサイト (SNS みたいな)

Slide 8

Slide 8 text

GitHubで開発する手順は
 大きく分けて2通り 'PSL͠ͳ͍ 'PSL͢Δ ❓

Slide 9

Slide 9 text

Fork #とは

Slide 10

Slide 10 text

他人のリポジトリ*を自分のアカウント上に そっくりそのままコピー *(ソフトウェアごとのソースコード置き場)

Slide 11

Slide 11 text

Rails だって、この通り 自分専用 Rails ⁉️

Slide 12

Slide 12 text

他人のリポジトリに書き込み権限がなくても
 自分のリポジトリとしてコピーしちゃえば
 やりたい放題❗️

Slide 13

Slide 13 text

Fork する! • コミット権 (書き込み権限) が無い • オープンソースソフトウェアに貢献したい • バグ修正とか、新機能の提案とか… • 派生したプロダクトを作りたい

Slide 14

Slide 14 text

Fork しない! • コミット権がある • チーム開発してる • お仕事で GitHub 使ってるときはこっちが多い 今回はこっち!

Slide 15

Slide 15 text

Forkしない開発の手順 master A master A’ A” clone branch commit commit push & PR GitHub 上 手元の PC 上

Slide 16

Slide 16 text

Git用語集(コワクナイヨ) • コミット: 変更履歴の一つ一つ • ブランチ: 一連のコミットの固まり • header-design とか modify-login-page とか • マスター: master という特別なブランチ • ブランチのきりがよくなったらここに取り込む (マージ) • Pull Request: ご提案「こんなんどう?」

Slide 17

Slide 17 text

まとめると… 1. clone: GitHubから手元に持ってきて… 2. branch: 作業内容に応じて名前をつけて… 3. 編集: お好きなエディタで編集して… 4. commit: 変更内容と意図を記録して… 5. push: GitHub 上にアップロードして… 6. Pull Request: ご提案「こんなんどう?」

Slide 18

Slide 18 text

セーブ master LV 10 1:00 36 / 36 login-page LV 14 1:28 58 / 58 EMPTY EMPTY 私的: ブランチってこんなイメージ ダンジョンの中でセーブするとき
 スロット分けますよね?? Fjörd Fantasy IV より

Slide 19

Slide 19 text

やってみよう‼️ bit.ly/p4d-phpcon2014

Slide 20

Slide 20 text

GitHubを楽しくするツール • Emoji Cheat Sheet • LTTM • alfred-misawa • alfred-sushiyuki $PQZSJHIU˜BXBZVLJ IUUQBXBZVLJOFUTVTIJZVLJ