Web デザイナのための GitHub ハンズオン

Transcript

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

2. 自己紹介 • 海老沢 聡 • @satococoa • プログラマ (Ruby, iOS)

   • #yokohamarb, #p4d, #yurudev

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

   ⁰⊖⁰)/)"

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

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

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

7. (補足…) • Git と GitHub は違います。 • Git はバージョン管理の 『ツール』

   • GitHub は Git を使ったコミュニティサイト (SNS みたいな)

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

9. Fork #とは

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

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

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

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

    • 派生したプロダクトを作りたい

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

    今回はこっち！

15. Forkしない開発の手順 master A master A’ A” clone branch commit commit

    push & PR GitHub 上 手元の PC 上

16. Git用語集(コワクナイヨ) • コミット: 変更履歴の一つ一つ • ブランチ: 一連のコミットの固まり • header-design とか

    modify-login-page とか • マスター: master という特別なブランチ • ブランチのきりがよくなったらここに取り込む (マージ) • Pull Request: ご提案「こんなんどう？」

17. まとめると… 1. clone: GitHubから手元に持ってきて… 2. branch: 作業内容に応じて名前をつけて… 3. 編集: お好きなエディタで編集して…

    4. commit: 変更内容と意図を記録して… 5. push: GitHub 上にアップロードして… 6. Pull Request: ご提案「こんなんどう？」

18. セーブ master LV 10 1:00 36 / 36 login-page LV

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

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

20. GitHubを楽しくするツール • Emoji Cheat Sheet • LTTM • alfred-misawa •

    alfred-sushiyuki $PQZSJHIU˜BXBZVLJ IUUQBXBZVLJOFUTVTIJZVLJ