POINT

GitHubは変更履歴を残すサービス

GitHubは、コードのバージョン管理ができるサービスです。Googleドキュメントの変更履歴のようなイメージで、いつ・誰が・何を変えたかを記録していけます。

01 元に戻せる

失敗しても、以前の状態にいつでも戻せる。安心して手を動かせる。

02 自動で公開

Cloudflare Pages・Vercelと連携し、プッシュするだけで自動公開できる。

03 共有しやすい

クライアントとコードを共有しやすく、受け渡しがスムーズになる。

基本

コミット・プッシュ・プルリクエスト

GitHubで覚えておきたい操作は、まずこの3つです。それぞれの役割を身近な言葉で押さえておきましょう。

01 コミット

セーブのこと。変更に名前をつけて記録する。作業の節目ごとに行う。

02 プッシュ

アップロードのこと。手元のコミットをGitHubのサーバーに送る。

03 プルリクエスト

変更の提案。「この変更をメインに反映して」という申請。確認してから反映したい時に使う。

準備

アカウントを作りリポジトリを用意

1

アカウント作成

github.com から Sign up(無料)。メール確認まで済ませれば準備完了。

2

リポジトリを理解する

リポジトリ(Repo)=コードを保管するフォルダ。案件やサイトごとに用意する。

3

公開範囲を決める

作成時にパブリックかプライベートかを選ぶ。次のスライドで違いを整理する。

比較

パブリックとプライベート

観点パブリックプライベート
見える範囲誰でも見える自分と許可した人だけ
料金無料個人は無制限で無料
向いている用途ポートフォリオ・OSSクライアント案件・社内ツール

注意クライアント案件は必ずプライベートで。なお Organization はチーム・会社単位で管理する組織アカウント。個人利用では不要ですが、複数人で共有・権限設定したい将来に役立ちます。

最重要

APIキーは絶対にGitHubに上げない

認証情報の入ったファイルを、誤ってそのまま公開してしまう事故が頻発しています。仕組みで防ぐことが何より大切です。

最重要APIキーやパスワードを含むファイルをGitHubに上げない。次の3つのファイルを使い分けて、秘密情報を確実に除外しましょう。

  • .env:秘密情報をまとめる絶対に上げない
  • .env.example:変数名だけのサンプル上げてOK
  • .gitignore:アップロードの除外設定ルートに置く
実物

.env / .env.example / .gitignore

.env(絶対に上げない)
ANTHROPIC_API_KEY=sk-ant-xxxx
DATABASE_URL=...
.env.example(上げてOK・値は書かない)
ANTHROPIC_API_KEY=
DATABASE_URL=
.gitignore(除外設定)
.env
node_modules/
.DS_Store
*.log
dist/

ヒント.gitignore に .env を書けば自動で除外されます。「このプロジェクト用の.gitignoreを作って」とClaudeCodeに頼めば自動生成できます。

初回設定

Gitのインストール確認と初期設定

はじめて使う前に、Gitが入っているかを確認し、名前とメールアドレスを一度だけ設定します。

インストール確認(表示されればOK・なければ git-scm.com から)
git --version
初回設定(名前とメールアドレスを登録)
git config --global user.name "あなたの名前"
git config --global user.email "メールアドレス"
比較

クローンはSSH接続がおすすめ

クローン=GitHubからコードをダウンロードすること。接続方法にはHTTPSとSSHがあり、慣れたらSSHが快適です。

観点HTTPSSSH
設定の手間少ない初回のみ設定
認証毎回パスワード入力鍵で自動・不要
セキュリティ普通高い
おすすめの人入門時慣れたらこちら
実演

SSH鍵の設定とクローン

① 鍵を作る
ssh-keygen -t ed25519 \
  -C "your-email@example.com"
② 公開鍵をコピー(Mac)
cat ~/.ssh/id_ed25519.pub | pbcopy
④ クローン
git clone git@github.com:username/repo.git

③ GitHubに登録GitHubの Settings → SSH and GPG keys → New SSH key を開き、コピーした公開鍵を貼り付けて保存します。

  • 鍵の作成は初回だけ。以降は認証不要で使える
  • クローン時のアドレスは git@github.com: で始まる形を選ぶ
日々の流れ

毎日の作業フロー

1

編集して変更を確認

コードを編集したら、左サイドバーのソース管理を開く。

2

ステージング

変更ファイルの「+」を押して、記録する対象を選ぶ。

3

コミット

メッセージを入力(例「ヘッダーのデザインを修正」)して「コミット」。

4

プッシュ

「変更のプッシュ」でGitHubに反映する。

併用のコツClaudeCodeに大きな変更を頼む前にコミットしておくと、変なコードになっても元に戻せます。こまめにコミットして、安心して実験できる環境を作りましょう。

ノーコードサロン