Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
ファインディでのGitHub Actions活用事例
Search
puku0x
August 22, 2024
Technology
4k
9
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
ファインディでのGitHub Actions活用事例
https://findy.connpass.com/event/326645/
puku0x
August 22, 2024
More Decks by puku0x
See All by puku0x
え?フロントエンドエンジニアの ワイがインフラも!?
puku0x
1
1.8k
新メンバーのために、シニアエンジニアが環境を作る時代
puku0x
0
1.6k
Agent Skills 入門
puku0x
0
2.3k
ファインディにおけるフロントエンド技術選定の歴史
puku0x
2
2.3k
生成AIではじめるテスト駆動開発
puku0x
0
1.6k
実践!カスタムインストラクション&スラッシュコマンド
puku0x
2
3.5k
Nx × AI によるモノレポ活用 〜コードジェネレーター編〜
puku0x
0
1.8k
ファインディにおけるフロントエンド技術選定の歴史
puku0x
2
330
Findyの開発生産性向上への取り組み ~Findyフロントエンドの場合~
puku0x
0
500
Other Decks in Technology
See All in Technology
Running Kotlin + Quarkus with Lambda
nealle
1
470
メルペイ 会計システム概要と歴史
mewuto
1
220
Loop Engineering これくらいでいい
mikanichinose
0
230
FactoryBotアンチパターン / factory_bot anti-patterns
toshimaru
0
160
脆弱性診断って、何をしているの? 〜弱点を見つけて、会社の改善につなげるまで〜
keeg
0
900
AI駆動開発の時代になったのでトヨタ生産方式から見直す
terurou
7
5.9k
Getting Started with Google Antigravity
glaforge
0
250
実体験から学ぶ分析エージェントの開発と運⽤
recruitengineers
PRO
8
2.3k
今さら理解するウェブフォントver.2026
takanorip
3
700
日本語に強いオープンな大規模言語モデル「LLM-jp」
odashi
4
880
AI時代のAPI開発を加速する品質ガードレール / API Quality Guardrails in the AI Era
yokawasa
0
190
二歩目のフロントエンド・ウェブアクセシビリティ
camiha
2
440
Featured
See All Featured
The Pragmatic Product Professional
lauravandoore
37
7.5k
Tell your own story through comics
letsgokoyo
1
1.1k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
6
1.2k
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
1.1k
First, design no harm
axbom
PRO
2
1.3k
The SEO Collaboration Effect
kristinabergwall1
1
590
A designer walks into a library…
pauljervisheath
211
25k
The Mindset for Success: Future Career Progression
greggifford
PRO
0
540
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
62k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.6k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
37
6.6k
<Decoding/> the Language of Devs - We Love SEO 2024
nikkihalliwell
1
350
Transcript
ファインディでの GitHub Actions活⽤事例 1 2024/08/22 GitHub Actionsの最適化どうしてる?開発者体験を向上させる運⽤術 ファインディ株式会社 フロントエンドテックリード 新福
宜侑 @puku0x
2
3 GitHub Actions
4 ラベル設定 担当者アサイン Pull Request 作成
担当者アサインの⾃動化 5
担当者アサインの⾃動化 6 • ファインディでは↓を利⽤しているプロジェクトが多い ◦ https://github.com/kentaro-m/auto-assign-action ◦ ⾃動化しているのはAssigneeのみ - uses:
kentaro-m/
[email protected]
with: repo-token: ${{ secrets.GITHUB_TOKEN }} addAssignees: author runOnDraft: true
7 ラベル設定 担当者アサイン Pull Request 作成
ラベルの⾃動化 8
ラベルの⾃動化 9 • actions/labeler を利⽤した⾃動付与 ◦ https://github.com/actions/labeler • ラベルは↓を参考に作成 ◦
https://github.com/azu/github-label-setup
.github/labeler.yml 10 'Type: Feature': - head-branch: ['^feat'] 'Type: Bug': -
head-branch: ['^fix', '^bug'] 'Type: Refactoring': - head-branch: ['^refactor'] '施策対応': - head-branch: ['.*-pj-.*'] ブランチ名から ラベルを⾃動付与
モノレポの場合に便利な設定 11 'Scope: App1: - changed-files: - any-glob-to-any-file: - apps/app1/**/*
- libs/app1/**/* 'Scope: App2: - changed-files: - any-glob-to-any-file: - apps/app2/**/* - libs/app2/**/* ファイルの変更で ラベルを⾃動付与
actions/labeler が対応していないもの 12 run: | pr_title=$(curl -s -H "Authorization: token
${{ secrets.GITHUB_TOKEN }}" \ -H "Accept: application/vnd.github.v3+json" \ "https://api.github.com/repos/Findy/***/pulls/${{ github.event.pull_request.number }}" \ | jq -r '.title') if [[ $pr_title =~ ^feat ]]; then pr_type='Feature' fi curl -X POST -H "Authorization: token ${{ secrets.GITHUB_TOKEN }}" \ -H "Accept: application/vnd.github.v3+json" -d '{"labels": ["Type: '"$pr_type"'"]}' \ "https://api.github.com/repos/Findy/***/issues/${{ github.event.pull_request.number }}/labels" PRタイトルから ラベルを⾃動付与
13 CI実⾏ ラベル設定
14 CIにどれくらい時間が かかっていますか?
15 開発あるある 機能追加 コード量↑ CI時間↑
16 CIが遅いと... レビューが遅くなる どうせ◯分 かかるし...
17 レビューが遅いと... コンフリクトが発⽣しやすくなる ブランチの⽣存期間が延びる
18 開発者はコーディングと同程度CI待ちに時間を割く https://github.blog/news-insights/research/survey-reveals-ais-impact-on-the-developer-experience/
19 CIの⾼速化は必須
キャッシュの活⽤ 20
21 actions/cache
キャッシュの活⽤ 22 - uses: actions/setup-node@v4 id: node with: node-version: 20
- uses: actions/cache@v4 id: cache with: path: node_modules key: ${{ runner.arch }}-${{ runner.os }}-node-${{ steps.node.outputs.node-version }}-npm-${{ hashFiles('**/pac - if: steps.cache.outputs.cache-hit != 'true' run: npm ci キャッシュヒットした場合に 依存ライブラリのインストールを省略
23
24 node_modulesのキャッシュ キーを適切に設定していれば node_modules はキャッシュして良い
キャッシュキー詳細 25 ${{ runner.arch }}-${{ runner.os }}-node-${{ node-version }}-npm-${{ hashFiles('**/package-lock.json')
}} CPUアーキテクチャ X64 や ARM64 など Node.js バージョン OS種別 ロックファイルの ハッシュ値 パッケージ マネージャー種別
~/.npm等もキャッシュする場合 26 - uses: actions/cache@v4 id: cache with: path: node_modules
key: ${{ runner.arch }}-${{ runner.os }}-node-${{ steps.node.outputs.node-version }}-npm-${{ hashFiles('**/package-lock.json') }} - uses: actions/cache@v4 if: steps.cache.outputs.cache-hit != 'true' with: path: | ~/.npm ~/.cache/Cypress key: ${{ runner.arch }}-${{ runner.os }}-node-${{ steps.node.outputs.node-version }}-npm-${{ hashFiles('**/package-lock.json') }} restore-keys: ${{ runner.arch }}-${{ runner.os }}-node-${{ steps.node.outputs.node-version }}-npm- - if: steps.cache.outputs.cache-hit != 'true' run: npm ci
27 キャッシュ容量⾜りない問題
28 キャッシュ消費の低減 - uses: actions/cache@v4 if: github.actor != 'dependabot[bot]' id:
cache with: path: node_modules key: ${{ runner.arch }}-${{ runner.os }}-node-${{ steps.node.outputs.node-version }}-npm-${{ hashFiles('**/pack • 案1. actions/cache/restore を使う ◦ actions/cache/save を使うワークフローは別途⽤意(デフォルトブランチ) • 案2. キャッシュする条件を追加 ◦ botが作るPRはキャッシュしない等
ジョブの並列化 29
ジョブの並列化 30 • matrixを使った並列化 ◦ parallel_split_test ◦ ファイルサイズ(≒実⾏時間)でソート Findy Tech
Blog -RailsのCIのテスト実行時間を 10分から5分に高速化した話 - https://tech.findy.co.jp/entry/2024/03/04/100000 strategy: matrix: ci_node_index: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] steps: run: | TEST_FILES="$(find ./spec -type f -name "*_spec.rb" -exec ls -l {} + | sort -n -k 5 | awk '{print $9}' | xargs ./script echo $TEST_FILES bundle exec parallel_split_test $TEST_FILES --format progress --color
Larger runners 31
Larger Runner 32 • GitHub Teamプランまたは GitHub Enterprise Cloudプランのみ ◦
https://docs.github.com/actions/using-github-hosted-runners/about-github-hosted-runners • CIが実⾏されるホストマシンのスペックを上げる ◦ プライベートリポジトリのデフォルトはCPU2コア/メモリ7GB ▪ 最⼤CPU64コア/メモリ256GB ▪ Armベースのランナー(ベータ版)も利⽤可 • 3割程度安い、ruby/setup-ruby等は未対応 • 料⾦はスペックに⽐例 ◦ スペックを上げればCI時間が短縮される
33 早いは正義
34 CIの時間は10分が⽬安 https://speakerdeck.com/ham0215/ciha5fen-yi-nei-su-zao-ikai-fa-saikuruwozhi-eruci
35 リリース CI実⾏
36 リリースするバージョンを決めて PR作ってリリースノート書いて 検証環境に上げてレビューして 本番環境にデプロイして... わかりました リリースよろしく
リリース⾃動化 37
38 セマンティックバージョニング • Conventional Commitsに準拠 https://www.conventionalcommits.org 例: feat(lang): add polish
language • コミットメッセージを基に新しいバージョンを⾃動採番 ◦ リリースノートの作成も⾃動
リリース⾃動化 39 1. 新しいバージョンの採番ワークフローを実⾏ 2. バージョニング⽤Pull Request(⾃動⽣成)をマージ 3. リリース⽤Pull Request(⾃動⽣成)をレビュー後、マージ
4. 本番デプロイ https://dev.to/puku0x/github-actions-1mi5
40 リリース時QAチェック項⽬の抽出 • PR作成時にチェックを⼊れる • リリースPRのテンプレートに↑チェックされた項⽬を追加 def category_by_pull(pull) return :planner_qa_pr
if body.include? "- [x] 企画側QA" return :developer_qa_pr if body.include? "- [x] 開発側QA" return :other_pr end ## リリース時QAチェック項⽬ ### 企画QA #{pull_id_lines(:planner_qa_pr, true)} ### 開発QA #{pull_id_lines(:developer_qa_pr, true)}
定期実⾏ジョブ 41
定期実⾏ジョブ 42 カバレッジレポートや定期的なリリース on: schedule: - cron: '30 0 *
* 1-5' # 平⽇09:30 (JST) 分 時 ⽇ ⽉ 曜⽇ ※60⽇以上リポジトリにアクティビティが無い場合は⾃動で無効化されます
43 休みの⽇は働きたくない
祝⽇判定 44 check: outputs: is_holiday: ${{ steps.check_holiday.outputs.result }} steps: -
run: npm install @holiday-jp/holiday_jp - uses: actions/github-script@v7 id: check_holiday env: TZ: 'Asia/Tokyo' # タイムゾーン固定必須 with: script: | const holidayJp = require('@holiday-jp/holiday_jp'); return holidayJp.isHoliday(new Date()); some_job: needs: check if: needs.check.outputs.is_holiday == 'false' 祝⽇判定 ジョブ本体
リポジトリ間の連携 45
46 GraphQLの スキーマ更新しました バックエンドの最新版Pullして graphql-codegenしてPR作って... わかりました
47 repository_dispatch
リポジトリ間の連携(1) 48 バックエンド側はフロントエンド側にイベント送信 on: push: branches: - main paths: -
schema.json jobs: steps: - uses: actions/create-github-app-token@v1 id: app-token - run: | curl -X POST H "Authorization: token ${{ steps.app-token.outputs.token }}" \ -H "Accept: application/vnd.github.v3+json" \ https://api.github.com/repos/Findy/フロントエンド側リポジトリ/dispatches \ -d '{"event_type":"trigger-graphql-codegen"}'
リポジトリ間の連携(2) 49 フロントエンド側は repository_dispatch をトリガに起動 on: repository_dispatch: types: [trigger-graphql-codegen] jobs:
steps: - uses: actions/create-github-app-token@v1 id: app-token - uses: actions/checkout@v4 with: repository: Findy/バックエンド側リポジトリ - run: | 〜schema.jsonコピー&graphql-codegen実⾏&PR作成など〜 バックエンド側 からのイベント
⾃作Actions 50
51 GitHub利⽤状況の取得 https://github.com/starfish719/check-actions-billing-info - uses: starfish719/
[email protected]
id: check with: accessToken:
${{ secrets.PERSONAL_ACCESS_TOKEN }} user: 'ユーザー名' - name: result run: | echo total_minutes_used-${{ steps.check.outputs.total_minutes_used }} echo total_paid_minutes_used-${{ steps.check.outputs.total_paid_minutes_used }} echo included_minutes-${{ steps.check.outputs.included_minutes }} ※利⽤イメージ
52 GitHub Project v2の⾃動化 https://github.com/nipe0324/update-project-v2-item-field • リードタイム計測⽤に開発 • 当時Project v2対応のものが⾒つからなかったため⾃作
◦ Statusの変更はProject Workflowでも良さそう? if: ${{ github.event_name == 'pull_request' }} steps: - uses: nipe0324/update-project-v2-item-fi
[email protected]
with: project-url: https://github.com/orgs/Findy/projects/***/views/*** field-name: 'Status' field-value: 'In Progress'
53 リードタイム計測&Projectに反映 https://github.com/nipe0324/update-project-v2-item-field - uses: nipe0324/update-project-v2-item-fi
[email protected]
if: ${{ github.event.action ==
'closed' }} with: project-url: https://github.com/orgs/Findy/projects/***/views/*** field-name: 'リードタイム' field-value-script: | const endDate = new Date(item.fieldValues['開発完了⽇']); const startDate = new Date(item.fieldValues['開発着⼿⽇'] ?? endDate); const days = Math.round((endDate.getTime() - startDate.getTime()) / (1000 * 3600 * 24)) return days;
54 まとめ • ファインディではCI/CDにGitHub Actionsを活⽤ ◦ CI以外にも活⽤できる! • 今後の予定(検証中) ◦
DependabotのPRマージ⾃動化 ▪ 公式で対応して欲しい ◦ RDSバージョンアップ → Terraform⾃動反映 ◦ リリース⽤ツール⾒直し ▪ Release Please、Release Drafter、Nx Release…
GitHub Actionsはいいぞ! 55
We’re hiring! https://careers.findy.co.jp/ 56