GitHubキャッチアップやハンズオン(GitHub Actions)座学

3.1K Views

April 17, 24

スライド概要

【Waveleap主催】エンジニアのためのGitHub勉強会
https://sister.connpass.com/event/314872/

profile-image

Developer, Microsoft MVP(Azure), GitHub geek | IaC,DevOps,Serverless | organize #codepolaris #GitHubDockyard | https://youtube.com/@dzeyelid https://twitch.tv/dzeyelid 過去のプレゼンテーション資料: https://speakerdeck.com/dzeyelid, https://www.slideshare.net/dzeyelid

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

関連スライド

各ページのテキスト
1.

GitHubキャッチアップや ハンズオン 【Waveleap主催】エンジニアのためのGitHub勉強会 https://sister.connpass.com/event/314872/

2.

岩永かづみ / Kazumi IWANAGA • GitHub公認トレーナー • ZEN Architects 所属 • Microsoft MVP for Azure • 得意な領域 • Infrastructure as Code • GitHub Actions による自動化 • 技術コミュニティ • Code Polaris / GitHub dockyard / Hack Everything. • @dz_ • @dzeyelid • @dzeyelid • dzeyelid

3.

現在、妊娠30週4日 妊娠中大変なこと 妊娠中でもできること • 体調・症状が人それぞれで予測でき ない • 非同期に進められるタスク • どんな仕事でも効率落ちる • 長時間作業できない • 予定が立てにくい • 物理的な移動が大変 • 配慮とのギャップ(±どちらも) • うしろめたさと悔しさ • 期日まで余裕のあるタスク ひとこと これまでできていたことができなくて、 一番つらいのは妊婦自身。 「大変そうだから」と相談なしに 仕事や役割から外されるとつらいです。 相談してほしいです🫶

4.

GitHubキャッチアップ

5.

コード管理だけじゃないGitHub 一言ポイント GitHub機能 AIによるコーディング支援 GitHub Copilot リモート開発環境 GitHub Codespaces CI/CD、DevOpsなど自動化 GitHub Actions コラボレーション GitHub Projects, GitHub Discussions 静的サイトのホスト GitHub Pages セキュリティ Dependabpot, Secret scanning, Code scanning

6.

AIによるコーディング支援 GitHub Copilot

7.

GitHub Copilot https://github.com/features/copilot

8.

GitHub Copilotの機能 機能 GA 説明 Code completion 2022年1月 Copilotによるコード補完。IDEで利用する。 Chat 2024年1月 Copilotとコーディングに特化した会話ができる。エディタで表示 しているファイルなどをコンテキストに含められる。IDEで利用する。 Chat in GitHub.com 2024年2月 チャットをGitHub.comで利用でき、リポジトリやナレッジベースを コンテキストとして指定し会話できる。 Knowledge bases (ナレッジベース) 2024年2月 ドキュメント(.md、.mdx)を含むリポジトリのセットを作成し、 Copilotとの会話でコンテキストとして指定できる Pull request summaries 2024年2月 Copilotにより、プルリクエストのサマリを生成する。GitHub.com で利用する。 In the CLI 2024年3月 ターミナルで自然言語を用いて質問できる。対象は、GitHub CLI(gh)、Gitコマンド、一般的なシェルコマンド。GitHub CLIの 拡張機能として提供される。

9.

GitHub Copilotの機能 機能 GA 説明 Code completion 2022年1月 Copilotによるコード補完。IDEで利用する。 Chat 2024年1月 Copilotとコーディングに特化した会話ができる。エディタで表示 しているファイルなどをコンテキストに含められる。IDEで利用する。 Chat in GitHub.com 2024年2月 チャットをGitHub.comで利用でき、リポジトリやナレッジベースを GitHub Enterprise コンテキストとして指定し会話できる。 Knowledge bases (ナレッジベース) 2024年2月 ドキュメント(.md、.mdx)を含むリポジトリのセットを作成し、 Copilotとの会話でコンテキストとして指定できる。 GitHub Enterprise Pull request summaries 2024年2月 Copilotにより、プルリクエストのサマリを生成する。GitHub.com GitHub Enterprise で利用する。 In the CLI 2024年3月 ターミナルで自然言語を用いて質問できる。対象は、GitHub CLI(gh)、Gitコマンド、一般的なシェルコマンド。GitHub CLIの 拡張機能として提供される。

10.

GitHub Copilotの利用形態 利用形態 説明 GitHub Copilot Individual 個人アカウントで有効化して利用する。 プロンプトと候補のデータの収集と利用の可否について、設定で変更できる。 GitHub Copilot Business OrganizationまたはEnterpriseで有効化して利用する。 プロンプトと候補のデータは収集されない。 GitHub Copilot Enterprise 2024年2月GA。 Copilot Businessの機能に加え、「Chat in GitHub.com」が利用できる。 ファインチューニングはadd-onになるそう。 プロンプトと候補のデータは収集されない。

11.

エディタから利用する • コード補完 • チャット • コーディング特化 • エディタ上で差分表示 • スラッシュコマンド / • コンテキスト変数 # • エージェント @ 2024年3月GA

12.

GitHub Business GitHub Enterprise Content exclusions Configuring content exclusions for GitHub Copilot - GitHub Enterprise Cloud Docs

13.

GitHub Enterprise GitHub.comから利用する https://github.com/copilot

14.

GitHub Enterprise リポジトリのコードベースをコンテキストに リポジトリをインデックスすることで、Copilot がリポジトリのコードやドキュメントを解釈して 会話してくれる

15.

GitHub Enterprise ナレッジベースでドキュメントをコンテキストに ナレッジベースとして指定されたリポジトリの Markdownファイルをコンテキストに含め、 Copilotと会話できる

16.

GitHub Enterprise GitHub.comでコードについて説明させる

17.

GitHub Enterprise Pull request summaries

18.

データの扱いが不安な方は、FAQ参照 https://github.com/features/copilot#faq

19.

リモート開発環境 GitHub Codespaces

20.

GitHub Codespaces • コンテナベースの環境をGitHubがホストしてくれる • ブラウザや、VS Code、JetBrains IDEs(Beta)から接続できる • 課金: 稼働時間+ストレージ • 個人アカウント向けに無料枠あり( 2core 60h/月、ストレージ 15GB/月) • 参考: GitHub Codespaces の請求について - GitHub Docs

21.

手元のマシンでコンテナ環境で開発の例 エディタ コンテナ インスタンス コンテナ ランタイム

22.

GitHub Codespaces の場合 エディタ codespace インスタンス GitHub Codespaces

23.

Codespacesの細かい機能 • ポリシーで制御 • タイムアウト(稼働時間の節約) • 自動削除までの日数(ストレージ利用量の節約) • など • 拡張 • devcontainerによるカスタマイズ • prebuild

24.

CI/CD、DevOpsなど自動化 GitHub Actions

25.

GitHub Actions • CI/CD、DevOpsに欠かせない自動化の処理を構成できる • もちろん、イシューのトリアージのような小さな自動化も • GitHubにおける様々なイベントを契機で実行できるほか、手動や APIによる実行もできる • プッシュ、プルリクエストの作成・編集など • GitHub提供のランナーでも、独自のランナーでも実行できる • ハンズオン座学にて解説

26.

コラボレーション GitHub Projects, GitHub Discussions

27.

GitHub Projects • アイテム(イシューやプルリクエスト)を整理・管理できる • 3つのレイアウト(テーブル、ボード、ロードマップ) • 独自フィールドを追加できる • 文字列、数値、日付、リスト、イテレーション • アイテムの簡易的なグラフ化ができる • Projectsのワークフロー機能により、簡易な自動化ができる • 条件に一致したアイテムのインポートや、ステータス更新、アーカイブなど

28.

テーブルレイアウト たとえば、 Iterationフィールドをグループ化すると、 スクラムで利用しやすいレイアウト

29.

ボードレイアウト 旧Projectsでもあったボードレイアウト。 シンプルな視覚化にはちょうどよい

30.

ロードマップレイアウト タイムラインでアイテムを表示できるレイアウト。 Dateフィールドと組み合わせて、線表のような 表示もできる

31.

GitHub Discussions

32.

静的サイトのホスト GitHub Pages

33.

GitHub Pages • GitHubリポジトリにあるファイル、またはビルドした成果物を静的サイ トとしてホストできる • HTML/JavaScript/CSSまたはMarkdownファイルはそのまま • 静的サイトジェネレーターのビルド成果物 • ビルドにはGitHub Actionsを利用できる

34.

セキュリティ Dependabot, Secret scanning, Code scanning

35.

Dependabot • リポジトリのコードの依存関係をスキャンし、脆弱性の検出やバージョ ンの更新を検出してくれる Dependabotの機能 説明 Dependabot alerts 依存関係をスキャンし脆弱性が検出されると、アラートを発行す る。アラートは管理者に通知されるほか、GitHub.comで一覧・ 詳細を確認できる。 Dependabot security updates Dependabot alertsのアラートに対する修正案を、プルリクエ ストを作成して提案してくれる Dependabot version updates 依存関係をスキャンし最新バージョンとの差異が検出されると、 更新案をプルリクエストとして作成して提案してくれる

36.

GitHub Secret scanning • リポジトリをスキャンし、提携しているプロバイダのシークレットを検出すると、 プロバイダへ連携する • プロバイダ側ではシークレット利用者への通知や無効化が行われる • スキャン対象 • Gitリポジトリの全ブランチのコード • イシュー/プルリクエスト/Discussions/Wikiへの入力 • プッシュ保護(push protection)を利用すると、リポジトリにプッシュする 前にシークレットスキャンを実行できる • AIによるプロバイダ以外のシークレットの検出も試みられている(Beta)

37.

GitHub Secret scanning • パブリックリポジトリで利用できる • プライベートリポジトリで利用する場合は、GitHub Enterprise契約 にGitHub Advanced Securityライセンスの追加することで利用で きる

38.

GitHub Code scanning • GitHubが提供するCodeQLで静的解析を行い、コードの脆弱性を GitHub上で管理でき、修正案をプルリクエストで受け取れる • 主要な言語に対するセットアップが容易 • autofix: AIによる修正の提案が試みられている(Beta) • サードパーティ製静的解析ツールでも、SARIF形式のレポートであれ ば読込み統合管理できる • パブリックリポジトリで利用できる • プライベートリポジトリで利用する場合は、GitHub Enterprise契約に GitHub Advanced Securityライセンスの追加することで利用できる

39.

ハンズオン座学

40.

ハンズオンの目的 • Codespacesの環境を使ってみる • Copilotを体験してみる • Actionsを体験してみる • CI: プルリクエストでビルドとテスト • Codespacesの後始末

41.

Actionsをもう少し詳しく

42.

Actionsの仕組み • リポジトリ単位でActionsを管理する • 自動化でどんな処理をさせたいかを、ワークフローファイル(yml)に 記述する • そのワークフローをランナーで実行する • GitHubホステッドランナー • セルフホステッドランナー • GitHub上で実行結果を確認できる • エラーも • 参考: GitHub Actions を理解する - GitHub Docs

43.

ワークフローの実行結果一覧画面

44.

エラーが起きた場合の実行結果画面

45.

Actionsのワークフローについて

46.

ワークフローの構成(最少構成の例)

47.

ワークフローの構成 name: ワークフローの名前 on: トリガの定義 どの契機でワークフローを起動するかを定義する • プッシュされたとき、プルリクエストが作成されたとき、など 参考: ワークフローのトリガー - GitHub Docs jobs: ジョブ ジョブは一連の処理を定義する単位 ワークフローには、1つまたは複数のジョブを構成できる 参考: ワークフローでジョブを使用する - GitHub Docs

48.

ジョブの構成 ジョブのID runs-on: ランナーの指定 ランナー=ジョブを実行する環境を指定する • Linux、Windows、MacOS、など 参考: ジョブのランナーを選択する - GitHub Docs steps: ステップ 実際の処理を記述していく コマンドの実行、または「アクション」を利用できる

49.

ステップの構成 uses: 「アクション」を使う アクション=処理を再利用できるようにまとめた部品 run: コマンドの実行 実行するコマンドを記述する

50.

ワークフロー作成の始め方(GitHub.com)

51.

ワークフロー作成の始め方(GitHub.com) ワークフローファイルは、 .github/workflows/ 配下に格納する

52.

ワークフロー作成の始め方(GitHub.com) 編集中にControl+Spaceショートカットを 使うと、入力候補を表示してくれる

53.

ワークフロー作成の始め方(GitHub.com) サイドバーでは、Marketplaceでアクション を検索したり、ドキュメントを確認できる

54.

GitHub.com上でワークフローを編集する • dzeyelid/github-actions-petit-hands-onを開 き、.github/workflows/simple-sample.ymlを開く • Control+Spaceを実演する • サイドバーで、Marketplaceから任意のアクションを選択し、 READMEを確認する • サイドバーでドキュメントを確認する

55.

Actionsのアクションについて

56.

アクション • アクション=処理を再利用できるようにまとめた部品 • Marketplaceから探すと便利 • Marketplace: https://github.com/marketplace • 基本的なアクションはGitHubから提供されている • actions/checkout, actions/setup-nodeなど • 誰でもアクションを公開できる

57.

Marketplace

58.

Marketplace(GitHub提供アクション) publisher:xx (例: actions)

59.

Marketplace 個々のアクションの画面

60.

Marketplace 個々のアクションの画面 ソースを確認してみよう

61.

アクションはリポジトリで公開されている actions/checkout

62.

アクションの実態 • 1リポジトリにつき1アクション • action.ymlにアクションの定義が書かれている • name, inputs, outputs • アクションを利用するときは、READMEをよく読んで • ワークフローでアクションを指定するには、「オーナー名/リポジトリ名」 • actions/checkoutなど

63.

ハンズオン実践

64.

ハンズオン資料 • dzeyelid/github-actions-petit-hands-on

65.

Codespacesの開発環境を立 ち上げてみよう

66.

Copilotを試してみよう コード補完、チャット

67.

Actionsのワークフローを書いて みよう

68.

Codespacesの後始末

69.

Codespaceの停止・削除 • codespaceを停止しておけば、 稼働時間分の課金が停止する • 再度起動すれば、作業途中のまま 復帰させられる • ただし、ボリューム分のストレージ 料金が、自動削除までの間、かか り続ける • codespaceを削除すると、ボ リュームも削除され課金はなくな る

70.

ハンズオン環境について • みなさんのライセンスはハンズオン終了後に解除します。 • codespaceも削除します。 • 私が全員分削除するのが大変(APIでしかできない)なので、皆さんで削除 しておいてもらえたら助かります。

71.

Q&A

72.

GitHubに関する疑問は • GitHub dockyardのDiscordでは、 GitHub好きが集まっているので、私を はじめ、GitHubの有識者が疑問に答え てくれるかもしれません。(あくまでコミュ ニティによるベストエフォートです) • 業務向けであれば、ぜひ弊社ZEN Architectsにお問い合わせください