GitHub最新情報キャッチアップ 2023年6月

Slide 1

Slide 1 text

GitHub最新情報キャッチアップ 2023年6月 GitHub勉強会～最新情報・GitHub Copilot・GitHub Codespaces など～ - TECH Street https://tech-street.connpass.com/event/284813/

Slide 2

Slide 2 text

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

Slide 3

Slide 3 text

GitHub dockyard https://github-dockyard.connpass.com/

Slide 4

Slide 4 text

Microsoft Build Japan 2023 Day 1 • 【H1-2】GitHub Copilotとの強力なタッグをいち早く取り入れるハンズオン（16:00-17:30） https://microsoft-events.connpass.com/event/286473/

Slide 5

Slide 5 text

Code Polaris Tech Book vol.1 https://techbookfest.org/product/t5yrq2S40rRArJWuf1swPz

Slide 6

Slide 6 text

アジェンダ • GitHub最新情報 • GitHub Copilot • GitHub Codespaces • GitHub中級テクニック

Slide 7

Slide 7 text

GitHub最新情報

Slide 8

Slide 8 text

っと、その前にGitHubをおさらい

Slide 9

Slide 9 text

GitHubプラットフォームは進化しているコード管理のプラットフォーム運用のエコシステム開発環境の革新へ

Slide 10

Slide 10 text

Gitによるコード管理のプラットフォームリポジトリ Issues Pull requests Releases Wiki GitHubフローによる開発サイクルを実現するうえで欠かせない機能

Slide 11

Slide 11 text

継続的なエコシステムを構築する機能続々リポジトリ GitHub Packages GitHub Pages GitHub Projects GitHub Sponsors GitHub Actions GitHub Discussions

Slide 12

Slide 12 text

開発・運用を支えるセキュリティ機能 Dependabpot Secret scanning Code scanning パブリックリポジトリ、またはGitHub Advanced Securityライセンスのもと利用可能どのリポジトリでも利用可能！

Slide 13

Slide 13 text

ここ数年のリリースの勢い GitHub Actions GA 2019.11.11 GitHub Packages GA 2019.11.12 GitHub Sponsors GA 2019.11.4 GitHub Discussions GA 2021.8.17 GitHub Copilot GA 2022.11.9 GitHub Codespaces GA 2022.7.27 GitHub Projects GA 2022.7.27 Renewal

Slide 14

Slide 14 text

ここ最近の注目 • GitHub Codespaces • GitHub Copilot • GitHub Copilot X • GitHub Next

Slide 15

Slide 15 text

GitHub Copilot X • GitHub Copilot Chat • GitHub Copilot for Docs • GitHub Copilot for Pull Requests • GitHub Copilot for CLI Waitlist申込み受付中 https://github.com/features/preview/copilot-x

Slide 16

Slide 16 text

GitHub Next https://githubnext.com/

Slide 17

Slide 17 text

最新情報はここをみる • GitHubのTwitterアカウント • @github, @GHchangelog, @GitHubJapan • GitHub blog • Blog • Changelog ← GitHub自体の更新はこちら Twitch（ライブ） YouTube（アーカイブ）週刊でGitHubのアップデートをチェックする配信をしているので、ぜひ見に来てください♪📻

Slide 18

Slide 18 text

GitHub Universe • GitHubのグローバルカンファレンス、例年11月開催 https://githubuniverse.com/

Slide 19

Slide 19 text

GitHub Galaxy Tokyo • 2023/6/14（上限に達し、登録停止中） https://resources.github.com/galaxy/tokyo/

Slide 20

Slide 20 text

QA①

Slide 21

Slide 21 text

GitHub Copilot

Slide 22

Slide 22 text

GitHub Copilot

Slide 23

Slide 23 text

GitHub Copilotを使い始めるには ① GitHub.comのsettingsで、GitHub Copilotを有効化する ② エディタ/IDEにGitHub Copilotの拡張機能をインストールする Visual Studio Code/Visual Studio/Neovim/JetBrains IDEs ③ エディタ/IDEでGitHubにサインインする

Slide 24

Slide 24 text

① GitHub Copilotを有効化する

Slide 25

Slide 25 text

② 拡張機能をインストールする

Slide 26

Slide 26 text

③ GitHubにサインインする

Slide 27

Slide 27 text

GitHub Copilotと仲良くコードを書くためのコツ

Slide 28

Slide 28 text

コンテキストをうまく渡してあげる開いているタブの情報もコンテキストに含まれ、より意図した提案を得られやすくなるコンテキストが少ないとフワッとした提案に…

Slide 29

Slide 29 text

GitHub Copilotを業務で使う

Slide 30

Slide 30 text

GitHub Copilotで扱われるデータはどうなるの？

Slide 31

Slide 31 text

GitHub Copilotで扱われるデータ Prompts User Engagement Data 入力している内容、カーソルの前後のコードやコメント、開いているタブの内容提案の採用/却下などのアクション、メトリックやエラーなど一般的な使用状況 Suggestions GitHub Copilotによる提案

Slide 32

Slide 32 text

GitHub Copilotで扱われるデータ入力している内容、カーソルの前後のコードやコメント、開いているタブの内容提案の採用/却下などのアクション、メトリックやエラーなど一般的な使用状況 GitHub Copilotによる提案 Prompts User Engagement Data Suggestions Suggestionsの生成や、分析やサービス改善のために利用される for Individualsの場合、保持・利用を許可するか/拒否するか、ユーザー設定による for Businessの場合、一律保持されない GitHub.com での GitHub Copilot 設定の構成 - GitHub Docs

Slide 33

Slide 33 text

FAQ - プライバシー for Individuals

Slide 34

Slide 34 text

FAQ - プライバシー for Business

Slide 35

Slide 35 text

データの扱いに関するドキュメント • GitHub Copilot for Individuals • FAQ - Privacy – Copilot for Individuals - GitHub Copilot • 追加の製品および機能に適用される GitHub 条件 - GitHub Docs • GitHub Copilot for Business • FAQ - Privacy – Copilot for Business - GitHub Copilot • GitHub Copilot for Business のプライバシーに関する声明 - GitHub Docs

Slide 36

Slide 36 text

GitHub Copilotを用いて書いたコード • GitHub Copilotの利用者に所有権と責任がある • パブリックコードに一致するコードは、提案に含めない設定ができる • GitHub.com での GitHub Copilot 設定の構成 - GitHub Docs

Slide 37

Slide 37 text

for Businessの適用のされ方 for Individualsで契約していても、for Businessが適用されれば、設定が上書きされる（for Individualsの課金は、日割りで返却される）

Slide 38

Slide 38 text

GitHub Copilot、ぜひ体験してみて！

Slide 39

Slide 39 text

参考セッションアーカイブ • PWA Night vol.51 ～AI × フロントエンド開発〜 https://www.youtube.com/watch?v=xpJ1rSgjE4E&t=814s

Slide 40

Slide 40 text

QA②

Slide 41

Slide 41 text

GitHub Codespaces

Slide 42

Slide 42 text

最近の開発環境事情？

Slide 43

Slide 43 text

例えば、コンテナを使って環境を統一コンテナランタイムエディタコンテナインスタンス

Slide 44

Slide 44 text

GitHub Codespaces とは

Slide 45

Slide 45 text

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

Slide 46

Slide 46 text

GitHub Codespaces の場合エディタ GitHub Codespaces codespace インスタンスウェブブラウザ

Slide 47

Slide 47 text

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

Slide 48

Slide 48 text

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

Slide 49

Slide 49 text

GitHub Codespaces ポイント

Slide 50

Slide 50 text

使い慣れたインタフェースから使う • ブラウザ、または対応したエディタやIDEから接続し、あたかもローカルで開発している感覚で利用できる • Visual Studio Code • JetBrains IDEs • JupyterLab (Visual Studio Code 拡張機能)

Slide 51

Slide 51 text

使い慣れたインタフェースから使う • 参考: Visual Studio Code で GitHub Codespaces を使用する - GitHub Docs • 参考: JetBrains IDE で GitHub Codespaces を使う - GitHub Docs • 参考: 機械学習のための GitHub Codespaces の概要 - GitHub Docs

Slide 52

Slide 52 text

テンプレートから環境を立上げられる • テンプレートから立ち上げる場合は、リポジトリがなくても利用できる

Slide 53

Slide 53 text

リポジトリから環境を立ち上げられる • リポジトリを clone した状態で環境が立ち上がる

Slide 54

Slide 54 text

必要な環境を数クリックで作成できる • 認証済み、またはコミュニティによるベースイメージが提供されている • Features （後述）で主要なCLIや言語をインストールできる

Slide 55

Slide 55 text

Slide 56

Slide 56 text

Slide 57

Slide 57 text

誰でも同じ環境を立ち上げられる • 作成した環境設定（devcontainer.json）をリポジトリに置いて共有することで、誰でも同じ環境を立ち上げることができる

Slide 58

Slide 58 text

インスタンスはアカウントごと • 立ち上げたインスタンスはアカウントごとに分離されている • コラボレーションには、Live share やポートフォワーディング（後述）の公開を利用できる

Slide 59

Slide 59 text

インスタンスのスペックを選択できる

Slide 60

Slide 60 text

マシンタイプマシンタイプメモリストレージ備考 2 core 4 GB RAM 32 GB 4 core 8 GB RAM 32 GB 8 core 16 GB RAM 64 GB 16 core 32 GB RAM 128 GB 32 core 64 GB RAM 128 GB 申請が必要 6 core (1 GPU) 112 GB RAM 128 GB 申請が必要

Slide 61

Slide 61 text

localhost へのポートフォワーディング • localhost にポートフォワードしてくれるため、あたかもローカル環境のようにシームレスに開発できる • パブリック、または Organization 内向けに公開することもできる

Slide 62

Slide 62 text

Dev container でカスタマイズ • Features による簡単インストール • VS Code のエクステンションのインストール • OnCreateCommand などのライフサイクルへのフック • Dockerfile を用いた、より自由なカスタマイズ

Slide 63

Slide 63 text

Dev container でカスタマイズ

Slide 64

Slide 64 text

prebuild で素早く立上げる

Slide 65

Slide 65 text

課金体系 • 利用時間とストレージの使用量で算出 • 個人アカウントには、1ヶ月あたり無料利用枠がふくまれる • GitHub Free – 15GB/月のストレージ、120時間/コアの利用時間 • GitHub Pro – 20GB/月のストレージ、180時間/コアの利用時間マシンタイプ利用時間の価格/時間 2 core $0.18 4 core $0.36 8 core $0.72 16 core $1.44 ３２ core $2.88 ストレージ量ストレージ量の価格/月 1 GB $0.07

Slide 66

Slide 66 text

課金の様子 ※ GitHub Pro の無料利用枠が適用されています

Slide 67

Slide 67 text

使用状況（CSV）

Slide 68

Slide 68 text

課金体系（Organization） • Organization 配下のリポジトリで codespace を立ち上げる場合、 Organization の設定によって、課金される対象が異なる説明 Organization の設定上限に達するまでは、Organization に課金される • そのユーザーに対して codespaces の利用が許可されている • spending limit の設定が 1 以上、または Unlimited spending codespace を起動するユーザーに課金される • 上記を満たさない

Slide 69

Slide 69 text

課金周りのケース紹介ストレージの無料枠を使い切ったときメール通知の例 spending limit に達したとき spending limit に達した状態では、インスタンスを起動できない（Organization の例） Codespaces インスタンス一覧画面の表記（Organizationでの例）

Slide 70

Slide 70 text

課金に関する資料 • GitHub Codespaces の請求について - GitHub Docs • GitHub Codespaces の使用状況の表示 - GitHub Docs • GitHub Codespaces の使用制限の管理 - GitHub Docs

Slide 71

Slide 71 text

管理 • Dotfiles • シークレット • アカウント • リポジトリ • GPG verification • デフォルトのエディタ • アイドルタイムアウト • 保持期間 • リージョン

Slide 72

Slide 72 text

管理（Organization） • 利用可能なメンバー • ポリシー • マシンタイプ • ポートの公開範囲 • アイドルタイムアウトの最大値 • 保持期間の最大値 • 利用可能なイメージの制限 • API により、メンバーの利用状況を取得できる

Slide 73

Slide 73 text

管理（Organization）

Slide 74

Slide 74 text

参考セッションアーカイブ https://codezine.jp/devonline/archive/session/130 • Developers Summit 2023 • ［9-D-1］もう悩まされない開発環境、プロジェクトで統一した環境をいつでもどこでも

Slide 75

Slide 75 text

QA③

Slide 76

Slide 76 text

GitHub中級テクニック

Slide 77

Slide 77 text

今すぐ効果のある中級テクニック • リポジトリ設定のPull Requests設定の見直し • Branch protection rulesの設定 • Dependabotの有効化 • Secret scanning • Code scanning • 新しくなったGitHub Projects • GitHub ActionsのOIDC接続

Slide 78

Slide 78 text

今すぐ取り入れたいPull Requests設定 • squash mergeがおすすめ🙌 • タイトルはpull request title • マージ先のブランチの差分がある場合、アップデートを促す • マージ後、自動でマージ元の作業ブランチを削除する

Slide 79

Slide 79 text

Branch protection rulesの設定ブランチの保護ルールを用いることで、開発フローを制御しやすくなる • 必ずプルリクエストの作成を要求する • 必ずapprovalsを1つ以上要求するなど、ルールは増え続けている

Slide 80

Slide 80 text

Dependabotの有効化

Slide 81

Slide 81 text

GitHub Projects – イテレーション表示

Slide 82

Slide 82 text

GitHub Projects – ロードマップ表示

Slide 83

Slide 83 text

セキュリティ対策 • Secret scanning • シークレットが検出されると、そのプロバイダへ通知され、対処される • Push protectionがパブリックリポジトリ、またはGHASで利用可能に • Code scanning • GitHubが提供する静的解析ツールCodeQLを用いて脆弱性検知 • CodeQLまたはSARIF対応ツールの検知結果をGitHub上で管理

Slide 84

Slide 84 text

GitHub ActionsでOIDC接続を利用する • OpenID Connect を使ったセキュリティ強化について - GitHub Docs • アマゾンウェブサービスでの OpenID Connect の構成 - GitHub Docs • Azure での OpenID Connect の構成 - GitHub Docs • Google Cloud Platform での OpenID Connect の構成 - GitHub Docs