Lecture 03GitHubアカウントを作成する
コードをクラウドに保存し、公開や共同作業に使うGitHubを準備します。
前のレクチャーで作った「変更履歴」は、まだ あなたのパソコンの中だけ にあります。 パソコンが壊れたら全部消えますし、別の場所から続きの作業もできません。 そこで登場するのが GitHub です。 GitHubは、あなたのコードと履歴を クラウドに保存してくれる場所 です。
このレクチャーでは、GitとGitHubの違いを整理し、 GitHubのアカウントを作成します。 後のレクチャーで Vercel というサービスにつないでWeb Appを公開する際の、 いちばん大事な土台になります。
1GitとGitHubはどう違う？
似た名前で混乱しやすいですが、役割はまったく別物です。
- Git（道具）：あなたのパソコンの中で、変更履歴を保存する 仕組み。 ふだんは画面に出てこない、裏で動く録画機のような存在。
- GitHub（場所）：Gitの履歴ごと、コードを クラウドに置ける場所。 Web上のページとして表示・共有・バックアップができる。
Word に対する Google ドキュメント、メモ帳に対する Notion、と並べてみると分かりやすいです。 Gitが 手元のツール で、GitHubが クラウドのサービス。 このペアで、「変更履歴を残しつつ、どこからでもアクセスできる」状態が初めて完成します。
2どうしてVercelとGitHubはセットで使われるのか
AI開発でWeb Appを公開するとき、もっとも一般的な道のりが「GitHubにコードを置く → Vercelが自動で公開する」 という流れです。 Vercelは、GitHub上のコードを読み取って、変更があれば 自動でWeb Appをビルドし直し、URLで公開してくれます。
つまり、GitHubを 中継地点 として使うことで、 自分のパソコンと公開後のサイトを、糸電話のようにつなぐイメージです。 このレクチャーで作るアカウントは、Vercel編（Lecture 14）にもそのまま使います。
ユーザー名は「仕事で使っても恥ずかしくない名前」を
GitHubのユーザー名は、公開URL（github.com/your-name）や、 将来コラボするときの呼び名として表に出ます。 ニックネームよりも、メールやSNSと揃えやすい シンプルな英数字 をおすすめします。 あとから変更もできますが、リンクが切れることがあるので、最初に決められるとベストです。
3公式リソース
- GitHub 公式サイト— トップページ。右上から Sign up を選べます
- GitHub アカウント作成ページ— 直接サインアップ画面に行きたいときはこちら
- GitHub 公式ヘルプ「Creating an account on GitHub」— 公式の手順ガイド（英語）
4アカウント作成の手順
- 上のリンクから GitHub公式サイト または アカウント作成ページ を開きます。
- メールアドレス を入力します。仕事や長く使えるアドレスがおすすめです。
- パスワード を作成します。15文字以上、または8文字以上＋数字と小文字、が条件です。
- ユーザー名 を決めます（公開URLになるので、英数字でシンプルに）。
- ロボットでないことを確認するパズルや認証を済ませます。
- 登録したメールに届く 認証コード を入力して、メール認証を完了させます。
- ログインできることを確認し、右上のアイコンから プロフィール画面 を開いて、自分のページが表示されることを確認します。
「Free プラン」を選んで問題ありません
最初は Free（無料）プラン で十分です。 個人開発に必要な機能はFreeに揃っており、Vercelとの連携にも追加の費用は発生しません。 あとから必要に応じて有料プランへ切り替えられます。
5Cloneは「GitHubからPCにコピーする」こと
講義中に出てくる Clone（クローン）は、 GitHub上にあるコード一式を 自分のパソコンへ持ってくる操作 です。 ダウンロードに似ていますが、Gitの履歴も一緒に持ってくる点が違います。
Cloneしたフォルダは、ただのコピーではなく「GitHubとつながった作業フォルダ」です。 その中で変更し、commitして、pushすると、変更内容をGitHubへ戻せます。
ハンズオンではURLを置き換えて使う
実際のリポジトリURLは講師から共有されます。 Codex Appには、次のように依頼すれば十分です。
「このリポジトリURLをCloneして、pnpm installとpnpm devで起動してください。 エラーが出たら初心者向けに原因を説明してください」
- GitHubのリポジトリページで Code ボタンを押し、HTTPSのURLをコピーする。
- Codex Appで作業用フォルダを開き、Cloneを依頼する。
- Clone後に作られたプロジェクトフォルダをCodex Appで開く。
pnpm install、pnpm devの順で起動する。
6覚えておきたいこと
- Gitは 手元の道具、GitHubは クラウドの場所。
- GitHubはコードのバックアップであり、共同作業や公開の 中継地点。
- Cloneは、GitHub上のリポジトリを履歴ごと自分のPCへ持ってくる操作。
- Vercelなどの公開サービスは、GitHub上のコードを読み取って動く。
自分のGitHubアカウントを、Codexに紹介してもらう
アカウント作成が終わったら、Codex Appに次の依頼を投げてみましょう。 自分のアカウントの状態を、初心者にも分かる形で整理してもらえます。
- 「私のGitHubユーザー名は
your-nameです。https://github.com/your-nameを開いて、 いま公開されているプロフィールに何が表示されているか初心者向けに説明してください」 - 「次のレクチャーで、このGitHubアカウントを使ってコードをクラウドに保存します。 そのために事前に確認しておくべきことを3つ挙げてください」
7理解確認チェックリスト
- GitとGitHubの違いを、自分の言葉で説明できる。
- GitHubのアカウントを作成し、自分のプロフィール画面を開ける。
- Cloneが「GitHubからPCへコードを持ってくること」だと説明できる。
- Vercelなどの公開サービスがGitHubと連携するイメージを持てる。