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
GithubActionsHandsOn資料
Search
chihiro
October 17, 2020
0
290
GithubActionsHandsOn資料
2020年10月17日にTechPlay女子部で開催したGithubActionsのHandsOnの資料です。
chihiro
October 17, 2020
Tweet
Share
More Decks by chihiro
See All by chihiro
レビューしやすいプルリクを作ろう
chihiro
0
610
わたしがエンジニアになった理由
chihiro
1
340
2020年にやりたいこと
chihiro
0
320
社内LT大会を3年間開催してきた中で考えたこと
chihiro
0
490
IamlearningGit.pdf
chihiro
0
33
便利ツールLT大会
chihiro
2
240
オススメ❤を詰め込みました
chihiro
0
440
Vimmerになりたいあなたへ
chihiro
4
2k
Featured
See All Featured
The Cost Of JavaScript in 2023
addyosmani
45
6.6k
A designer walks into a library…
pauljervisheath
202
24k
Designing on Purpose - Digital PM Summit 2013
jponch
115
6.9k
Teambox: Starting and Learning
jrom
132
8.7k
GitHub's CSS Performance
jonrohan
1030
460k
Raft: Consensus for Rubyists
vanstee
136
6.6k
Fantastic passwords and where to find them - at NoRuKo
philnash
50
2.8k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
42
9.2k
Thoughts on Productivity
jonyablonski
67
4.3k
Optimising Largest Contentful Paint
csswizardry
33
2.9k
Writing Fast Ruby
sferik
626
61k
Fireside Chat
paigeccino
32
3k
Transcript
GitHub Actions Hands on Tech Play 女子部
お集まりいただきありがとうございます! 短い時間ではありますが、一緒に楽しみながら GitHub Actions に入門していきましょう〜!
ざっくりスケジュール 10:00 - 10:15 オープニング(イマココ) 自己紹介タイムを含みます! 10:15 - 10:30 座学
10:30 - 11:00 Hands on part1 11:00 - 11:05 休憩 11:05 - 11:55 Hands on prat2 11:55 - 12:00 クロージング
さっそくですが自己紹介タイムです! 今日は参加してくださっている皆様全員に一人一言ずつ自己紹介していただきたいです。ビデオ ONにできる方はお願いします。(できる方だけで大丈夫です) 話すこと • 名前(呼んで欲しい名前) • 普段どんなことをしているのか • 今回申し込んだきっかけとか理由とか
zoomの使い方 • 私から説明するときは画面共有をしながら進めていきます • Hands on 中のビデオ、音声のON/OFFはご自由にどうぞ • こちらから問いかけをすることや進捗を確認することがありますが、その際は音声、またはリ アクションをお願いします
Hands on の進め方 3部構成です 1. 座学 (10分程度) 2. Hands on
part1 (30分程度) ◦ 私の実演とハンズオンを交互に進めていきます 3. Hands on part2 (50分程度) ◦ パート1でやったこと&資料を参考にしながら各個人でもくもく進めていきます ◦ わからない場合など、もちろん質問 OKです! ◦ もくもく進めるのもあり!わからないことを質問するのもあり!な時間です
今日目指すこと GitHub Actions でUnitテストを実行してみるところまでやってみる!
座学パート
Agenda • CI/CD とは • GitHub Actions の基本
CI/CD とは • CI ◦ Continuous Integration (継続的インテグレーション) ▪ コードに変更があるたびに自動でテストを実行すること
• CD ◦ Continuous Delivery (継続的デリバリ) ▪ コードを常にリリース可能な状態にしておく ◦ Continuous Deployment ( 継続的デプロイ) ▪ 常に自動でデプロイする
CI/CD で自動化できること • ビルド • テスト • デプロイ • その他
◦ 使用しているライブラリのアップデート ◦ 静的解析チェック
CI/CD による自動化から得られるメリット CI/CDによる自動化によって得られるメリットを紹介します • ヒューマンエラーを防ぐ ◦ 自動的に実行されるため、テストやチェックし忘れを防げます ◦ 毎回同じ手順で実行されるため、人によって実行の仕方が違う、手順を飛ばしてしまう、 というミスを防ぐことができます
• 積極的にリリースできる ◦ リリース時の工数が減るため、積極的なリリースにつながります ◦ 万が一バグがあったとしてもすぐにロールバックすることもできます
CI/CD ツール・サービス CI/CDを行うためのツールやサービスは様々です。 • GitHub Actions • CircleCI • Jenkins
• AWS CodeBuild / AWS CodeDeploy / AWS CodePipeline
GitHub Actions の基本 GitHubのイベントをトリガーとして実行されるワークフローを定義できます。 • pushされたらテストを実行する • プルリクエストが作られたら〇〇する • △△ブランチにpushされたらビルドしてデプロイする
publicリポジトリであれば無制限で無料、 privateリポジトリも無料枠があります https://github.co.jp/features/actions
ワークフローの実体はymlファイル CI/CDを行いたいリポジトリに .github/workflows ディレクトリを作成し、その配下に yml ファイル を作成します
Hands on パート1
Agenda • ①初めての GitHub Actions • ②actionを使ってみよう
①初めての GitHub Actions ゴール: ワークフローを定義して echo コマンドで文字列を出力する ★ 自分で .github/workflows
ディレクトリを準備してymlファイルを作って、ということもできます が、今日は github.com 上でワークフローを作ってみます ★ 「echo コマンドで文字列を出力する」というシンプルなワークフローを作ってみましょう
初めての GitHub Actions 1) cloneしたリポジトリをgithub.com上で開きます 2) Actionsタブをクリックし、「set up a workflow
yourself」というリンクをクリックします
初めての GitHub Actions 3) 一度このままcommitします。右上の Start commit ボタンからコミットします。コミットが完了 すると自動的に Code
タブに戻ります。
初めての GitHub Actions 4) Actions タブを開き直すと、今作ったワークフローが実行されています 5) echo コマンド部分を自由に書き換えて実行してみましょう
example.yml 詳しくはこちら name: CI # このワークフローの名前 on: # このワークフローをキックするイベント push:
# push された時 branches: [ main ] # main ブランチ jobs: # 1つのワークフローは 1つ以上のjobからなる build: # このジョブのID runs-on: ubuntu-latest # “build”ジョブを実行するマシンの種類 steps: # 1つのジョブにはstepsと呼ばれる一連のタスクがある - name: Run a one-line script # 1つのstepは - によって区切られる run: echo Hello, world! # 使用されているマシンの OSのシェルを使用してコマンドラインプログラムを実行する
ワークフローを図解するとこんなイメージ workflow(yml) trigger: push job OS(runs-on): ubuntu steps checkout echo
job OS(runs-on): windows steps echo checkout echo echo
②actionを使ってみよう ゴール: checkout アクションを使ってみよう ★ actionとは ◦ GitHub Actions 内のライブラリのようなもの
◦ https://github.com/marketplace?type=actions ◦ 実はすでに先ほど作成したワークフローで checkout actionを使っています
actionを使ってみよう checkout actionの動きを確認しましょう。checkout action実行ステップの前後にlsコマンドを実行 するステップを差し込みます。 jobs: build: runs-on: ubuntu-latest steps:
- name: before run checkout #追加 run: ls -a - uses: actions/checkout@v2 - name: after run checkout #追加 run: ls -a
CIの基本 • CIで実現したいことはローカル環境でも実現できていることが前提になります • ローカル環境での手順をどうやって CIで実行させるのかが鍵になります
Hands on パート2
Agenda • ③Unitテストの実行 • ④スケジュール実行をしてみよう • ⑤Unitテストが失敗したときに通知をしてみよう
③Unitテストの実行 ゴール: Unitテストを実行してみよう ★ アプリのUnitテストを GitHub Actions で実行してみましょう ★ 今のmain.ymlに付け足していきます
ヒント main.ymlを修正する前に、ローカルでUnitテストを実行する手順を復習します 0. PCにnode.js環境構築 & ローカルにリポジトリを clone 1. npm install
2. npm test この手順を GitHub Actions で実現します。今の main.yml では、0番目の手順まで実現できてい ます。 残り2つの手順をそれぞれステップで実現します。
④スケジュール実行をしてみよう ゴール: 指定した時間に実行されるワークフローを作ってみましょう ★ 今までは push されたときに実行されるワークフローを作っていました ★ 指定した時間に実行されるワークフローを作ってみましょう ◦
ワークフローは新しく作っても、今まで使っていたものに修正を入れても OKです ◦ 定期実行にすると永遠に実行され続けるのであとで消しておきましょう
ヒント • 今までは push イベントを使っていましたが、 schedule イベントを使います • 以下のリンクを参考にしてみてください ◦
https://docs.github.com/ja/free-pro-team@latest/actions/reference/workflow-s yntax-for-github-actions#onschedule ◦ https://docs.github.com/ja/free-pro-team@latest/actions/reference/events-that- trigger-workflows#schedule
⑤Unitテストが失敗したときに通知をしてみよう ゴール: ワークフローが失敗したときにだけ実行されるステップを作ってみましょう ★ Unitテストが失敗したときに通知をしてみましょう ★ 本当はSlack通知などを行いたいところですが、 Slackへの連携作業に時間がかかりそうなの で、今日は実際の通知は行いません ★
Unitテストが失敗したときにだけ実行されるステップを作ってみましょう
ヒント • まずはUnitテストを失敗させましょう ◦ 実は今のアプリにはおかしいところがあります。そして Unitテストも間違っています。Unit テストを修正してみてください(コードも間違っているのでテストは失敗するはずです )。 ◦ テストは、
リポジトリの__tests__/service/rule-test.js です • ステップの中で if 条件文を使うことができます • 以下のリンクを参考にしてみてください ◦ https://docs.github.com/ja/free-pro-team@latest/actions/reference/context-and -expression-syntax-for-github-actions#failure ◦
いかがでしたでしょうか? アンケート実施予定です。ぜひご意見お待ちしております。