🎯 この講座でできること
GitHub のアカウント作成から始まり、Antigravity IDE で AI と一緒にコードを書いて、最終的に自分の作品を世界に公開するまでを 3 時間で。
📅 3 時間構成
| 部 | 時間 | 内容 |
|---|---|---|
| 第0部 | 5分 | IDE と CLI の違い / 今日は IDE 版を使う |
| 第1部 | 40分 | GitHub 入門（ブラウザだけで完結：アカウント作成 → リポジトリ作成） |
| 休憩 | 10分 | — |
| 第2部 | 135分 | Antigravity IDE 活用（インストール → AI で作る → デバッグ → 開いて公開：clone・push） |
| 第3部 | 30分 | 自由創作（任意・おみくじ / じゃんけん / 電卓 から選択） |
🙋 こんな方におすすめ
プログラミングをやったことがなくても大丈夫。「AI と一緒に、はじめてのものづくりを体験してみたい」という方のための講座です。むずかしい知識は必要ありません。
🎓 受講が終わると、こうなれます
3 時間後、あなたの手元には「自分で作って公開した作品」と「AI と一緒にものを作った経験」が残ります。次の 6 つができるようになった状態がゴールです。
- Google アカウントの準備（Antigravity ログイン用）
- 普段使う PC を準備（Mac / Windows どちらでも OK）
- 安定したネット環境
当日までに準備しておくこと
次の 5 つを準備しておくと、当日いちばん大事な「AI とものづくり」の時間をたっぷり使えます。もし準備が間に合わなくても、当日は講師が一緒にセットアップしますので、できる範囲で大丈夫です。
-
① Google アカウント（Antigravity のログインに使います）
Antigravity は Google アカウントでログインして使います。お持ちでない方は accounts.google.com から無料で作成できます。普段 Gmail や YouTube を使っている方は、そのアカウントがそのまま使えます。 -
② GitHub アカウント（当日いっしょに作るので、なくても OK）
作ったコードを保存・公開するためのサービスです。第1部（§1-2）で、作り方から丁寧に説明します。先に作っておきたい方は github.com から無料で登録できます。 -
③ Antigravity のインストール（事前にやっておくと当日スムーズ）
今回メインで使う、Google の AI コーディングアプリです。くわしい手順は第2部（§2-1）で説明しますが、ダウンロードとインストールを先に済ませておくと、当日すぐに操作から始められます。時間がなければ当日でも大丈夫です。 -
④ Git のインストール（Antigravity が裏で使う縁の下のツール）
Antigravity の「保存して GitHub に送る」機能は、裏側で Git（ギット）という仕組みを使います。準備は インストーラをダウンロードしてダブルクリックしていくだけで、黒い画面（ターミナル）は一切使いません。うまく入っているか不安でも、当日その場で確認・サポートしますのでご安心ください。 -
⑤ PC・ブラウザ・ネット環境
Mac・Windows どちらでも参加できます。Chrome など普段使えるブラウザと、動画会議とダウンロードに耐える安定したネット回線（できれば有線 LAN か安定した Wi-Fi）をご用意ください。3 時間の講座なので、充電器も接続しておくと安心です。
会社支給の PC は、アプリのインストールが制限されている場合があります。Antigravity と Git をインストールしてよいか、事前に情報システム部門（IT 部門）へご確認ください。難しい場合は個人の PC での参加をおすすめします。
上の準備は「できていれば当日スムーズ」というものです。未対応の項目があっても、当日はすべて講師が画面を見ながら一緒にセットアップします。「自分にできるか不安」という方こそ、そのままお越しください。
違いを表で確認
| 項目 | Antigravity IDE（本講座で使う） | Antigravity CLI（参考） |
|---|---|---|
| 形態 | デスクトップアプリ（VS Code 風） | ターミナルで動くコマンドラインツール |
| 操作 | マウス＋メニュー＋AI チャット欄 | キーボード入力のみ |
| 入門者の入りやすさ | ◎（画面が見える） | △（黒い画面に慣れが必要） |
| 主な使い道 | 「AI と一緒にアプリを作る」 | 決まった作業の自動化など（上級者向け） |
- 黒い画面（ターミナル）で操作する
- 文字を打ち込んで指示を出す
- 慣れが必要で、初めての方には少し難しい
- 画面のボタンやメニューで操作できる
- AI チャット欄に日本語で話しかけるだけ
- 画面が見えるので、初めてでも安心
本講座では Antigravity IDE 版をメインに使います。CLI 版は「実はこういうのもあるんですよ」レベルで触れる程度。「IDE 版で操作する」と覚えておけば大丈夫です。
1-1. GitHub とは何か（10分）
GitHub（ギットハブ）は、作ったプログラム（コード）を インターネット上に保存・公開・共有できる、世界中で使われている無料のサービスです。世界中の開発者やアプリを作る人たちが、日々このサイトに自分の作品を置いています。
イメージとしては 「コード版の Google ドライブ」＋「だれでも見られる図書館」が近いです。自分のファイルを安全に保管できるだけでなく、公開すれば世界中の人に見てもらえて、逆に他の人の作品を読んで学ぶこともできます。
なぜ GitHub を使うの？
- 作品が消えない：PC が壊れても、コードはインターネット上に残ります（バックアップ）
- 世界に公開できる：作ったアプリやページを、URL ひとつで誰にでも見せられます
- 変更の履歴が残る：「いつ・どこを直したか」が記録され、前の状態にも戻せます
- Antigravity と相性が良い：今日使う Antigravity は GitHub と連携でき、ボタン操作だけで保存・公開できます
GitHub は「プロの開発者だけのもの」と思われがちですが、無料で誰でも使えます。今日は黒い画面（ターミナル）を使わず、ブラウザと Antigravity のボタン操作だけで GitHub を扱っていきます。
⬇ ダウンロード＝clone
誰でも見られる
1-2. アカウントを作る（10分）
ここから実際に GitHub のアカウントを作ります。すべてブラウザ（Chrome など）の中で完結します。画面の見た目は時期によって少し変わることがありますが、大きな流れは次のとおりです。
案内に沿って順番に入力します。ユーザー名は世界で 1 つだけの名前で、あとで作品ページの URL の一部にもなります（例：github.com/あなたの名前）。本名でなくて構いません。英数字で、覚えやすいものにしましょう。
登録したメールアドレスに数字のコードが届きます。それを画面に入力すると、本人確認（メール認証）が完了し、アカウントが使えるようになります。
登録の途中や後で「二段階認証」の設定をすすめられることがあります。これはログイン時にスマホでも確認して安全性を高める仕組みです。設定する場合は、スマートフォンを手元に用意しておいてください。当日は設定してもしなくても、講座は進められます。
1-3. リポジトリとは何か（10分）
リポジトリ（英語で repository、略して「レポ」とも呼びます）とは、1 つのプロジェクトのファイルをまとめて入れておく「箱」のことです。「アプリ 1 つ＝リポジトリ 1 つ」と考えると分かりやすいです。今日つくる作品も、それぞれ専用のリポジトリに入れていきます。
Public と Private の違い
- Public（パブリック＝公開）：世界中の誰でも中身を見られます。作品を見せたいときはこちら。今日は基本的に Public を使います。
- Private（プライベート＝非公開）：自分（と、招待した人）だけが見られます。人に見せたくないものはこちら。
※ Public にしても、あなたの GitHub のパスワードやアカウントが他人に触られるわけではありません。公開されるのは「箱の中に入れたファイル」だけです。
README（リードミー）とは
リポジトリを作ると、多くの場合 README.md という説明ファイルが一緒に入ります。これは そのプロジェクトの「表紙・説明書」にあたるもので、「これは何のアプリか」「どう使うか」を書いておく場所です。GitHub 上では、この README の内容がリポジトリのトップページに大きく表示されます。まずは「表紙のファイル」くらいの理解で十分です。
1-4. ブラウザでリポジトリを作る（10分）
ここでは練習用に demo-hello という名前のリポジトリ（自分専用のコード置き場）を、github.com 上に作ってみます。この作業はすべてブラウザ（Chrome など）の中だけで完結します。アプリのインストールは不要で、まだ Antigravity を入れていなくても進められます。
GitHub にログインした状態で、画面右上の 「＋」を押し、出てきたメニューから 「New repository（新しいリポジトリ）」を選びます。
Repository name（リポジトリ名）の欄に
demo-hello と入力します。名前は英数字で、あとから見て分かるものにしておきましょう。
Public（パブリック＝公開）を選びます。§1-3 で見たとおり、公開されるのは「箱の中に入れたファイル」だけです。人に見せたくないものを入れる場合は Private を選びます。
「Add a README file（README ファイルを追加）」にチェックを入れます。これで、箱の中に最初から「表紙のファイル（README）」が 1 枚入った状態で作られます。
最後にページ下部の緑色の 「Create repository（リポジトリを作成）」ボタンを押します。これで、あなた専用のリポジトリ（コード置き場）が GitHub 上にできあがります。
おめでとうございます。これで、あなた専用のリポジトリ（コードを入れる箱）がインターネット上に用意できました。ここまでは ブラウザだけで完結する作業でした。
この箱の 中を実際に触って、ファイルを作ったり書き換えたりするのは、AI コーディングアプリ「Antigravity」を入れたあとです。次の 第2部で Antigravity をインストールし、この箱を開いて（clone して）、AI と一緒に中身を作り、最後に GitHub へ公開するところまで一気にやります。
- GitHub アカウント作成
- リポジトリ（demo-hello）とは何かを理解
- ブラウザで demo-hello リポジトリを作成（README 付き）
2-1. Antigravity IDE のインストール（20分）
いよいよ今日の主役 Antigravity IDE を本格的に使っていきます。第1部でブラウザに作った GitHub の箱（リポジトリ）は、この後 §2-5 でこの Antigravity から開いて中身を作っていきます。ここではまず、インストールから改めて丁寧に説明します（事前準備で済んでいる方は、ちゃんと入っているかの確認のつもりで読み進めてください）。そもそも IDE（アイ・ディー・イー）とは、「コードを書く・動かす・AI に相談する」がぜんぶ 1 つの画面でできる作業アプリのこと。ワープロが「文章を書くためのアプリ」なら、IDE は「アプリを作るためのアプリ」だと考えてください。インストールはダウンロードとクリックだけで、黒い画面（ターミナル）は一切使いません。
使っている PC によって手順が少し違うので、下のタブで ご自分の OS（Mac か Windows）を選んでください。
ブラウザ（Chrome など）で Antigravity の公式サイトを開き、「Download for Mac（Mac 版をダウンロード）」ボタンを押します。ダウンロードフォルダに、アプリの入ったインストール用ファイル（
.dmg という形式のファイル）が保存されます。
ダウンロードしたファイルをダブルクリックで開きます。小さなウィンドウが出て、Antigravity のアイコンと「Applications（アプリケーション）」フォルダのアイコンが並んで表示されるので、Antigravity のアイコンを「Applications」フォルダのアイコンにドラッグ＆ドロップします。これでインストール完了です。
「アプリケーション」フォルダの中にできた Antigravity をダブルクリックして起動します。
Mac は、はじめて開くアプリに対して、安全のためこの警告を出すことがあります。これは アプリが壊れているわけでも、危険なわけでもありません。次のどちらかの方法で開けます。
- 方法 A（かんたん）：「アプリケーション」フォルダの Antigravity アイコンを 右クリック（または control キーを押しながらクリック）→ 出てきたメニューの 「開く」を選ぶ → 確認画面でもう一度 「開く」を押します。一度この方法で開けば、次からは普通にダブルクリックで起動できます。
- 方法 B：画面左上のアップルメニュー →「システム設定」→「プライバシーとセキュリティ」を開くと、下のほうに 「"Antigravity" は開発元を確認できないため…」という項目と 「このまま開く」ボタンが出ています。それを押して許可します。
起動後の案内に沿って 「Sign in with Google（Google でログイン）」を選び、事前に準備した Google アカウントでログインします。ブラウザが開いてログインを求められたら、いつもどおりメールアドレスとパスワードを入れて許可すれば OK です。これで Antigravity が使えるようになります。
ブラウザ（Chrome など）で Antigravity の公式サイトを開き、「Download for Windows（Windows 版をダウンロード）」ボタンを押します。ダウンロードフォルダに、インストール用ファイル（
.exe という形式のファイル）が保存されます。
ダウンロードした
.exe ファイルをダブルクリックします。インストール画面が出たら、基本は 「次へ（Next）」→「インストール（Install）」と進めていくだけで完了です。特別な設定は不要なので、そのまま進めて構いません。
インストールが終わると Antigravity が起動します（起動しない場合は、デスクトップやスタートメニューの Antigravity アイコンから開きます）。
Windows は、ダウンロードしたばかりのアプリに対して SmartScreen（スマートスクリーン）という安全機能で警告を出すことがあります。これも アプリが危険という意味ではありません。次の手順で進めます。
- 青い画面の中にある 「詳細情報」という小さな文字リンクをクリックします。
- すると下に 「実行」ボタンが現れるので、それを押します。
これでインストール／起動が続行します。ボタンの表記が「実行」ではなく「このまま実行」などになっていることもありますが、意味は同じです。
起動後の案内に沿って 「Sign in with Google（Google でログイン）」を選び、事前に準備した Google アカウントでログインします。ブラウザが開いてログインを求められたら、いつもどおりメールアドレスとパスワードを入れて許可すれば OK です。これで Antigravity が使えるようになります。
2-2. 基本操作・AI チャット（25分）
Antigravity の画面は、大きく 3 つのエリア（ペイン）に分かれています。まずはこの 3 つの役割さえ覚えれば、迷わず操作できます。
- ① 左：ファイル一覧（ファイルツリー）
いま開いているプロジェクトの中にあるファイルが、名前で一覧表示されます。ファイル名をクリックすると、その中身が中央に開きます。§2-5 で GitHub から開く「箱（リポジトリ）」の中身も、ここに並びます。 - ② 中央：エディタ
実際のコード（プログラムの文章）が表示・編集される場所です。AI が書いたコードもここに映ります。自分で手を入れることもできますが、今日は基本 AI にお願いするので、「結果が映る画面」くらいの気持ちで眺めていれば大丈夫です。 - ③ 右：AI チャット
今日いちばん使う場所です。ここに日本語で「◯◯を作って」「これを直して」と話しかけると、AI が中央のエディタにコードを書いてくれます。
迷ったら 右側の「AI チャット」欄です。ここが AI との会話の窓口。中央のエディタや左のファイル一覧に文章を打ち込むのではなく、右のチャット欄に日本語で書いて送信する、とだけ覚えておけば大丈夫です。
まずは肩慣らしに、AI へ挨拶してみましょう。右の AI チャット欄に次の文章を入れて送信してください。返事が返ってくれば、AI と会話できる状態になっています。
こんにちは。今日はあなたと一緒に簡単な Web ページを作ります。よろしくお願いします。
2-3. AI にコードを書かせる（30分）
いよいよ本番です。ここでは 自己紹介ページを AI に作ってもらいます（この後の §2-5 で、第1部でブラウザに作った demo-hello の箱に入れて、そのまま GitHub に送ります）。ポイントは、自分でコードを書く必要はないということ。作りたいものを日本語でお願いするだけで、AI が中央のエディタにコードを書いてくれます。流れは次の 3 ステップです。
右の AI チャット欄に、どんなページが欲しいかを言葉で伝えます。うまくいくコツは、「何を・どんな内容で・どんな見た目に」を具体的に書くこと。まずは下のプロンプト例をそのままコピーして送ってみましょう。
シンプルな自己紹介ページを HTML / CSS で作ってください。
内容：名前、自己紹介文 3 行、好きなもの 3 つ。
デザイン：パステルカラーで、丸みのあるカード風。スマホでも見やすく。
送信すると、AI が右のチャットで返事をしながら、中央のエディタにコードを書き始めます。書き終わると 「Accept（受け入れる）」や「適用」といったボタンが表示されるので、それを押します。これで AI が書いた内容が、実際のファイルとして保存されます。
💬 中身のコードが分からなくても大丈夫。今は「AI の提案に OK を出す」ボタンだと思ってください。気になる箇所は、あとから AI に「ここを説明して」と聞くこともできます。
出来上がったページが実際にどう見えるかを確認します。プレビュー＝作ったページを、実際のブラウザ表示のように見てみることです。開き方は次のどちらかです。
- いちばん簡単で確実な方法：そのまま AI チャットに 「このページをプレビューで見せて」とお願いします。AI が表示のしかたまで案内してくれるので、迷ったらまずこれで大丈夫です。
- もう一つの方法：左のファイル一覧で、できあがった
index.htmlを右クリックし、「ブラウザで開く」（または「Open with Live Server」）といった項目を選ぶと、ページが表示されます。※ こうした項目が見当たらないときは、上の「AI に頼む」方法を使えば問題ありません。
2-4. AI と一緒にデバッグ（25分）
デバッグとは、プログラムのおかしいところ（バグ）を見つけて直すことです。プログラム作りに「一発で完璧」はほとんどなく、直しながら仕上げていくのが当たり前。ここでは、その「直す」体験を、わざとコードを壊してから AI に直してもらう形でやってみます。
AI に「わざと動かない箇所を 1 つ作って」と頼んでもいいですし、さきほどのページに自分でボタンを足して、わざと反応しない状態にしてもかまいません。「うまく動かない状態」をあえて作るのが狙いです。
エラーメッセージが出ていればその文をコピーして貼り付け、出ていなければ「ボタンを押しても何も起きない」のように、おかしな挙動を普通の言葉で伝えます。専門用語は不要です。下のプロンプト例をそのまま使ってみましょう。
このコードのボタンを押しても何も起きません。エラーを調べて直してください。
AI が「原因はここです」と説明し、直したコードを提案してくれます。「Accept（受け入れる）」を押して適用したら、もう一度ボタンを押すなどして、直ったかを確認します。まだ直らなければ「まだ動きません」ともう一度伝えれば OK。会話をくり返して仕上げていきます。
赤いエラー表示が出ると身構えてしまいますが、エラーは「どこを直せばいいか」を教えてくれるヒントです。壊しても PC が壊れるわけではありませんし、GitHub には前の状態が残っているので、いつでも戻せます。分からないことは、遠慮なく AI チャットに聞いてください。「聞けば直る」──これがこれからの、あなたのいちばんの武器です。
2-5. GitHub と連携（Antigravity で開く → 編集 → commit → push）（35分）
いよいよ仕上げです。ここでは 第1部でブラウザに作ったリポジトリ「demo-hello」を、Antigravity で開いて（clone して）、そこに AI と一緒に作ったページを入れ、GitHub に送って（push して）公開するところまでを、一気に通します。すべて Antigravity のボタン操作で行い、黒い画面（ターミナル）やコマンド入力は一切使いません。
まずは箱を手元に取り込む（clone）
操作する場所：ブラウザ（github.com） 第1部で作った demo-hello のページを開き、緑色の 「<> Code」ボタンを押すと、
https://github.com/あなたの名前/demo-hello.git のような住所（URL）が表示されます。右側のコピーアイコンを押して、この住所をコピーします。
操作する場所：Antigravity アプリ
- Antigravity の最初の画面（またはメニュー）から 「Clone Repository（リポジトリを複製）」を選ぶ
- さきほどコピーした住所（URL）を貼り付けて Enter を押す
- PC のどのフォルダに置くか（保存先）を選ぶ
- 取り込みが終わって「開きますか？」と聞かれたら 「開く（Open）」を押す
クローン（clone）＝ GitHub 上にあるリポジトリ（箱）を、自分の PC の中に丸ごとコピーして持ってくることです。これで「ネット上の箱」と「手元の箱」がつながり、この後の編集を自分の PC で行って、結果を GitHub に送り返せるようになります。コマンドは一切打ちません。すべて Antigravity のボタンと入力欄だけで完了します。
AI で作ったページを箱に入れて保存する
§2-3・§2-4 で AI と一緒に作った自己紹介ページのファイル（
index.html など）を、いま開いた demo-hello の中に置いて保存します（Mac は Command + S、Windows は Ctrl + S）。💬 すでに demo-hello を開いた状態で AI に作ってもらった場合は、そのまま保存するだけで OK です。別の場所で作っていた場合は、左のファイル一覧に対象のファイルを入れてから保存します。迷ったら AI チャットに「このファイルを demo-hello に入れて」と頼めば案内してくれます。
変更を記録して GitHub に送る（commit → push）
画面左側の 「Source Control（ソースコントロール＝変更管理）」アイコン（枝分かれのようなマーク）を押すと、いまどのファイルを変えたかの一覧が出ます。AI と作った
index.html などが「変更あり」として表示されていれば OK です。
上部の入力欄に、変更内容の短いメモ（例：
自己紹介ページを作成）を書き、「コミット（Commit）」ボタンを押します。💬 コミット＝変更に名前を付けて記録すること。「ここまでの状態を 1 つのまとまりとして保存」というイメージです。この時点ではまだ自分の PC の中の記録で、GitHub には送られていません。
続けて 「変更の同期（Sync Changes）」または「プッシュ（Push）」ボタンを押すと、記録した内容が GitHub にアップロードされます。
💬 プッシュ＝手元の記録を GitHub に送って反映すること。ブラウザで自分の demo-hello を開き直すと、AI と作ったページのファイルが反映されているのが確認できます。これで、第1部でブラウザに用意した箱に、AI と作った作品が公開されました。
いちど clone してつなげてしまえば、あとは 「作って（編集）→ コミット → プッシュ」のくり返しだけ。この 3 ステップが、これから何かを作るたびに使う基本の流れになります。難しいコマンドは覚えなくて大丈夫。すべて Source Control パネルのボタンで完結します。
- Antigravity IDE 起動
- Google アカウントログイン
- AI に話しかけてコード生成
- ブラウザでプレビュー
- AI と一緒にバグ修正
- 第1部で作ったリポジトリを Antigravity で開く（clone）
- コミットして GitHub に push（公開）
テーマ選択（3 つから）
| テーマ | 難易度 | 所要時間 | 身につくこと |
|---|---|---|---|
| 🎴 おみくじ | ★ | 15〜20分 | ボタン、配列ランダム |
| ✊ じゃんけん | ★★ | 20〜30分 | 条件分岐、判定、スコア管理 |
| 🧮 電卓 | ★★★ | 30分〜 | UI設計、演算ロジック |
進め方
テーマ別・AI へのスタータープロンプト例
「何て頼めばいいか分からない」ときは、下の例をそのままコピーして AI チャットに送るところから始めてください。1 ファイルで作ってとお願いしておくと、この後の公開もかんたんになります。送ったあとは「色を変えて」「ボタンを大きく」など、会話で自由に育てていきましょう。
🎴 おみくじ：ボタンを押すと結果がランダムに出る、いちばんやさしいテーマです。
ボタンを押すと「大吉・中吉・小吉・凶」などの結果がランダムで 1 つ表示される、おみくじアプリを HTML と JavaScript の 1 ファイルで作ってください。結果は大きな文字で表示して、見た目はかわいいパステルカラーにしてください。
✊ じゃんけん：あなたと AI（コンピューター）が対戦し、勝ち負けを判定します。
グー・チョキ・パーの 3 つのボタンを押すと、コンピューターとじゃんけんできるアプリを HTML と JavaScript の 1 ファイルで作ってください。勝ち・負け・あいこを画面に表示し、勝った回数と負けた回数も数えて表示してください。
🧮 電卓：数字ボタンと計算ボタンを並べた、いちばん歯ごたえのあるテーマです。
0〜9 の数字ボタンと、足し算・引き算・かけ算・割り算・イコール・クリアのボタンがある電卓アプリを、HTML と JavaScript の 1 ファイルで作ってください。押した数字と計算結果が上の画面に表示されるようにして、スマホでも押しやすい大きめのボタンにしてください。
🙋 自己紹介ページ（おさらい・アレンジ）：第2部で作ったページを、もっと自分らしく作り直すのもおすすめです。
自己紹介ページを HTML と CSS の 1 ファイルで作ってください。名前・ひとこと自己紹介・好きなもの 3 つ・SNS へのリンクを載せ、写真を 1 枚飾れる丸い枠も付けてください。全体は明るく、スマホでもきれいに見えるようにしてください。
作った作品を世界に公開する ── GitHub Pages（任意）
ここまでで作ったページ（おみくじなど）は、あなたの PC と GitHub の中にあります。これを 「URL ひとつで、誰でもブラウザから見られるホームページ」として公開できるのが GitHub Pages（ギットハブ・ページズ）です。GitHub の無料機能で、追加のアプリもコマンドも要りません。公開の操作はすべてブラウザ（github.com 上）で完結します。
※ 事前に §2-5 のやり方で、作った作品を GitHub に push（アップロード）しておいてください。公開できるのは GitHub に上がっているファイルです。
操作する場所：ブラウザ（github.com） 公開したい作品のリポジトリのページを開き、上のメニューにある 「Settings（設定）」タブを押します。
Settings 画面の左側のメニューを下にたどると 「Pages」という項目があります。それをクリックします。
「Build and deployment」の下の 「Branch（ブランチ）」の欄で、「None」を
main に変更し、フォルダは / (root) のまま 「Save（保存）」ボタンを押します。💬 ブランチとは、ざっくり言うと「どの状態のファイルを公開するか」の指定です。今日は特に分けていないので、標準の
main を選べば OK です。
保存すると、少し待って（数分かかることがあります）ページを再読み込みすると、Pages の画面の上のほうに 「Your site is live at …（あなたのサイトは公開中です）」と、
https://あなたの名前.github.io/リポジトリ名/ のような公開 URL が表示されます。
表示された URL をクリック（またはコピーしてブラウザのアドレス欄に貼り付け）して開くと、あなたの作品がインターネット上のページとして表示されます。この URL は、スマホでも、友だちや同僚に送っても、同じように見てもらえます。これであなたの作品が、世界に公開されました。
GitHub Pages で公開したページは、URL を知っていれば誰でも見られる “完全公開”になります。作品を見てもらうにはぴったりですが、その裏返しとして、公開したくない情報（個人情報・パスワード・社外秘のメモなど）は載せないように気をつけてください。
「見せたい人だけに見せたい」「自分の PC の中だけで動かしたい」という “公開／非公開”の使い分けは、実は次の Docker（ドッカー）の章につながる大事なテーマです。ここでは「公開する＝世界に見える」ということだけ、頭の片隅に置いておいてください。
講座で作ったアプリを GitHub Pages で公開して、URL を講師にシェアしてください！自分の作品を世界に出した体験は次へのモチベーションになります。
ここまでで、GitHub はコードの保管庫、GitHub Pages はかんたんな静的ページをインターネットに公開する場所だと分かりました。デモや作品の発表にはとても便利です。
でも実際の仕事では、「業務で使う Web システムやアプリを、世界に公開せず、自分だけ（または社内だけ）で動かして使いたい」という場面がよくあります。お客様の情報や社内のデータを扱うものを、うっかり全世界に公開するわけにはいきませんよね。そんなときに登場するのが Docker（ドッカー） です。
まずは “似ているけど役割が違う” 4 つを整理
| 手段 | 役割 | 公開範囲 |
|---|---|---|
| GitHub | コードの保管・共有・履歴管理 | 見えるだけ（そのままでは動かない） |
| GitHub Pages | かんたんな静的ページの公開 | 全世界に公開（デモ・作品発表向き） |
| Docker Desktop | 自分の PC で“自分専用サーバー”を起動して動かす | 非公開・自分の PC の中だけ（実務向き・外部に公開しないので侵入リスクを抑えやすい） |
| レンタルサーバー（VPS など） | 本格的に常時公開・運用する | 公開（将来しっかり作るなら） |
Docker（ドッカー）とは？
Docker Desktop（ドッカー・デスクトップ）という無料の GUI アプリ（画面で操作できるアプリ）を PC に入れると、あなたが作った Web システムやアプリを、自分の PC の中だけで動く“自分専用サーバー”として起動して使えるようになります。インターネットに公開しないので、自分だけがブラウザから開いて使えるイメージです。
「サーバーの設定なんて難しそう…」と感じるところですが、そこも Antigravity の AI に「Docker で動かせるようにして」とお願いすると、必要な設定を手伝ってくれます。今日は「こういう選択肢があるんだ」と知っておくだけで十分です（細かい手順は別の機会に）。
- 外部に公開しない分、侵入や情報漏れのリスクを抑えられ、実務でも安心して使いやすい（お客様情報・社内データを扱うものにも向いています）
- 環境ごとまるっと再現できるので「自分の PC では動くのに…」というトラブルを防げる
- 無料で始められる
- PC が少し重くなります（メモリや CPU を使うため。非力な PC だと動作がゆっくりになることも）
- PC を閉じたりスリープすると止まります。使いたいときは PC を起動しておく必要があります（“自分専用”ならではの制約、といったところです）
- 考え方は少し発展的です。初心者のうちは「そういう選択肢がある」と知っておくだけで OKです
「自分の PC を閉じていても動かし続けたい」「チームみんなで使いたい」となったら、安価なレンタルサーバー／VPS（月数百円〜）を契約して公開・運用する道があります。おすすめの順番は、まずは Docker で自分の PC の中で動かしてみる → 本当に必要になったらサーバーを契約する、という流れ。いきなり公開サーバーを借りなくて大丈夫です。
操作で迷ったら、まずは AI（Antigravity のチャット）に「◯◯ができません、どうすればいい？」と日本語でそのまま聞いてみてください。それでも解決しないときは、当日は講師が画面を見ながらサポートします。一人で抱え込まなくて大丈夫です。
A. まず迷惑メール（スパム）フォルダを確認してください。見当たらなければ、登録画面から「メールを再送」を押します。数分待っても来ない場合は、入力したメールアドレスに打ち間違いがないかも確認しましょう。
A. 設定を強くおすすめします（アカウントの乗っ取り防止になります）。スマホの認証アプリ（Google Authenticator など）を使えば OK です。設定は後からでもできるので、当日つまずいたら一旦スキップして先へ進んでも大丈夫です。
A. これは「ネットからダウンロードしたアプリ」に出る安全確認の表示で、故障ではありません。§2-1 の警告対処を参照してください。Mac は右クリック →「開く」、Windows は「詳細情報」→「実行」で開けます。
A. ブラウザを再読み込み（更新）してみてください。それでも進まないときは、一度ブラウザを閉じて開き直す、または別のブラウザで試すと解決することが多いです。
A. PC に Git というツールがまだ入っていないサインです。受講前のご案内（事前準備）の Git インストールを参照して、Git を入れてから進めてください。分からなければ講師が一緒に確認します。
A. まずファイルを保存したか確認してください。保存すると表示されることが多いです。それでも出ないときは、AI に「プレビューで見せて」とお願いすると、表示の仕方を案内してくれます。
A. GitHub にログインできているか／認証（サインイン）が済んでいるかを確認してください。§2-5 の手順を見直し、うまくいかなければ AI に「push できません」と伝えると原因を一緒に探してくれます。
A. Docker は PC のメモリや CPU を使うため、動作が重くなることがあります。Docker 発展章の「注意しておきたいところ」を参照してください。使わないときは Docker を停止しておくと軽くなります。
「まず AI に聞く」→「それでもダメなら講師に聞く」。この 2 段構えで、当日はどこでつまずいても必ず先に進めます。エラー表示が出ても慌てず、そのまま画面を見せてくれれば大丈夫です。
🎓 講座お疲れさまでした！
今日 3 時間で身につけたこと：
- ✅ GitHub の基本（アカウント作成・リポジトリ・clone・push）
- ✅ Antigravity IDE で AI と対話してコードを書ける
- ✅ 自分のコードを GitHub に保存・公開できる
これは「AI と一緒に何か作る」スタート地点です。日常の小さな課題（業務効率化ツール、家計簿、メモアプリ…）を AI と試してみてください。
📚 関連講座
業務効率化（フォルダ整理・Excel・データ分析）を AI で自動化したい方は、兄弟講座「Gemini CLI 実務活用講座」もどうぞ。