開発環境の準備

本講義中は、GitHub Codespacesを用いてGemini CLIを利用します。 GitHub Codespacesは、クラウド上で開発環境を提供するサービスで、ブラウザだけで開発環境を利用できます。これにより、インストールやセットアップの手間を省き、すぐに開発を始めることができます。

GitHub Codespacesとは

GitHubが提供するクラウドの開発環境です。 GitHub Codespaces

環境構築不要 自分のPCに何もインストールしなくても、すぐ開発を始められます。
どのPCでも同じ環境 チーム全員が同じ設定で作業できます。

GitHub Codespacesでの作業手順

まずはじめに、GitHubでリポジトリを作成しましょう。

GitHub リポジトリを新規作成

リポジトリとは、Gitで管理しているフォルダ、ディレクトリのことです。

補足：💡フォルダ、ディレクトリ、リポジトリの違い

フォルダ

パソコンの中でファイルを入れる「入れ物」
物理的なディレクトリ構造の見た目のこと

ディレクトリ

フォルダとほぼ同じ意味ですが、コンピュータ用語寄り
ターミナルやコマンドラインで「今いる場所」を指すときに「ディレクトリ」と言う
例：cd my-site は「my-site」というディレクトリに移動するという意味です。

リポジトリ（Repository）

Gitで管理されているフォルダ（＋その中の履歴データ）
普通のフォルダとの違いは「中に .git という隠しフォルダがあり、過去の履歴や設定が入っている」こと
GitHubにアップすると、そのままインターネット上のリポジトリにもなります。

GitHub にログインし、右上の「＋」→ New repository をクリック
Repository name に任意の名前（例：my-site）を入力し、Add README をオンにして、Create repository をクリックします。

Codespaceを起動

作成したリポジトリのトップページがこのようになっていることを確認します。
右上の「＋」→ New Codespace をクリックします。
Codespace作成の設定画面に移行するので、Repositoryから先ほど作成したリポジトリを選択します。その他の設定はデフォルトのままでOKです。Create codespaceをクリックします。

Codespacesの料金について

Codespacesは毎月一定量まで無料で使用することができます。個人用のGitHubアカウントには、月あたり15GBのストレージと、120コア時間の使用時間が付与されます。コア時間は使用するマシンのスペックによって消費量が異なります。 2コアマシンを1時間使うと2コア時間を消費し、8コアマシンを1時間使うと8コア時間という計算です。詳しくはGitHub Codespacesの料金についてをご確認ください。

Codespacesの画面構成

GitHub Codespacesは、クラウド上で動作するVS Code（Visual Studio Code）です。VS Codeは、Microsoftが提供する無料のソースコードエディターで、多くのプログラミング言語をサポートし、拡張機能を通じて機能を追加することができます。

Codespaces/VS Codeの画面構成について簡単に説明します。

codespace-vscode

ファイルエクスプローラー
左側に表示されるファイルエクスプローラーは、プロジェクト内のファイルやフォルダを表示します。ここからファイルをクリックすることで、エディターで開くことができます。VS Codeでも同様に、プロジェクトの構造を視覚的に把握することができます。
エディター
画面中央に位置するエディターは、コードを編集するための領域です。VS Codeと同様に、シンタックスハイライトやコード補完機能が利用でき、効率的にコードを書くことができます。
ターミナル
画面下部に表示されるターミナルは、コマンドを実行するためのインターフェースです。ここでGitコマンドやnpmコマンドを実行して、プロジェクトの管理やビルドを行うことができます。VS Codeでもターミナルを内蔵しており、同様の操作が可能です。