近十年來 cloud service 大行其道，發展至今在一般公司內對外的服務，或多或少都有用到 cloud，這大大的改變了 IT 人員的習慣，原本凡事要先評估地端資源、購買 Server 等等，如今只要在 cloud provider 所提供的 web UI or CLI Tools，輕鬆點一點和下幾個指令，立即有可用的 Server or serverless computing，而且是 on-demand 的，不需要隨時可以關閉，這種模式的改變也加快速商業模式的推行
既然一般企業對外服務資源在趨勢上已經是從地端到雲端，那開發者的「開發環境」呢？一般當然是選一台效能不錯的 laptop (無論是 macos or windows 系統)，安裝 IDE、開發環境相關工具，然後設定所有需要配置的設定，然後開始進行開發，那如果這也可以上雲，會是怎麼樣呢？
雲開發環境優勢
如果跟 cloud srevice 一樣，只需要點一個按鍵就可以輕鬆建立雲開發環境，而且 IDE、開發環境相關工具、配置設定都已經搞定，那是不是很迷人呢？站在增進開發者效率來說，這確實很有可能是一個大趨勢了，畢竟開發者效率更好，勢必生產力更高，公司產品或服務就可以迭代的更快，是大家都所樂見的，以下也列出幾項優點
-
開發團隊環境一致: 有任何針對開發環境的修改，其他 team member 也可以輕鬆同步 (若是已開啟的雲開發環境需要 rebuild container)
-
開發環境單純: 相較於本機開發環境相比，開發的語言版本和系統套件更單純，例如 macos 上可能有預設的 node、python、php 等的 runtime 版本，若不符需求，還要額外安裝，再進行設定和切換，有時候弄不好可能還會搞的環境壞掉等等
-
更有效率的開發與測試: 例如 team member 開了一個 PR 需要 review，此時只要針對這個 PR 在 GitHub 點一下，立即建出這個 PR 的相關環境來使用，你可以跑一下 team member 的相關 test，進而給建議，甚至幫忙修改並 commit ，而完全不會干擾到你原本在開發的項目
Gitpod vs Codespace
Gitpod 和 codespace 都是提供基於 vscode 的雲開發環境，當然 gitpod 還有提供知名的 JetBrains IDE，但本篇主要針對 vscode 來做幾個面向的比較 (當然這是我使用過後的心得，可能也過於主觀)，以下是以「現況」來比較
客製化便利性
這部分若以自訂 Dockerfile 來建立 container image 或是直接引用自訂的 container image 來說，兩邊是一樣方便，但若是以啟動的 lifecycle 中可以再自訂義的其他設定來看，gitpod 做的比較好一點
Gitpod 在 .gitpod.yml 可設定 before、init、command 來新增額外要執行的指令，而 codespace 是設定 devcontainer.json 中的 postCreateCommand，但由於 .gitpod 文件上範例寫的比較清楚，且實際設定後 .gitpod 的範例相對比較多，設定起來問題也比較少，故 Gitpod 得分
寫 code 流暢度
這點單純從開啟 IDE 後，不論在 browser or local vscode connect remote 上，vscode 打字寫 code 都不會有頓頓的感覺，所以 Codespace 得分
開啟 IDE 速度
這部分使用相同的 image、不使用 prebuild 的功能下，codespace 較快，所以得分
開啟 IDE 速度 (prebuild)
這部分 Gitpod 支援的很好，文件完整，而 Codespace 還在 private preview 中，需要寫信去開通功能，且文件上沒看到什麼教學，故 Gitpod 得分
build code 速度
以簡單 CDK 來測試，使用 lambda bundlingImage 來測試，會 pull SAM node container 來 build，原始碼在這裡，實際上測試大約從 build container 到 CDK deploy 完成，大約都是 2:30 秒左右，所以從網路速度、build docker image 看起是差不多的
但由於如果需要複雜的運算的話， Codespace 應該會勝出才對，畢竟 Codespace 價格高出不少，基於公平一點比較，此項目還是給 Codesapce
本地 vscode 開啟
這個功能個人覺得還滿重點的，因為在 browser 上編寫程式雖然沒什麼問題，但就是覺得不太習慣，如果可以支援本地 vscode 開啟雲開發環境，那真的已經算是完全無痛轉移了
-
GitPod 在上週才發表推出支援 VS Code Desktop Support，使用 Remote Development using SSH，使用起來沒什麼太大問題，只有需要一直點擊授權的相關跳窗後，測試在 local vscode 打字，基本上會馬上同步到 browser IDE，基本上使用起來滿愉快的
-
Codespace 對於這部分支援的感覺更好(畢竟微軟自家產品線)，設定可參考這裡，使用起來感覺更流暢，不太像使用 remote ssh 的方式，這部分不太清楚技術細節，但總之使用起來流暢度更高，故這部分 Codespace 得分
價格
-
以現況來看，Gitpod 每月有 50 小時的 free quota, 每月 100 小時則需 9 塊美金
-
Codespace 以最低配備來計算，2 core 4G RAM, 以 100 小時來計算為 18 塊美金，剛好是 Gitpod 的二倍，故此部分 Gitpod 得分
補充
Codespace 是開啟一台獨立 vm 供使用、而 Gitpod 類似 share 分租的概念，所以 Codespace 效能上會比較好是很正常的，但相對上當然價格就貴多了
AKSK 問題考量
由於是在雲上的開發環境，像 AKSK 這類的問題需要思考如何處理，在本地時使用 static AKSK 是沒問題的 (例如 AWS static credential 放在 ~/.aws/credentail) ，但在雲上環境不適合，使用暫時的 AKSK 才是好方法，這邊推薦觀看 EP30 – 打造自己的Gitpod + AWS SSO的CDK開發環境(feat: Neil Guan)，影片中有詳細如何設定 AWS SSO 的方法，以及 pahud 和 neil 分享的一些小技巧
vscode 設定檔、extension 同步問題
這是有關於跨機器的 vscode 設定同步問題，這邊推薦一下官方sync 功能，目前使用起來除了第一次 enable 這功能時，vscode user settings.json 整個被清空掉，所以建議開啟這功能時先備份設定檔，而在此之後沒發生過什麼問題，算是很好用的功能，因為不管開啟 GitHub 哪個 repo，vscode 設定檔和 extensions 都是一致的
打造 CDK 開發環境
以 Gitpod 來說，建議先安裝 browser 的 plugin，Chrome plugin 為 Gitpod – Always ready to code，安裝完後在 GitHub 上就會出現一個 GitPod 按鈕
這部分以 CDK 在 Gitpod 上設定來做範例，基本上 Codespace 也不會太困難，設定檔配置好即可，有以下幾個項目需要完成
- AWS CLI v2 (為了 AWS SSO)
- 配置相容 AWS CLI v1 和 AWS SDK 的 AKSK，也就是
~/.aws/credential這個檔案 - 安裝最新版的 AWS CDK
- 安裝 zsh 和 Oh My Zsh (這兩個如果使用 Codespace 預設的 container，已經預設就配置好)
- 安裝 zsh plugin (例如 zsh-autosuggestions)
以 Gitpod 來說，只要設定 .gitpod.yml 和 .gitpod.Dockerfile，先來看一下 .gitpod.yml
image:
file: .gitpod.Dockerfile
tasks:
- name: install package
init: yarn install --frozen-lockfile && npx projen
- name: run docker
command: sudo docker-up &
- command: echo "source /usr/share/bash-completion/completions/git" >> $HOME/.zshrc
- command: echo "alias awsap=\"aws --cli-auto-prompt\"" >> $HOME/.zshrc
- command: zsh
vscode:
extensions:
- dbaeumer.vscode-eslint-
image file .gitpod.Dockerfile 待會說明，這邊也可以單純指定 image，就不用再設定 Dockerfile
-
tasks 可以設定 before、init、command，這邊主要安裝 node modules、設定 zsh 的設定檔和 plugin，這邊額外提一下 aws cli v2 有一個參數很好用，就是
--cli-auto-prompt，但因為參數太長，我習慣設定一個 alias awsap，只要我打 awsap 後，可以很輕鬆的使用 aws cli 命令提示的功能 -
extensions，這邊可以指定要先安裝哪一個 extensions，可以把專案需要用到的 extensions 都先設定上去
再來看一下 .gitpod.Dockerfile
FROM gitpod/workspace-full
USER root
# Install custom tools, runtime, etc.
RUN ["apt-get", "update"]
RUN ["apt-get", "install", "-y", "zsh"]
USER gitpod
# Install Oh-My-Zsh
RUN wget https://github.com/robbyrussell/oh-my-zsh/raw/master/tools/install.sh -O - | zsh || true
# Change zsh theme and zsh plugin
RUN sed -i 's/ZSH_THEME="robbyrussell"/ZSH_THEME="agnoster"/' ~/.zshrc && \
sed -i 's/plugins=(git)/plugins=(zsh-autosuggestions)/' ~/.zshrc
# install zsh plugin
RUN git clone git://github.com/zsh-users/zsh-autosuggestions && \
sudo mv zsh-autosuggestions ~/.oh-my-zsh/custom/plugins
# install aws cdk && aws-cli v2
RUN npm i -g aws-cdk && \
curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64.zip" -o "awscliv2.zip" && \
unzip awscliv2.zip && \
sudo ./aws/install
# start zsh
CMD ["zsh"]大致上註解都有寫的滿清楚，ZSH_THEME 就看自己偏好哪一個，而 zsh-autosuggestions 也是很常看到推薦的 plugin，會把用過的 command 記憶下來，只要打前面幾個字，就會自動帶出補上完整指令的提示，相當好用的功能
再來就剩下 配置相容 AWS CLI v1 和 AWS SDK 的 AKSK，可以直接參考這裡，這邊是使用大絕招「抄」字絕，也就是抄 pahud gitpod-workspace
在這邊我自己有遇到一個怪問題，就是使用 aws configure set 後，並不會產生 ~/.aws/credentail，很奇怪，所以最後改一下 script 使用 cat << EOF > 來直接寫入檔案
以上專案的原始碼在這裡
Gitpod prebuild
這功能也是 Gitpod 官方建議開啟的，開啟 prebuild 可以加快開啟 Gitpod 速度，主要原理是當 repo push commit 時，Gitpod 會自動重跑 .gitpod.yml 檔中的 tasks 中的 before、init 的部分，詳細可以參考GitPod 文件
設定文件可參考這裡，如果用手動的方式也很簡單，打開網址 gitpod.io/#prebuild/{your_repo_url} 即會開始 prebuild
結論
開發環境上雲個人認為已經是一個趨勢，雖然在前期也是需要適應的時間，團隊如果要導入也是需要轉換習慣的成本，但相信一旦團隊成員都習慣後，帶來的效益應該是很棒的
而 Gitpod 和 Codespace 目前如果以價格考量，我個人會先以 Gitpod 為優先，但我相信 Codespace 的優勢也是不少的，未來兩套的發展就值得再觀望和觀察了
