Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
明日から使おうGitLab入門
Search
starling888888
February 15, 2020
Programming
0
640
明日から使おうGitLab入門
starling888888
February 15, 2020
Tweet
Share
More Decks by starling888888
See All by starling888888
5分で分かった気になれるGraphQLの話
ryouehara
1
300
Other Decks in Programming
See All in Programming
"config" ってなんだ? / What is "config"?
okashoi
0
240
Anthropic Cookbook のおすすめレシピ
schroneko
7
970
AWS CDKコントリビュートTIPS / aws-cdk-contribution-tips
gotok365
2
190
単体テストを書かない技術 #phpcon_odawara
o0h
PRO
27
8.3k
Ruby Pattern Matching
bkuhlmann
0
930
スキーマ駆動開発による品質とスピードの両立 - 私達は何故、スキーマを書くのか
kentaroutakeda
0
170
Azure OpenAI Serviceのプロンプトエンジニアリング入門
tomokusaba
3
710
R言語の環境構築と基礎 Tokyo.R 112
bob3bob3
0
270
Scalable Customer Journey Orchestration (CJO)
lewuathe
0
320
GitHub Copilotのススメ
marcy731
1
200
ADRを一年運用してみた/adr_after_a_year
hanhan1978
7
2.4k
OpenAPIを中心に考えるAPI開発入門 / Introduction to API Development with a Focus on OpenAPI
seike460
PRO
2
170
Featured
See All Featured
Docker and Python
trallard
34
2.7k
4 Signs Your Business is Dying
shpigford
175
21k
The Straight Up "How To Draw Better" Workshop
denniskardys
227
130k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
40
4.4k
Code Review Best Practice
trishagee
55
15k
Git: the NoSQL Database
bkeepers
PRO
422
63k
Why You Should Never Use an ORM
jnunemaker
PRO
51
8.6k
The MySQL Ecosystem @ GitHub 2015
samlambert
243
12k
10 Git Anti Patterns You Should be Aware of
lemiorhan
648
58k
The Language of Interfaces
destraynor
151
23k
Designing for humans not robots
tammielis
248
25k
From Idea to $5000 a Month in 5 Months
shpigford
377
45k
Transcript
明日から使おう! GitLab入門 2020-02-15 GDG信州
whoami? Ryo Uehara(@starling8+) 2 ▪ 県内某社のWebエンジニア(新米) ▪ DockerとNodeJSがメインスタック ▪ プライベートではUbuntuとHaskellい
じってる ▪ アカウントの8の数は使ってるサービス で変わります ▪ 最近はアジャイルとかスクラムとか開発 スタイルも勉強中
今日のゴール ▪ なんとなくGitLabがわかる ▪ なんとなくGitがわかる ▪ とりあえず明日からGitLabを使った開発ができる 3
目次 ▪ GitLabとは ▪ Gitとは ▪ GitLabの基本機能 ▪ GitLabハンズオン ▪
Tips紹介 4
※注意 わかりやすさを優先しているため、一部の表現に正確さを 欠く場所があります。 5
1 GitLabとは 6
1. GitLabとは ▪ GitLabはGitを使った開発やサービスの公開をサポー トしてくれるプラットフォーム ▪ Webサービスとして提供されている ▪ タヌキが目印 7
1. GitLabとは – GitHubとは違うん? ▪ GitHubも同じようにGitを使った開発をサポートして くれるプラットフォーム ▪ GitLabより昔からサービスがありユーザが多い ▪
GitLabは後述する自動テストが最初から使えるのでGood GitHubも使えるようになりました ▪ だいたいできることは同じ 8 先輩!
1. GitLabとは OK, GitLabが何かはわかった。 そもそもGitとはなんぞ? 9
2 Gitとは 10
2. Gitとは ▪ ソースコードなどの変更履歴を管理するためのバージョ ン管理システム ▫ いつ、誰が、なんのファイルにどんな変更を加えたかがすぐに わかる ▫ 大人数で開発してソースコードを変更しても大丈夫な仕組みが
備わっている ▪ 開発者にとってスマホのようなもの ▫ 今となってはなかった頃の生活は思い出せない 11
2. Gitとは –リポジトリ ▪ リポジトリ:ソースコードの置き場所 ▫ 2種類ある 12 リモートリポジトリ ローカルリポジトリ
GitLabやGitHubにある みなさんのPCにある
2. Gitとは –clone ▪ clone:リモートリポジトリを自分の手元にコピーする 13 リモートリポジトリ ローカルリポジトリ git clone
過去の変更履歴も含めて全部コピーしてくる
リモートリポジトリの作成、clone Try it 14
2. Gitとは -ローカルにGitを準備する ▪ Gitを使うためにはPCにGitを入れる必要があります ▪ Gitそのものはhttps://git-scm.com/downloads やパッケージ管理システムでインストールできます ▪ CLIツールなので使いづらいのでGUIを使いましょう
▪ 今回はsourcetreeというツールを使います ▪ https://www.sourcetreeapp.com/ 15
2. Gitとは – add & commit ▪ commit: ファイルの変更や作成の記録(とその操作) ▪
commitすると ▫ 誰が ▫ いつ ▫ どのファイルに ▫ 前のcommitと比べてどんな変更があったか ▫ 変更者のメッセージ を記録した世界中でuniqueなidを持ったオブジェクトが 作られる 16
2. Gitとは – add & commit 前のファイルとの差分を記録することでソースコードの変 更履歴を管理していく 17 ローカル
リポジトリ aaaaaa Initial commit bbbbbb Change fileA ababab Create fileB cccccc Update fileB
2. Gitとは – add & commit ▪ add: どの変更をcommitするかの決定 ▪
commitする前に必要な操作 ▫ GUIツールを使っていると意識することはほとんどない 18
ファイルの変更、commit Try it 19
2. Gitとは – push ▪ push: ローカルリポジトリの変更をリモートリポジト リに反映させる 今までの変更はローカルリポジトリにしか記録されていな い
20 ローカル リポジトリ aaaaaa Initial commit bbbbbb Change fileA ababab Create fileB cccccc Update fileB
2. Gitとは – push 21 ローカル リポジトリ aaaaaa Initial commit
bbbbbb Change fileA ababab Create fileB cccccc Update fileB リモート リポジトリ aaaaaa Initial commit bbbbbb Change fileA ababab Create fileB cccccc Update fileB git push
push Try it 22
2. Gitとは – branch ▪ branch: commitを記録するための名前空間(のようなもの) ▪ 今までのcommitはmasterという特別なbranchで行 なっていた
▪ branchを作ってそのbranchにcommitすることで他の branchには一切影響を与えることなく作業できる 23
2. Gitとは – branch ブランチを切った地点から違う世界線としてそれぞれ commitが作られていく 24 aaaaaa Initial commit
bbbbbb Change fileA ababab Create fileB cccccc Update fileB masterブランチ kkkkkkk Create fileC ssssss Update fileC feature-aブランチ
2. Gitとは – branch ▪ メモ ▫ branchを作ることを「ブランチを切る」とも言います ▫ branchはリモートリポジトリでもローカルリポジトリでも作
れます ▫ 作業するbranchを切り替えることを「checkout」と言いま す 25
branchの作成 Try it 26
2. Gitとは – merge ▪ merge: あるbranchの変更を他のbranchに取り込む こと ▪ 詳しくは“GitLabを使った開発体験”の中でやるので、
ここでは省略 27
2. Gitとは – resetとrevert OK, Gitの雰囲気は分かった。 クソコードcommitしたから戻したいんだけど? 28
2. Gitとは – resetとrevert ちょっと今は忘れようか 29
2. Gitとは – resetとrevert ▪ Gitの操作履歴を戻すのは2種類あって説明していると 時間が足りなくなるので今日は省略 ▪ 付録として用意してあります。 30
3 GitLabの基本機能 31
3. GitLabの基本機能 ▪ リモートリポジトリ ▪ Issue ▪ Merge Request ▪
Gitlab CI 32
4 GitLabハンズオン 33 GitLabの 基 本 機 能
4. GitLabハンズオン ▪ GitLabには色々な機能がありますが、実際に開発でそ れぞれの機能を使ってみないとよくわからないもので終 わってしまいます。 ▪ StepbyStepで実際にGitLabを使った開発フローを やってみて機能を確認していきましょう。 34
4. GitLabハンズオン–git xxx flow ▪ Git xxx flow: Gitを使った開発手法 ▫
ブランチ戦略の1つ(どのようにブランチを切って開発、リリースをし ていくかの方法論) ▫ Git flow, GitHub flow, GitLab flowなどがある ▫ 今回は私が日頃使っているGitHub flowをベースにしたやり方を 紹介 35
4. GitLabハンズオン–our git flow 1. GitLabのプロジェクト上で 2. Issueを作り 3. IssueからMergeRequestを作り
4. 作られたbranchで開発を行い 5. GitLabCIで自動テストを回し 6. MRでレビューしてもらって 7. レビュワーがマージして 8. タグを打ったら(自動で)リリース 36
37 (゚Д゚)ハァ?
4. GitLabハンズオン –プロジェクトの準備 ▪ ハンズオンのサンプルプロジェクトを準備してあります ▪ https://gitlab.com/starling8/gitlab-hands-on ▪ 上のURLにアクセスしてforkボタンを押してください fork:
他の人のリモートリポジトリを 自分のリモートリポジトリとしてコピーすること 38
4. GitLabハンズオン –Issue ▪ Issue: 直訳すると「問題」 ▪ プロジェクトで開発すべき機能、対応すべきバグをここ に登録する ▪
Assignee(担当者)を決められる ▪ Open, Closeのステータスを持つ ▪ サンプルプロジェクトにはバグがすでにあるのでこれを 修正するIssueを作ってみましょう 39
Issueの作成 Try it 40
4. GitLabハンズオン –Issue ▪ Issueを作るときの注意 ▫ タイトルは英語にしましょう ▫ 担当者を決めましょう ▫
Labelを設定しましょう 41
4. GitLabハンズオン –Merge Request ▪ Merge Request(以下MR): branchでの作業を他の branchに合流させてくださいと依頼を出す機能 ▪
Merge対象のbranchとMerge予定のbranchの差分が GitLabから一目で確認できる 42
4. GitLabハンズオン –Merge Request Branchなんて影も形もないんだけど? 43
4. GitLabハンズオン –Merge Request ▪ IssueからIssueを解決するbranchとMRをボタン1つ で作れる ▪ branchは最新のmaster branchを起点に作られる
(変更もできる) ▪ 残念なお知らせ…… ▪ forkしたプロジェクトではIssueからMRが作れないです… ▪ そういう機能があると覚えておいて手動でやりましょう 44
MRの作成 Try it 45
4. GitLabハンズオン – Merge Request ▪ Merge Requestを(手動で)作るときの注意点 ▫ Branchの名前の先頭に[Issueの番号]-をつけましょう、
branchがマージされると自動でIssueがcloseされます ▫ MergeRequestは”WIP”(Work In Progress)の状態 で作りましょう ▫ マージされる対象のbranchを確認しましょう(たまにmaster 以外になっていることがある) 46
4. GitLabハンズオン –ローカルでの開発 ▪ リモートで作ったbranchをローカルに持ってきてその ブランチで作業 ▪ ちょっと言葉の整理 ▫ fetch:
最新のリモートリポジトリの状態を取得 ▫ リモートブランチをチェックアウト: リモートブランチのコ ピーをローカルに作る ▫ pull: ローカルブランチにリモートの同名のブランチの変更を取り 入れる 47
ローカルでの開発 Try it 48
4. GitLabハンズオン –GitLab CI ▪ GitLabにはGitLabCIという自動テストや自動デプロイを 実行する機能がある ▪ プロジェクトのトップレベルに”.gitlab-ci.yml”と いうファイルを置くとリモートブランチに変更があった
際に自動で定義した内容が実行される ▪ 何(jobと呼ぶ)をどんな順番でいつ実行するか設定可能 49
4. GitLabハンズオン –GitLab CI ▪ すでにプロジェクトでは設定ずみなので解説します 50
4. GitLabハンズオン –レビュー ▪ MRはGitLab上で変更が確認できる ▪ ソースコードに問題や疑問があったらコメントもできる ▪ Issueと同様に担当者を決められる ▪
テストが失敗してたり、コンフリクトが発生してたらマージして はいけない(コンフリクトがあるとマージできない) 51
4. GitLabハンズオン –コンフリクト ▪ コンフリクト:ソースコードに発生した競合 ▫ Gitは賢いので同じファイルが同時に変更されていてもうまいこと両 方の変更を取り入れてくれる ▫ が…同じファイルの同じ行に変更がある場合変更を取り入れることが
できずコンフリクトと呼ばれる状態になる ▫ コンフリクトが発生してる場合修正しないとマージができない 52
コンフリクトと解決 Try it 53
4. GitLabハンズオン –コンフリクト ▪ Featureブランチで編集した箇所をリモートのmaster を直接編集させるとコンフリクトが発生する ▪ Masterブランチをpullしてローカルのfeatureブラン チにマージしてみるとコンフリクトが発生した旨が表示 される
▪ 修正してcommit&push! 54
4. GitLabハンズオン –tagとリリース ▪ tag: commitに別名をつけること ▫ リポジトリ内でtag名はuniqueでなければいけない ▪ 私の開発スタイルではtagが打たれたらリリースのjobを走
らせるとCIに設定してある ▫ tagは別にリリースのためにあるわけではない ▫ けどtagを打つと(GitLab上で)リリースノートを書ける 55 aaaaaa Initial commit bbbbbb Change fileA ababab Create fileB cccccc Update fileB 0.0.1
tag Try it 56
5 Tips 57
5.Tips ▪ GitやGitLabの便利な機能や使い方を紹介します ▪ Gitのマーク がついているのはGitの機能 ▪ GitLabのマーク がついているのはGitLabの機能 58
5.Tips - .gitignore ▪ .gitigonre: gitでバージョン管理を行う対象外の ファイルやディレクトリを指定できるファイル ▪ Gitでは基本的にソースコードなどテキストデータのみ 管理する
▪ ビルドしたバイナリデータなどは管理対象から外す ▪ “.gitignore LANGUAGE_NAME”で検索するとテンプ レートが出てくる 59
5.Tips - label ▪ Issueに状態やどんな事柄かの付加情報をつける ▪ GitLabでよく使われるものはワンクリックでセット アップできる ▪ Boardラベルもワンクリックでセットアップできる
60
5.Tips – Issue Board ▪ IssueはOpen, ToDo, Doing, Closedをカンバン Likeに表示できるBoard機能がある
▪ カンバンもカスタマイズできる ▪ 日々のタスクもここで管理可能 ▫ カンバンのためだけにプロジェクト作ることもままある 61
5.Tips –アクセス制御 ▪ プロジェクトにはPublic, Privateの公開レベルの設 定ができる ▪ プロジェクトの中でもユーザ権限に応じて何ができるか を細かに設定できる …そんなことはどうでもよくて(良くないけど)
62
5.Tips –アクセス制御 ▪ masterへのpushを禁止するんだ ▪ masterブランチはWell-TestedでReleasableな特 別なブランチ ▪ 多人数での開発でみんながみんなmasterを直接編集し てpushする…そこに秩序はありません
▫ ハンズオンでは直接編集しましたが非推奨です ▫ MRを通ったものだけがmasterに入るようにしましょう 63
5.Tips –commitの戻し方 ▪ Commitの戻し方には2種類ある ▪ Revert:安全な方 ▪ Reset:危険な方 64
5.Tips –revert ▪ Revert: 指定したcommitを打ち消すcommitを作る ▪ 過去のあるcommitまで戻したい場合は新しい方から順 番にrevertすれば良い 65 aaaaaa
Initial commit bbbbbb Change fileA ababab Create fileB cccccc Update fileB dddddd Revert cccccc “cccccc”の変更を消すcommit、 ソースコードの状態は ”ababab”と 同じ
5.Tips –reset ▪ Reset: 指定したcommit以降のcommitを全て消す ▪ 複数人での開発において、すでにリモートにpushした commitは絶対にresetしてはいけない 66 aaaaaa
Initial commit bbbbbb Change fileA ababab Create fileB cccccc Update fileB dddddd Revert cccccc リセットォォォ!!!!
5.Tips –reset 67 ローカル リポジトリ aaaaaa Initial commit bbbbbb Change
fileA ababab Create fileB cccccc Update fileB リモート リポジトリ aaaaaa Initial commit bbbbbb Change fileA ababab Create fileB cccccc Update fileB リセットォォォ!!!! git push なんか知らない状態のブランチが 来たねんけど
5.Tips –reset 68 ローカル リポジトリ aaaaaa Initial commit bbbbbb Change
fileA ababab Create fileB cccccc Update fileB リモート リポジトリ aaaaaa Initial commit bbbbbb Change fileA リセットォォォ!!!! git push -f 他の人のローカルブランチと全く違 う状態のリモートブランチが出来上 がり、他の人の操作を受け付けな くなる!
5.Tips –commitの戻し方 ▪ Revert:安全な方 ▪ Reset:危険な方 ▪ 基本的にはRevert使った方が良い、Resetは慎重に! 69
5.Tips –Git/GitLabの使い方を決めよう ▪ GitやGitLabはあくまでツール ▪ どんな風に使うかはチームでルールを設けて運用 ▫ どんなブランチ戦略をとるか ▫ レビューはどうするか
▫ commitメッセージはどうするか 70
5.Tips –Git/GitLabの使い方を決めよう ▪ 参考:私のGitのルール ▫ Issueタイトルは英語でつける ▫ masterブランチへのpushは(基本的に)禁止 ▫ Commitメッセージは英語
▪ 比較的ライト 71
5.Tips –使ってみて試そう ▪ 自分のアカウントの下にprivateプロジェクトを作っ たら他の人は基本的にアクセスすることはありません ▪ Git/GitLabの練習にいろんなことを試してみましょう ▫ pushしたcommitをresetとかもやってみて何が起きるか確 認するといいよ!
72
Thanks! Happy coding with GitLab! You can find me at:
@starling888888 on Twitter 73
CREDITS Special thanks to all the people who made and
released these awesome resources for free: ▪ Presentation template by SlidesCarnival ▪ Photographs by Unsplash 74