使用GitHub Codespaces隨時隨地寫程式碼

當今應用程式的開發速度要求軟體開發的速度、協作性和靈活性。GitHub Codespaces 透過解決老生常談的環境設定問題實現了這一點。不用再花幾個小時搜尋工具和依賴項，只需點選幾下，就能直接在雲中啟動完整的開發設定。由於 Codespaces 可直接與 GitHub 倉庫協同工作，因此更容易上手和執行。它還支援遠端工作，並能在不同的設定中保持一致性，是個人、團隊和開源貢獻者的強大工具。在本文中，我們將全面瞭解 GitHub Codespaces，包括其功能、應用、定價以及如何免費使用。

什麼是GitHub Codespaces？

GitHub Codespaces 是一種基於雲的開發環境，可在虛擬機器上的 Docker 容器內執行。這樣，您就可以直接在瀏覽器上或透過 Visual Studio Code 編寫程式碼，而無需在本地安裝任何東西。每個程式碼空間都在 Linux 環境中執行，可以使用版本庫中定義的配置檔案進行設定。這種做法被稱為“配置即程式碼”（Configuration-as-Code）。

在 GitHub 程式碼空間，你可以從模板或版本庫的任何分支啟動程式碼空間，從而輕鬆保持工作的組織性和一致性。它允許你使用開發容器自定義工具和執行時，並使用 Dotfiles 設定個人偏好。設定同步還能讓你體驗到與本地 VS 程式碼一樣的體驗。此外，它還能讓你的開發設定變得簡單且可重複，幫助你隨時隨地快速開始編碼。

推薦閱讀：Git 和 Github 入門

GitHub Codespaces的特點

以下是 GitHub Codespaces 提供的一些主要功能：

1. 預配置開發環境：GitHub Codespaces 為每個版本庫定製了一個即用、一致的開發環境。它消除了設定問題，並在不影響本地機器的情況下確保各貢獻者的統一性。
2. 訪問所需資源：它可讓您在資源充足的雲端計算機器上工作，減輕本地機器的計算負擔。這使您能夠處理大型、資源繁重的專案，而不受硬體限制。
3. 隨時隨地工作：有了 GitHub Codespaces，你就不再侷限於一臺裝置。由於它是在網頁瀏覽器上執行的，你可以從任何裝置、任何地方訪問你的程式碼空間。
4. 選擇你的編輯器：該平臺支援多種編輯器，你可以選擇適合自己的編輯器。你可以使用 VS Code 網路客戶端、JupyterLab 或透過 Visual Studio Code 桌面版進行連線。
5. 在多個專案上工作：你可以為不同的專案建立和管理多個程式碼空間，甚至為同一專案的不同分支建立和管理多個程式碼空間。這有助於保持工作的隔離和有序，降低意外更改影響其他工作的風險。
6. 與隊友結對程式設計：利用 Visual Studio Code 的即時共享擴充套件，你可以在程式碼空間內與團隊成員進行即時協作。這項功能非常適合結對程式設計、除錯會話和指導。
7. 從程式碼空間釋出 Web 應用程式：程式碼空間允許你轉發埠並共享 URLS。這意味著你可以直接從雲中建立一個演示應用程式，而你的隊友可以訪問並測試更改，然後再透過拉取請求最終完成。

瞭解Codespace的生命週期

瞭解 GitHub 上程式碼空間的生命週期對於管理從建立到刪除的工作至關重要。生命週期從建立程式碼空間開始，到刪除程式碼空間結束。在生命週期內，你可以隨時斷開或重新連線，而不會丟失正在執行的程序。更明確地說，停止或重新啟動程式碼空間不會刪除已儲存的更改。

1. 建立程式碼空間

在 GitHub 上，你可以選擇建立一個新的程式碼空間或開啟一個現有的程式碼空間。有些開發者喜歡為每次會話建立一個新的程式碼空間，而有些開發者則會保留一個長期執行的程式碼空間，以便持續工作。該平臺還提供從模板建立程式碼空間的選項。

不過，一次建立或執行的程式碼空間數量是有限制的。如果超過了限制，就需要刪除或停止現有的程式碼空間，以便騰出空間啟動新的程式碼空間。如果你經常使用新的程式碼空間，我建議你經常向 GitHub 推送你的提交，以確保新的程式碼空間始終有足夠的空間。而對於長期執行的程式碼空間，在開始工作之前，一定要拉取最新的程式碼。

2. 在程式碼空間中儲存修改

GitHub 程式碼空間的網頁版預設開啟了自動儲存功能，因此儲存更改內容不成問題。但如果在桌面的 VS Code 上使用，則需要手動啟用自動儲存功能。所有工作都儲存在雲虛擬機器上，你可以隨時停止，稍後再返回。在退出之前，平臺甚至會提示你儲存任何未儲存的更改。但如果刪除程式碼空間，其中的所有工作都會丟失，除非提交併推送。

預設情況下，不活動的程式碼空間會在 30 分鐘後超時。你可以在設定面板中更改這一設定。不過不用擔心超時問題，因為在此之前儲存的資料仍然完好無損。

3. 重建程式碼空間

如果更新了開發容器配置，就可以重建程式碼空間。預設情況下，GitHub 會使用快取映象來重建程式碼空間。不過，如果你想從一個乾淨的環境開始，也可以選擇完全重建。請記住，只有 /workspace 資料夾內的檔案會被儲存，其他檔案都會在重建過程中被重置。您也可以選擇完全重建，從頭開始。

4. 停止程式碼空間

您可以隨時停止程式碼空間。停止時，所有程序都會停止，但儲存的工作仍會保留。終端歷史記錄也會保留。關閉瀏覽器標籤頁並不能停止程式碼空間。它仍在雲中執行，執行時會向你收費。要停止程式碼空間，可以按照以下步驟操作：

1. 轉到你的程式碼空間 。
2. 點選右端的三個點。
3. 選擇“Stop codespace”。

5. 刪除程式碼空間

推送更改後，就可以安全地刪除程式碼空間了。工作完成後，刪除程式碼空間非常簡單；只需確保先在 GitHub 上推送了更改，這樣就不會丟失任何內容。如果有任何未提交的修改，GitHub 會要求你在刪除前推送或匯出它們。此外，預設情況下，停止的程式碼空間會在 30 天后自動刪除。但請記住，即使刪除後，程式碼空間仍可能計入計費，直到週期結束。

6. 使用GitHub Codespaces時失去連線

GitHub Codespaces 需要網際網路連線才能執行。因此，如果失去網路連線，就無法使用程式碼空間。但幸運的是，未儲存的更改仍然存在。因此，一旦重新連線，就可以從相同的狀態恢復。如果你的連線不穩定，或者計劃經常離線工作，我建議你使用本地容器，並使用 Dev Containers 擴充套件和 devcontainer.json。

GitHub Codespaces入門

現在讓我們看看如何使用 GitHub 程式碼空間。與其從頭開始，不如直接從模板庫中建立程式碼空間。在本教程中，我們將使用基於瀏覽器的 VS Code 版本，它是 Codespaces 的預設編輯器。如果需要，稍後可以切換到其他編輯器，並更改預設設定。

第 1 步：建立程式碼空間

在這一步中，我們將使用現成的 GitHub 模板建立一個新的程式碼空間。這將幫助我們快速啟動或建立一個開發環境，而無需在本地機器上設定任何東西。

1. 首先開啟 github/haikus-for-codespaces 模板庫。
2. 點選“Use this template”。
3. 然後，選擇“Open in a codespace”，如下圖所示。

這樣，模板就會自動克隆到你的新程式碼空間中。

第 2 步：執行應用程式

在這一步中，我們將執行應用程式檢視其執行情況。這樣，我們就可以在平臺內測試即時更改。

從下圖中可以看到，終端已準備就緒。現在讓我們執行應用程式。

1. 下一步是輸入 npm run dev 命令。這將使用 package.json 中的 dev 指令碼執行 Node.js 應用程式。

2. 應用程式執行時會出現一個彈出視窗。點選“Open in Browser”檢視。

3. 在瀏覽器中開啟後，您將看到以下內容。

第 3 步：編輯和預覽更改

在這一步中，我們將編輯專案內容並檢視即時更改。這將有助於我們理解即時更新在程式碼空間中是如何工作的。

1. 轉到資源管理器，開啟 haikus.json 檔案。

2. 現在更改第一個或所有俳句的文字，然後重新整理瀏覽器選項卡以檢視更新。

3. 如果標籤頁被誤關閉，請轉到 VS Code 中的埠標籤頁，點選轉發埠旁邊的瀏覽器圖示。

第 4 步：提交併推送更改

現在我們已經做了一些修改，可以將它們推送到 GitHub 上。為此：

1. 在活動欄中點選“Source Control”檢視。

2. 點選 “+”，輸入提交資訊，然後點選“Commit”，將更改後的檔案放入階段。

3. 現在，點選“Publish Branch”。

4. 登入 GitHub 賬戶，為新倉庫命名。然後，選擇以公開或私有方式釋出。你還可以使用“Open on GitHub”（在 GitHub 上開啟）檢視新倉庫中的更改。

GitHub Codespaces定價

既然我們已經學會了如何使用 GitHub Codespaces，那就來了解一下使用它的費用吧。GitHub 根據儲存和計算時間提供靈活的定價模式，如下所示：

如表中所述，GitHub Codespaces 免費向個人使用者提供每月 60 小時的標準計算時間和最多 15 GB 的儲存空間，這使它成為業餘專案、學習或測試工作流程的絕佳選擇，且無需任何前期費用。除了免費層級，GitHub 還提供基於使用量的定價，確保你只需為使用付費。

何時使用GitHub Codespaces？

Github Codespaces 是許多工的理想選擇，例如

• 貢獻開源：GitHub Codespaces 可讓你在基於雲的整合開發環境中立即開始編碼，消除了設定本地環境的障礙。這讓新的貢獻者更容易快速、自信地參與開源專案。
• 學習和教學：教師可以與學生或研討會參與者共享預先配置好的環境，確保每個人都在同一起跑線上起步。這促進了包容性學習，降低了進入開源生態系統的技術門檻。
• 企業專案：Codespaces 可確保各團隊擁有安全、一致的開發環境，在受監管或分散式環境中尤其有用。企業工作流程中的開源工具可從這些標準中受益，加強協作，減少摩擦。
• 嘗試新專案：您可以探索和嘗試開源軟體源，而無需花費時間在本地配置依賴關係。這可以激發好奇心，降低使用新技術或工具所需的投入。

GitHub.dev與GitHub Codespaces

如果你以前用過 GitHub，你可能見過 GitHub.dev，並想過它與 GitHub Codespaces 有什麼不同。雖然它們看似相似，但作用卻大相徑庭。

• GitHub.dev 是一個輕量級程式碼編輯器，完全在瀏覽器上執行，快速而簡單。它最適合小規模的程式碼編輯，因為你不能在上面執行或測試程式碼。
• 另一方面，GitHub Codespaces 為你提供了一個完整的開發環境。你可以在同一平臺上進行程式碼編寫、執行和除錯，無需在本地進行任何設定。

除非提交，否則 GitHub.dev 中的工作不會儲存；一旦關閉，未儲存的工作就會消失。但在 Codespaces 中，即使你關閉了它，你的工作進度也會儲存下來。此外，Codespaces 還能與 VS Code 或 JetBrains 等完整的整合開發環境配合使用，並允許你在本地和雲端同步設定。對於大型專案和團隊合作來說，這是一個更好的選擇。

現在，讓我們根據各種功能對兩者進行比較：

小結

GitHub Codespaces 改變了開發人員的編碼方式。它消除了設定上的困難，提供了功能強大的雲端開發環境，簡化了工作流程，提高了工作效率。無論您是獨自工作、團隊協作，還是作為學生剛剛開始工作，Codespaces 都能確保您獲得快速、一致和靈活的體驗。憑藉瀏覽器內開發、全面的整合開發環境支援以及與 GitHub 資源庫的無縫整合等功能，它能讓開發人員將更多精力放在構建上，而不是配置上。簡而言之，該平臺重新定義了現代開發，使其更加完善。