Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.
はじめてのGit
For コーダー&デザイナー
(非エンジニアな人)
CHAPTER1
そもそも、どんなメンドクサイことがよく起こっているのか
のまえに・・・
Git
こんなことありませんか?
全体リニューアル中なのに、
いまの本番の修正が入る
そういえばさ
このバナーだけ
先にアップしてくれ
ない?
あと
新しい方のデザインにも
バナーいれといて
こんなこともありませんか?
修正したファイルを
アップしてもらうのが
超面倒
すいません
index.htmlと
shop1.htmlと
basic.cssと
shop_page.cssをアップして
ください
index.htmlが/www/viewの下で
shop1.htmlが/static/pagesの下で
basi...
あんなこともありませんか?
最新っぽい名前の
フォルダが出来まくる
で、どれが最新?
こんなことだってありませんか?
作業中のファイルが
いつの間にか
上書き保存されていた
修正終わった!
えっ?それ、今
上書き保存しちゃったけど
たまにありますよね
そんなことをふせぐのが
です
Git
CHAPTER1のまとめ
1. バージョンがごっちゃになる
2. 作業ファイルのやりとりが面倒
3. 上書き保存のリスクが高し
よくあるアチャー
1. バージョンがごっちゃになる
2. 作業ファイルのやりとりが面倒
3. 上書き保存のリスクが高し
Gitならこれができます
1. バージョンがごっちゃになる
2. 作業ファイルのやりとりが面倒
3. 上書き保存のリスクが高し
Gitならこれができます自動でできるよ!
最新版もわかるよ!
1. バージョンがごっちゃになる
2. 作業ファイルのやりとりが面倒
3. 上書き保存のリスクが高し
Gitならこれができます
コマンド
一つで
できるよ
1. バージョンがごっちゃになる
2. 作業ファイルのやりとりが面倒
3. 上書き保存のリスクが高し
Gitならこれができます
上書き保存防止
&
うまくくっつけてくれるよ!
CHAPTER2
で、Gitとはなんぞや?
では早速
ができることを
見てみましょう
Git
そのまえに
のざっくりした仕組みを
3つだけ覚えましょう
Git
覚えておくと
あとあとラクです
その1
その①
自分と、共有の作業場所がそれぞれあります
共有の環境
(本番など)
Aさんの環境 Bさんの環境
自分の作業場所は、
基本的に勝手に上書きされることはありません
Aさんの環境 Bさんの環境
他人の環境は
上書きできません
Aさんの環境 Bさんの環境
その2
その②
自分と、共有の作業場所のファイルのやりとりは
Gitを使っておこないます
共有の環境
(本番など)
Aさんの環境 Bさんの環境
Git Git
AさんからBさんに渡したいものも
基本的には共有の環境を通すことになります
共有の環境
(本番など)
Aさんの環境 Bさんの環境
Aさんの環境 Bさんの環境
共有の環境
(本番など)
Aさんの環境 Bさんの環境
共有の環境
(本番など)
OK?
ではその3
その③
作業内容を、スクリーンショットのように
場所ごとまるっと保存しておけます
「いつ」「どのファイルの」「どこを」「どのように変更したか」
ごと、まるっと保存します
7/20に、Aというフォルダの
Bというファイルの
5-8行目だけ変更したよ
7/20 15:58の状態
7/22には、Aというフォルダの
Bというファイルの
9-12行目だけ変更したよ
7/22 9:37の状態
これがミソ
Aさんの環境
より具体的にみてみましょう
Bさんの環境
Aさんの環境
より具体的にみてみましょう
Bさんの環境
このフォルダとファイルを
新しく追加しました
Aさんの環境
より具体的にみてみましょう
Bさんの環境
この状態をいったん
「保存」します。
Aさんの環境
より具体的にみてみましょう
Bさんの環境
【7/20 15:58の状態】
Aさんの環境
より具体的にみてみましょう
Bさんの環境
【7/20 15:58の状態】
を、共有の環境に
アップします
Aさんの環境
より具体的にみてみましょう
Bさんの環境
共有の環境
Aさんの環境
より具体的にみてみましょう
Bさんの環境
共有の環境
Aさんの環境
より具体的にみてみましょう
Bさんの環境
共有の環境
共有の環境が、
【7/20 15:58の状態】
になりました
Aさんの環境
より具体的にみてみましょう
Bさんの環境
共有の環境
つぎに、
Bさんが作業するには
共有の環境から
【7/20 15:58の状態】
を持ってきます
Aさんの環境
より具体的にみてみましょう
Bさんの環境
共有の環境
Aさんの環境
より具体的にみてみましょう
Bさんの環境
共有の環境
Aさんの環境
より具体的にみてみましょう
Bさんの環境
共有の環境
Bさんの環境も、
【7/20 15:58の状態】
になりました
これらの作業は
コマンドで
サクサクできます
(demoみてね)
demo
このように、Gitを使うと
が
とっても簡単です
複数のフォルダや
ファイルのやりとり
さらに!
同じ文章を変更していても、
変更箇所がかぶっていなかったら
自動でくっつけられちゃいます
ここはAさんが
変更したところ
ここはBさんが
変更したところ
Aさんのファイル Bさんのファイル
+
Aさんのファイル Bさんのファイル
+
Aさんのファイル Bさんのファイル
+
Aさんのファイル Bさんのファイル
ね?
共同作業に
超便利!
CHAPTER3
Gitのキホンの動きを知る
では最後に
Gitの基本用語
&
基本的な動きを覚えましょう
用語①
ブランチ
枝 という意味です
人生においては
「あのときこうしていれば…」
というのは妄想ですが、
Gitでは実現できます
「A」というファイルに
「AAA」という内容追加した
おなじ「A」というファイルに
「BBB」という内容追加した
これらの、それぞれを
「ブランチ」と呼びます
「A」というファイルに
「AAA」という内容追加した
おなじ「A」というファイルに
「BBB」という内容追加した
←ブランチA
←ブランチB
このブランチを切り替えると、
開発環境もかわります
例。
純情ブランチ
不純ブランチ
ちなみにこの例は
私のGitを全面的にサポートしてくれた
N井先輩がおしえてくれた例です
ブランチは
好きな時点の状態から作れて
いくつでも作れます
ブランチA
ブランチB
ブランチB
ブランチA
ブランチC
ブランチC
ブランチC
ブランチA
ブランチB
そして
合体させることもできます
ブランチAと
ブランチBの内容を
合体!
この、合体することを
マージ
といいます
といいます
テストに出るよ!
そして先ほどからでている
ナゾの○
これは、状態を保存した!
というその状態のことで
コミット
といいます
といいます!
超テストに出るよ!
つまり、Gitで
バージョンを管理すると
いうのは
ブランチ
に、
コミット
を、
たくさん積んでいく
ことなのです
ブランチA
ブランチB
ブランチB
ブランチA
ブランチC
ブランチC
ゲーマーな方なら
ピンと来やすいと思いますが
いろいろな人生を
その都度セーブするような
そんなイメージですネ
次回「Gitをはじめよう!」
では
この「ブランチ」と
「コミット」を
実際に練習してみましょう!
今日はここまで!
お疲れ様でした
株式会社ファブリカコミュニケーションズ 企画部 山本紗依子
はじめてのGit forデザイナー&コーダー
はじめてのGit forデザイナー&コーダー
はじめてのGit forデザイナー&コーダー
はじめてのGit forデザイナー&コーダー
はじめてのGit forデザイナー&コーダー
はじめてのGit forデザイナー&コーダー
はじめてのGit forデザイナー&コーダー
Prochain SlideShare
Chargement dans…5
×

はじめてのGit forデザイナー&コーダー

54 304 vues

Publié le

Gitってなに?
プログラマではないけれど、Git導入するメリットは?

いわゆるデザイナーやコーダー向けの、「Gitとは?」「Gitの構造とは?」…のやさしい説明スライドです。

デザイナーやコーダーがGitを使う際には、とっつきにくい「コマンド」をまったく覚えなくてもOK!
便利なGUIツールが沢山出ています。
(私はWindowsなのでGit Extensions派)

Gitの言葉や構造を理解するための、社内勉強会で使った資料です。

Publié dans : Technologie
  • Soyez le premier à commenter

はじめてのGit forデザイナー&コーダー

  1. 1. はじめてのGit For コーダー&デザイナー (非エンジニアな人)
  2. 2. CHAPTER1 そもそも、どんなメンドクサイことがよく起こっているのか
  3. 3. のまえに・・・ Git
  4. 4. こんなことありませんか? 全体リニューアル中なのに、 いまの本番の修正が入る
  5. 5. そういえばさ このバナーだけ 先にアップしてくれ ない? あと 新しい方のデザインにも バナーいれといて
  6. 6. こんなこともありませんか? 修正したファイルを アップしてもらうのが 超面倒
  7. 7. すいません index.htmlと shop1.htmlと basic.cssと shop_page.cssをアップして ください index.htmlが/www/viewの下で shop1.htmlが/static/pagesの下で basic.cssは/www/publicの下で shop_page.cssは/www/hojin/shop の下です どこの ディレクトリ? ふえるほどメンドクサイ
  8. 8. あんなこともありませんか? 最新っぽい名前の フォルダが出来まくる
  9. 9. で、どれが最新?
  10. 10. こんなことだってありませんか? 作業中のファイルが いつの間にか 上書き保存されていた
  11. 11. 修正終わった! えっ?それ、今 上書き保存しちゃったけど
  12. 12. たまにありますよね
  13. 13. そんなことをふせぐのが です Git
  14. 14. CHAPTER1のまとめ 1. バージョンがごっちゃになる 2. 作業ファイルのやりとりが面倒 3. 上書き保存のリスクが高し よくあるアチャー
  15. 15. 1. バージョンがごっちゃになる 2. 作業ファイルのやりとりが面倒 3. 上書き保存のリスクが高し Gitならこれができます
  16. 16. 1. バージョンがごっちゃになる 2. 作業ファイルのやりとりが面倒 3. 上書き保存のリスクが高し Gitならこれができます自動でできるよ! 最新版もわかるよ!
  17. 17. 1. バージョンがごっちゃになる 2. 作業ファイルのやりとりが面倒 3. 上書き保存のリスクが高し Gitならこれができます コマンド 一つで できるよ
  18. 18. 1. バージョンがごっちゃになる 2. 作業ファイルのやりとりが面倒 3. 上書き保存のリスクが高し Gitならこれができます 上書き保存防止 & うまくくっつけてくれるよ!
  19. 19. CHAPTER2 で、Gitとはなんぞや?
  20. 20. では早速 ができることを 見てみましょう Git
  21. 21. そのまえに
  22. 22. のざっくりした仕組みを 3つだけ覚えましょう Git 覚えておくと あとあとラクです
  23. 23. その1
  24. 24. その① 自分と、共有の作業場所がそれぞれあります 共有の環境 (本番など) Aさんの環境 Bさんの環境
  25. 25. 自分の作業場所は、 基本的に勝手に上書きされることはありません Aさんの環境 Bさんの環境
  26. 26. 他人の環境は 上書きできません Aさんの環境 Bさんの環境
  27. 27. その2
  28. 28. その② 自分と、共有の作業場所のファイルのやりとりは Gitを使っておこないます 共有の環境 (本番など) Aさんの環境 Bさんの環境 Git Git
  29. 29. AさんからBさんに渡したいものも 基本的には共有の環境を通すことになります 共有の環境 (本番など) Aさんの環境 Bさんの環境
  30. 30. Aさんの環境 Bさんの環境 共有の環境 (本番など)
  31. 31. Aさんの環境 Bさんの環境 共有の環境 (本番など)
  32. 32. OK?
  33. 33. ではその3
  34. 34. その③ 作業内容を、スクリーンショットのように 場所ごとまるっと保存しておけます 「いつ」「どのファイルの」「どこを」「どのように変更したか」 ごと、まるっと保存します
  35. 35. 7/20に、Aというフォルダの Bというファイルの 5-8行目だけ変更したよ 7/20 15:58の状態
  36. 36. 7/22には、Aというフォルダの Bというファイルの 9-12行目だけ変更したよ 7/22 9:37の状態
  37. 37. これがミソ
  38. 38. Aさんの環境 より具体的にみてみましょう Bさんの環境
  39. 39. Aさんの環境 より具体的にみてみましょう Bさんの環境 このフォルダとファイルを 新しく追加しました
  40. 40. Aさんの環境 より具体的にみてみましょう Bさんの環境 この状態をいったん 「保存」します。
  41. 41. Aさんの環境 より具体的にみてみましょう Bさんの環境 【7/20 15:58の状態】
  42. 42. Aさんの環境 より具体的にみてみましょう Bさんの環境 【7/20 15:58の状態】 を、共有の環境に アップします
  43. 43. Aさんの環境 より具体的にみてみましょう Bさんの環境 共有の環境
  44. 44. Aさんの環境 より具体的にみてみましょう Bさんの環境 共有の環境
  45. 45. Aさんの環境 より具体的にみてみましょう Bさんの環境 共有の環境 共有の環境が、 【7/20 15:58の状態】 になりました
  46. 46. Aさんの環境 より具体的にみてみましょう Bさんの環境 共有の環境 つぎに、 Bさんが作業するには 共有の環境から 【7/20 15:58の状態】 を持ってきます
  47. 47. Aさんの環境 より具体的にみてみましょう Bさんの環境 共有の環境
  48. 48. Aさんの環境 より具体的にみてみましょう Bさんの環境 共有の環境
  49. 49. Aさんの環境 より具体的にみてみましょう Bさんの環境 共有の環境 Bさんの環境も、 【7/20 15:58の状態】 になりました
  50. 50. これらの作業は コマンドで サクサクできます (demoみてね)
  51. 51. demo
  52. 52. このように、Gitを使うと が とっても簡単です 複数のフォルダや ファイルのやりとり
  53. 53. さらに!
  54. 54. 同じ文章を変更していても、 変更箇所がかぶっていなかったら 自動でくっつけられちゃいます ここはAさんが 変更したところ ここはBさんが 変更したところ
  55. 55. Aさんのファイル Bさんのファイル
  56. 56. + Aさんのファイル Bさんのファイル
  57. 57. + Aさんのファイル Bさんのファイル
  58. 58. + Aさんのファイル Bさんのファイル
  59. 59. ね?
  60. 60. 共同作業に 超便利!
  61. 61. CHAPTER3 Gitのキホンの動きを知る
  62. 62. では最後に Gitの基本用語 & 基本的な動きを覚えましょう
  63. 63. 用語① ブランチ
  64. 64. 枝 という意味です
  65. 65. 人生においては
  66. 66. 「あのときこうしていれば…」
  67. 67. というのは妄想ですが、
  68. 68. Gitでは実現できます
  69. 69. 「A」というファイルに 「AAA」という内容追加した
  70. 70. おなじ「A」というファイルに 「BBB」という内容追加した
  71. 71. これらの、それぞれを 「ブランチ」と呼びます
  72. 72. 「A」というファイルに 「AAA」という内容追加した おなじ「A」というファイルに 「BBB」という内容追加した ←ブランチA ←ブランチB
  73. 73. このブランチを切り替えると、 開発環境もかわります
  74. 74. 例。
  75. 75. 純情ブランチ
  76. 76. 不純ブランチ
  77. 77. ちなみにこの例は 私のGitを全面的にサポートしてくれた N井先輩がおしえてくれた例です
  78. 78. ブランチは 好きな時点の状態から作れて いくつでも作れます
  79. 79. ブランチA
  80. 80. ブランチB
  81. 81. ブランチB
  82. 82. ブランチA
  83. 83. ブランチC
  84. 84. ブランチC
  85. 85. ブランチC ブランチA ブランチB
  86. 86. そして 合体させることもできます
  87. 87. ブランチAと ブランチBの内容を 合体!
  88. 88. この、合体することを
  89. 89. マージ
  90. 90. といいます
  91. 91. といいます テストに出るよ!
  92. 92. そして先ほどからでている ナゾの○
  93. 93. これは、状態を保存した! というその状態のことで
  94. 94. コミット
  95. 95. といいます
  96. 96. といいます! 超テストに出るよ!
  97. 97. つまり、Gitで バージョンを管理すると いうのは
  98. 98. ブランチ
  99. 99. に、
  100. 100. コミット
  101. 101. を、 たくさん積んでいく ことなのです
  102. 102. ブランチA
  103. 103. ブランチB
  104. 104. ブランチB
  105. 105. ブランチA
  106. 106. ブランチC
  107. 107. ブランチC
  108. 108. ゲーマーな方なら ピンと来やすいと思いますが
  109. 109. いろいろな人生を その都度セーブするような そんなイメージですネ
  110. 110. 次回「Gitをはじめよう!」 では
  111. 111. この「ブランチ」と 「コミット」を 実際に練習してみましょう!
  112. 112. 今日はここまで! お疲れ様でした 株式会社ファブリカコミュニケーションズ 企画部 山本紗依子

×