[青いTシャツを着た開発者は、マイクとGitHubのオクトキャットロゴで飾られたポップシールドの後ろに家に座っています。 開発者は、右上のウェブカメラで自分の映像が映ったまま、画面を共有しています。 画面には、"js-project" というGitHubリポジトリが表示されます。
開発者: 今日は、GitHub Codespaces で JavaScript プロジェクトを実行します。
[開発者がリポジトリ ページのファイル一覧の上にある [コード] ボタンを選んで、ドロップダウン メニューを開きます。 [「Codespaces で開く」をクリックし、その後「新しい Codespace」をクリックします。]
開発者: codespace を作成しているときに、「codespace とは何か」という疑問があるかもしれません。
[ブラウザーに codespace が読み込まれます。 白い背景では、"コードスペースの準備中" というテキストが、GitHubの Octocat ロゴと VS Code ロゴの下に表示されます。
開発者: codespace はインスタント クラウド開発環境です。実行、テスト、デバッグ、プッシュといった、開発環境で使い慣れているすべての操作を、ローカルの場合であれば必要なマシンの設定なしで実行できます。
[codespace がブラウザーの VS Code Web エディターに表示され、ダーク テーマで実行されます。 左サイドバーにはリポジトリのディレクトリとファイルが表示されます。 [統合ターミナルには、"Welcome to Codespaces" (Codespaces へようこそ) というメッセージと、含まれるランタイムとツールの一覧が表示されます。]
開発者: そのため、このコードスペースを作成すると、既にセットアップされているコンピューターに移動し、Python、Node、Docker などを備えています。そのため、Javaや Rust and Go、C++ などのツールが用意されています。
ただ、ご覧のとおり、既定のイメージにたどり着きました。 Codespaces のすばらしい点は、自分だけでなく、このリポジトリに参加するすべてのユーザーに合わせて、設定を完全にカスタマイズできることです。 そのため、独自のイメージ、Dockerfile、Docker Compose を使用できる "コードとしての構成" 設定を行うことができます。
このアプリを実際に起動してみましょう。 ここで を実行すると、アプリはポート 3000 で実行されていると表示されます。ブラウザーで開いて、アプリが完全に稼働している転送ポートにセキュリティで保護された方法で接続できます。
[転送ポートのポップアップが表示されます。 開発者は、このポップアップにある [ブラウザーで開く] というボタンをクリックします。 新しいブラウザーのタブが開き、"Haikus for Mona" というタイトルの Web ページが表示されます。 Webページには、OctocatのMonaが紫色の傘を持ち、にっこり笑いながら水たまりをスキップしている姿のイラストが表示されています。 画像の下には、俳句があります:「シアトルの雨」 傘を忘れないようにしてください、さもないと憂鬱になります。
開発者: このように、私の Node アプリが稼働し、codespace に接続されていることがわかります。 Codespaces での設定に 60 秒ほどかかりました。
[開発者は、Mona が触手でレコード プレーヤーをつついている画像までスクロールします。]
開発者: このように、完全にカスタマイズできるので、あらゆるリポジトリの設定時間を短縮できることが想像できます。
GitHub Codespacesについてざっと見てみました。
音声テキストの終了。 GitHub Codespaces の詳細については、GitHub Codespaces のドキュメントを参照してください。