デプロイと、お祝い
あなたのゲームを web に公開して、コースを完走する
⏱ 想定 ~8 分
01 · 読む
コース全体の最後の課です。
これから、リアルタイム・マルチプレイヤーゲームを web にデプロイします。 URL を持っている人なら誰でも遊べます。別の大陸にいる見知らぬ 2 人が、あなたのリンクを開いてリアルタイムで tic-tac-toe を遊べる。
それをあなたが作ったのです。ターミナルが何かも知らないところから、 WebSocket 駆動のマルチプレイヤーゲームをデプロイするところまで。本物の旅でした。
ポイントまとめ
- Render は WebSocket 対応の Node.js アプリをホストできる
- デプロイは Level 4 で学んだ git push の流れに乗る
- ゲームが web 上の誰からでもアクセスできるようになる
- これが最後の課 —— コースの全てを学びきりました
02 · ステップ解説
tic-tac-toe ゲームを Render の Web Service としてデプロイします。各ステップを丁寧に進めましょう。
1. Render にログイン
render.com にアクセスし、 GitHub アカウントでログインします。 Render アカウントがなければ作ってください —— 無料プランで十分です。
2. 新しい Web Service を作る
「New」→「Web Service」をクリック。前の課で push した GitHub リポジトリを接続します。 Render が Node.js アプリだと自動で判定します。
3. サービスを設定する
Build command を「npm install」、 start command を「node server.js」に設定。無料プランで OK です。リージョンはどこでもよいので、自分の場所に近い、レイテンシが小さいところを選びましょう。
4. デプロイ
「Create Web Service」をクリック。 Render がリポジトリを clone し、 npm install を実行し、 server を起動します。デプロイログを見て —— 準備完了になると「Server listening on port...」が表示されるはずです。
5. あなたの URL を受け取る
デプロイが終わると、 Render が your-app-name.onrender.com のような URL をくれます。ブラウザで開いてください —— ゲームが表示されるはずです。 2 つ目のタブで（または友達に送って）開いて、 web 上で本当の対局をしてみましょう。
03 · 実機演習
デプロイしたゲームが端から端まで動くか検証しましょう。
04 · 読む
無料プランでひとつ知っておくべきこと： Render の無料プランでは、 15 分間アクティビティがないとサービスが spin down します。 Spin down 後、最初の訪問者は約 30 秒待って起動を待つことになります。そのあとは普通に動きます。
ポートフォリオ用途ならこれで十分です。常時起動させたいなら Render の有料プランが月数ドルから使えます。でも、作ったものを見せるだけなら無料プランで何の問題もありません。
ポイントまとめ
- 無料プランは 15 分間アクティビティがないとスリープする
- スリープ後の最初のリクエストは約 30 秒かかる（コールドスタート）
- 起動してしまえば通常の速度
- 常時起動が必要なら、有料プランでスリープ動作を解消できる
05 · チェックリスト
最後の確認です。各項目をチェックして、プロジェクトが完成していることを確かめましょう。
- ゲームがデプロイされ、公開 URL からアクセスできる
- 2 人のプレイヤーがマッチングしてリアルタイムに対局できる
- 切断処理がきちんと動く
- GitHub の README にプロジェクトの説明と起動方法がある
- Git 履歴がきれいで、意味のあるコミットが並んでいる
- コードにデバッグ用の console.log が残っていない
06 · 読む
あなたはやり遂げました。
出発点を思い出してみてください。ファイルパスが何かを知らなかった。ターミナルを開いたことがなかった。 Git は謎で、 API はただのバズワードでした。
今では、ファイルシステムを歩き回り、コマンドラインからファイルを操り、 git でコードの履歴を追い、 GitHub に push し、 Node.js の server を立て、本物の API を叩き、 Claude Code をペアプログラミングのパートナーとして使い、リアルタイム・マルチプレイヤーゲームを web にデプロイするところまで来ました。
もう「プログラミングを学んでいる人」ではありません。あなたはものを作る人です。ターミナルは道具。 Claude Code はパートナー。 web はあなたの舞台です。
プロのエンジニアもみんな、今のあなたと同じ地点から始まりました —— 完成した 1 つのプロジェクトと、次の 1 つを作れるという自信。その自信こそが、本当の卒業です。
作りに行きましょう。
ポイントまとめ
- ターミナル知識ゼロから、マルチプレイヤーゲームのデプロイまで進んだ
- 学んだスキル —— ターミナル、 git、 Node.js、 API、 Claude Code —— はプロが毎日使っているのと同じ道具
- 完成した 1 つのプロジェクトと、次を作れるという自信 —— それが本当に大切なもの
- ここはゴールではなく —— スタートラインです
07 · クイズ
コースをやり切りましたね。あなたが身につけた一番大切なスキルは？
- ターミナルのコマンドを暗記すること
- 問題を分解し、道具をうまく使い、本物のものを作れる力 —— たとえまだ全部を知らなくても
- JavaScript の関数を全部暗記すること
- コマンドをすごく速くタイプすること
⚠ 全機能のインタラクティブ体験には JavaScript が必要です。JavaScript を有効にして再読み込みしてください。
※ このサイトは独立した教育プロジェクトで、Anthropic の公式製品ではありません。Claude™ は Anthropic, PBC の商標です。