GitHub Codespacesとは：ブラウザで開発する仕組みと無料枠

GitHub Codespacesは、GitHubのサーバーの中に作業用のパソコンを1台用意して、ブラウザやVS Codeから使う機能です。手元に何も入れなくてもコードを動かせるので便利な一方、無料枠があること、放っておくと自動で消えることを知らないまま使うと困ります。

ここでは小さな料理教室のリポジトリを例に、開き方、中で直してGitHubへ送るまで、料金、止め方を順に見ます。読み終わると、自社に要るかどうかを判断でき、使うときに変更をなくさずに済みます。

この記事の内容

1. 先に答えると
2. Codespacesとは何か
3. 無料枠と料金
4. 開く手順
5. 中で直してコミットする。pushを忘れると消える
6. 止め方と、自動で止まる・消えるまで
7. devcontainerの入口
8. 鍵とポートの扱い
9. 小さな会社で要るか
10. できないことと、その代わり
11. よく詰まるところ
12. 次に読む

先に答えると

Codespacesは、クラウド上の開発環境をリポジトリごとに作る機能です。個人のアカウントには毎月の無料枠があり、Organization（会社単位のアカウント）には無料枠がありません。料金表の数字を直すだけなら要りません。外注エンジニアBのように、人によってパソコンの環境が違って動かないときに効きます。

• 個人のFreeの無料枠は月120コア時間（2コアで60時間）とストレージ15GB（2026年11月時点）
• 動いている間は、使っていなくても時間が減ります。既定では操作がなくなって30分で止まります
• 止めたまま既定で30日たつと、自動で消えます。送っていない変更があっても消えます
• 直したら git commit だけで終わらせず git push までやります
• ブラウザのタブを閉じただけでは止まりません

Codespacesとは何か

Codespaces（1つひとつはcodespace）は、GitHubが用意した仮想のマシンの中で動く開発環境です。OSはLinuxです。そこにリポジトリ（履歴つきのファイル一式）の中身が入った状態で開きます。接続の方法は、ブラウザ、VS Code、GitHub CLI（gh）の3つです。

一番小さいマシンは2コア、メモリ8GB、ストレージ32GBです。リポジトリに何も設定がなければ、Python、Node、PHP、Java、Go、Ruby などの言語と、Git、GitHub CLIが入った標準の環境で始まります。

名前が似ているものと比べます。

比べるところ	手元のVS Code	github.dev	GitHub Codespaces
動く場所	手元のパソコン	ブラウザの中だけ	GitHubのサーバー
料金	無料	無料	無料枠のあとは使った分だけ
開き方	アプリを開く	リポジトリの画面で . を押す	「Code」から作る
待ち時間	ほとんどない	すぐ開く	数分かかることがある
ターミナル	使える	使えない	使える
スクリプトを動かす	手元に入っていれば動く	動かせない	動かせる
拡張機能	使える	Web対応の一部だけ	VS Codeの拡張機能を入れられる

github.devは、ブラウザで開くVS Codeの見た目の編集画面です。GitHubにサインインした状態で、リポジトリの画面で .（ピリオド）のキーを押すと開きます。URLの github.com を github.dev に変えても開けます。menu.html の数字を直すだけなら、これで足ります。

send_mail.py を実際に動かして試したいなら、github.devでは動かせないので、手元の環境かCodespacesになります。

無料枠と料金

数字はすべて2026年11月時点です。

個人のアカウントの無料枠

プラン	コア時間（月）	2コアでの実時間	ストレージ（月）
GitHub Free（個人）	120	60時間	15GB
GitHub Pro（個人）	180	90時間	20GB

コア時間は、マシンのコア数と時間を掛けた単位です。2コアなら1時間で2コア時間減ります。4コアにすると減り方は2倍です。

超えた分の単価

マシン	1時間あたり	1時間で減るコア時間
2コア	$0.18	2
4コア	$0.36	4
8コア	$0.72	8
16コア	$1.44	16
32コア	$2.88	32

ストレージは1GB月あたり$0.07です。codespaceが存在している間かかります。止めている間は時間の分はかからず、ストレージの分だけかかります。

Organizationの扱い

OrganizationのプランにCodespacesの無料枠はありません。誰が払うかは、Organizationのプランと設定で決まります。

Organizationのプラン	誰が払うか
Free	codespaceを作った本人。本人の無料枠が減る
Team	「Codespace ownership」の設定で、Organizationか作った本人
Enterprise Cloud	「Codespace ownership」の設定で、Organizationか作った本人

作る画面に、誰の支払いになるかが出ます。sample-cooking がFreeのままなら、外注エンジニアBが website で作ったcodespaceはBの支払いです。頼むなら先に話しておきます。

使い切るとどうなるか

状況	動き
支払い方法を登録していない	使えなくなる。そのアカウントの支払いになるcodespaceを作ることも再開することもできない
支払い方法を登録している	予算の範囲で請求される。90%と100%で通知メールが来る

料金ページでは、Freeが「$0 spend limit」、TeamとEnterpriseが「Ability to increase spend limit」と書かれています。使い切って止まっても、変更は「Export changes to a branch」でブランチ（枝）に取り出せます。手順は後で書きます。

無料枠は請求の区切りごとに満額へ戻ります。

止め忘れの計算

課金の説明には、使っていたかどうかに関係なく、動いていた時間の合計で請求するとあります。既定の30分の自動停止があるので、1回の止め忘れは小さく済みます。ただし次の設定をすると話が変わります。

• 自動で止まるまでの時間を、上限の4時間まで延ばす
• マシンを大きくする（16コアなら1時間で16コア時間減る）
• codespaceを消さずに何個も残す（ストレージが積み上がる）

2コアを平日に毎日4時間動かすと、月20日で80時間です。無料枠の60時間を20時間超えるので、超えた分は$3.60です。支払い方法を登録していなければそこで止まるだけです。登録しているなら、予算を決めておきます。

使用量は、個人なら github.com/settings/billing で製品ごとに見られます。Organizationは「Billing & Licensing」の「Usage」または「Metered usage」です。

開く手順

website のcodespaceを作ります。

1. GitHubでリポジトリ website を開きます。
2. リポジトリ名の下の枝の欄で main を選びます。
3. 「Code」を押します。
4. 「Codespaces」タブを押します。
5. 「Create a codespace on main」を押します。

マシンの準備が終わると、ブラウザの中に左にファイルの一覧、右に編集画面、下にターミナルが並ぶ画面が開きます。VS Codeを使ったことがあれば同じ見た目です。

2回目からは、同じ「Codespaces」タブか github.com/codespaces の「Your Codespaces」の一覧で名前を押すと、続きから開けます。「Create a codespace on main」をもう一度押すと別のcodespaceがもう1つ増えるので、ストレージの分も増えます。

中で直してコミットする。pushを忘れると消える

一番大事なのはここです。codespaceの中のファイルは、GitHubのリポジトリとは別の場所にあります。

どこまでやると何が残るか

やったこと	変更がある場所	codespaceが消えると
保存しただけ	codespaceの中	消える
コミットしただけ	codespaceの中の履歴	消える
git push まで	GitHubのリポジトリ	残る

コミットは手元の履歴に変更を記録する操作で、pushはその履歴をGitHubへ送る操作です。手元のパソコンでは、コミットだけでもパソコンを捨てない限り残っています。Codespacesでは、その「手元のパソコン」自体が決まった日数で消えます。

ファイルの保存は、ブラウザの画面なら既定で自動です。デスクトップのVS Codeからつないでいる場合は、自分で自動保存を有効にしないと保存されません。

流れ

ターミナルで枝を分けて、料金表を直します。ブランチ（枝）は main から分かれた作業用の流れです。

$ git switch -c fix-menu-price
Switched to a new branch 'fix-menu-price'

menu.html を直してからコミットします。

$ git status --short
 M menu.html
$ git add menu.html
$ git commit -m "料金表を修正"
[fix-menu-price 98f64ac] 料金表を修正
 1 file changed, 1 insertion(+), 1 deletion(-)

ここで止めると、変更はまだGitHubにありません。次のコマンドで確かめられます。

$ git log origin/main..HEAD --oneline
98f64ac 料金表を修正
$ git branch -r
  origin/main

git log origin/main..HEAD は、GitHubの main に無くて、ここにだけあるコミットを出します。git branch -r はGitHubにある枝の一覧で、fix-menu-price が無いことが分かります。この状態でcodespaceが消えると、体験教室の料金は3,000円のままです。

送ります。

$ git push -u origin fix-menu-price
 * [new branch]      fix-menu-price -> fix-menu-price
branch 'fix-menu-price' set up to track 'origin/fix-menu-price'.
$ git branch -r
  origin/fix-menu-price
  origin/main

次のコミットからは、git status で送り忘れが見えます。

$ git status
On branch fix-menu-price
Your branch is ahead of 'origin/fix-menu-price' by 1 commit.
  (use "git push" to publish your local commits)

nothing to commit, working tree clean

ahead of と by 1 commit は、GitHubより1コミット進んでいる、つまり1つ送っていないという意味です。席を立つ前にこの行を見る習慣をつけると、なくしません。

画面だけで送るとき

コマンドを使わないなら、左の帯の「Source Control」でできます。

1. 左の帯の「Source Control」を押します。
2. 変更したファイルの横の「+」（Stage changes）を押します。
3. 入力欄にコミットメッセージを入れます。
4. 「Commit」の右の下向きの矢印を押します。
5. 「Commit & Push」を押します。

止め方と、自動で止まる・消えるまで

起きること	既定	変えられる範囲
操作がなくなって自動で止まる	30分	5分から240分。「Default idle timeout」
操作していても止まる	12時間	変えられない
止めたまま置いて自動で消える	30日	0日から30日。「Default retention period」

設定はどちらも、GitHubの右上のプロフィール画像から「Settings」→「Codespaces」にあります。組織のポリシーがあれば、それより短くなることがあります。

自動で消える日数は、開き直すとそこから数え直します。保持が1日より長ければ、消える1日前にメールが来ます。一覧のメニューの「Keep codespace」を選ぶと自動で消えなくなりますが、ストレージの料金はかかり続けます。

自分で止める手順です。

1. github.com/codespaces を開きます。
2. 止めたいcodespaceの右の「…」を押します。
3. 「Stop codespace」を押します。

VS Codeからなら、コマンドパレット（Macは Shift+Command+P、Windowsは Ctrl+Shift+P）で「Codespaces: Stop Codespace」を選びます。

止めても保存した変更は残ります。消すと終わりで、送っていないコミットがあると警告は出ますが、戻せません。消しても、その月にすでに使った分は減りません。

変更を取り出す

無料枠を使い切って開けないときでも、一覧から取り出せます。

1. github.com/codespaces を開きます。
2. 対象のcodespaceの右の「…」を押します。
3. 「Export changes to a branch」を押します。
4. 「Create branch」を押します。

取り出せるのは、そのとき開いていた枝だけです。枝の名前は codespace- で始まる自動の名前になります。読み取り権限だけのリポジトリでは「Export changes to a fork」になります。100MiBを超えるファイルがあると取り出せません。

devcontainerの入口

リポジトリに .devcontainer/devcontainer.json というファイルを置くと、codespaceの中身を決められます。入れる言語、拡張機能、自動で転送するポートなどです。ファイルをコミットしておけば、全員が同じ環境で始まります。

{
  "image": "mcr.microsoft.com/devcontainers/python:0-3.11-bullseye",
  "forwardPorts": [8000]
}

image は使う環境の指定で、forwardPorts は次の節のポートを最初から開く指定です。雛形は、コマンドパレットの「Codespaces: Add Dev Container Configuration Files」から作れます。

全員に要るものだけ書き、個人の好みの設定は入れません。作るのは外注エンジニアBの仕事で、代表は「.devcontainer が入っていれば、誰が開いても同じ環境です」くらいに分かっていれば十分です。変更を反映するには、codespaceの再構築（rebuild）が要ります。

鍵とポートの扱い

鍵はCodespacesのSecretsに入れる

send_mail.py を試すにはメールサーバーのパスワードが要ります。.env に書いてコミットすると履歴に残るので、Codespaces用のSecretsに入れます。

1. GitHubの右上のプロフィール画像を押します。
2. 「Settings」を押します。
3. 左の「Codespaces」を押します。
4. 「Codespaces secrets」の横の「New secret」を押します。
5. 名前に SMTP_PASSWORD と入れます。
6. 値を入れます。
7. 「Repository access」で reservation-mail を選びます。
8. 「Add secret」を押します。

codespaceのターミナルで環境変数（プログラムに渡す名前付きの値）として読めます。動いているcodespaceには反映されないので、一度止めて開き直します。登録の場所はGitHub Actionsの鍵とは別です。

ここで登録するのは個人のアカウントの鍵で、本人だけのものです。リポジトリや組織の単位で登録する方法もあります。

ポートの公開

codespaceの中で動かしたホームページは、転送（ポートフォワード）されたURLで見られます。ポートはサーバーの中の窓口の番号です。

設定	誰が見られるか
Private（既定）	自分だけ
Private to Organization	そのURLを知っているOrganizationの人。Team か Enterprise Cloud が要る
Public	URLとポート番号を知っている人なら、ログインなしで誰でも

Bが試作のページを代表に見せたいときに、Publicにしたくなります。URLを知っていれば誰でも見られるので、試し終わったらPrivateに戻します。変える場所は、ターミナルの「PORTS」タブで、ポートを右クリックして「Port Visibility」です。

小さな会社で要るか

場面	判断
menu.html の数字を直す	要らない。GitHubの画面か github.dev で足りる
代表がAIに手伝わせて直す	手元のVS Codeで足りる
send_mail.py がBのパソコンでは動くのに代表のパソコンで動かない	効く。同じ環境で試せる
新しい外注先が来るたびに環境づくりで半日消える	効く。devcontainer.json を入れておく
手元のパソコンに何も入れられない	効く。ブラウザだけで足りる
毎日長時間開発する	手元の環境と費用を比べて決める

実際に運用していると、代表が使う場面はほとんどなく、話に出てくるとすれば外注先との環境の違いを埋めるときです。

できないことと、その代わり

できないこと	理由	代わり
WindowsやmacOSの環境で動かす	開発コンテナはLinuxで動く	手元のパソコンで開発する
オフラインで使う	サーバーの中にある	手元のVS CodeのDev Containers拡張機能で動かす
動かし続ける	12時間で止まる	サーバーを別に借りる。定時の処理ならGitHub Actions
Organizationの無料枠を使う	無料枠は個人のアカウントだけ	作った本人の枠を使うか、Teamで予算を決める
ホームページの公開先にする	開発用で、止まる	GitHub Pagesなど

よく詰まるところ

症状	原因	直し方
直したはずの内容がGitHubに無い	pushしていない	codespaceで git status を見て git push する
codespaceが一覧から消えた	止めたまま30日たった	送っていなければ戻らない。pushを習慣にして、要るなら「Keep codespace」
タブを閉じたのに時間が減っている	閉じても止まらない	30分で止まる。すぐ止めるなら「Stop codespace」
新しく作れない、開けない	無料枠を使い切った	「Export changes to a branch」で取り出す。支払い方法を入れるか次の区切りを待つ
「Codespaces」タブで作れない	リポジトリの公開範囲や組織の設定	有料プランの組織の場合は、オーナーに「Settings」→「Codespaces」→「General」の「Codespaces access」を聞く
環境変数が空	作ったあとにSecretsを足した	止めて開き直す。「Repository access」も見る
共有したURLが相手に見えない	ポートがPrivate	「Port Visibility」を確かめる。終わったら戻す
請求がBの個人の支払いになった	OrganizationがFreeか、本人払いの設定	作る画面の表示を確かめ、Teamなら「Codespace ownership」を見る

次に読む

コミットとpushの違いをもう一度確かめるなら git add・commit・pushの違い：保存して送るまでの流れ に、手元で開くほうは VS CodeでGitとGitHubを使う：連携の手順と、画面の読み方 にあります。鍵の置き方や定時の処理は GitHub Actionsの使い方：自動で動かす仕組みと無料枠 に、プランごとの違いは GitHubの料金：Free・Team・Enterpriseと無料でできる範囲 にまとめています。