---
# System prepended metadata

title: Cloud Code
tags: [other]

---

---

title: Cloud Code # 簡報的名稱
tags: other   # 簡報的標籤

---


# Cloud Code

## Install Tool

### [VS Code](https://code.visualstudio.com/)

### [docker client](https://docs.docker.com/get-docker/)

### [kubectl](https://kubernetes.io/docs/tasks/tools/install-kubectl/)

### [VSCode Cloud Code](https://github.com/GoogleCloudPlatform/cloud-code-vscode)

### [Skaffold](https://skaffold.dev/docs/install/)

### [Google Cloud SDK](https://cloud.google.com/sdk/install?hl=zh-tw)

## Cloud Code Cmd

### 1. Run On Kubernetes

> Cloud Code: Run On Kubernetes

#### 1.1. Run On Kubernetes
![](https://i.imgur.com/6WEICyA.png)

#### 1.2. Add Configuration
![](https://i.imgur.com/apZPA1f.png)


#### 1.3. Artifact Input Wizard
![](https://i.imgur.com/732HRk0.png)

#### 1.4. Use current context
![](https://i.imgur.com/06cCYqa.png) 

> Cloud Code會自動產生 skaffold.yaml

![](https://i.imgur.com/JTZdosH.png)

#### 1.5. 開始偵錯

![](https://i.imgur.com/jdMZ4zf.png)

##### 這時候就會看到vscode 已經開始偵錯

![](https://i.imgur.com/D58kz6E.png)

> Kubectl get all

![](https://i.imgur.com/cKCA9UV.png)

#### 1.6. 停止偵錯

> 停止 vscode 偵錯，Cloud Code 就會自動砍掉剛才建立的K8S服務

![](https://i.imgur.com/D58kz6E.png)

![](https://i.imgur.com/CFHaUpG.png)


### 2. Deploy (不推薦使用)

> Cloud Code: Deploy
 
#### 2.1 Cloud Code: Deploy

![](https://i.imgur.com/dPoiwFG.png)

#### 2.2 Continue with Deploy

![](https://i.imgur.com/NsNfvhk.png)

#### 2.3  選擇[default]

![](https://i.imgur.com/EnP3I2r.png)

#### 2.4 部署成功
![](https://i.imgur.com/EtDdUwU.png)

### 3. Delete

> Cloud Code: Delete

#### 3.1 Cloud Code: Delete

![](https://i.imgur.com/6VT3ymm.png)

#### 3.2 直接打要刪除的服務或者按下 Enter 用選的

![](https://i.imgur.com/3M97YkM.png)

#### 3.3 選擇要刪除的類型

![](https://i.imgur.com/AhClRDu.png)

#### 3.4 選擇名稱

![](https://i.imgur.com/cL45ImQ.png)

#### 3.5 再次確認

![](https://i.imgur.com/K4y5f6s.png)

#### 3.6 確認 Deployment 已經被刪除

![](https://i.imgur.com/GiYmSed.png)

### 4. 聚焦 Kubernetes Explorer 檢視

![](https://i.imgur.com/AtBamsJ.png)

#### 4.1 這邊可以直接看到 k8s 各種服務的運行狀況

![](https://i.imgur.com/zhyTzjH.png)

##### 4.1.1 更改 Replicas

![](https://i.imgur.com/UgBoINJ.png)

![](https://i.imgur.com/Vs05teP.png)

#### 4.2 檢視 yaml

> 右邊的小框框可以檢視服務相關資訊

![](https://i.imgur.com/7GdHWrX.png)

![](https://i.imgur.com/3Px3RPR.png)

#### 4.3 更改 yaml

> yaml檔也可以直接編輯

![](https://i.imgur.com/BNNQHmb.png)

![](https://i.imgur.com/PIoR9YS.png)

![](https://i.imgur.com/p10WfMv.png)

![](https://i.imgur.com/CZZv33L.png)

### 5. Describe

> Cloud Code: Describe
 
![](https://i.imgur.com/PUPiuCU.png)

![](https://i.imgur.com/Bu8z6va.png)

![](https://i.imgur.com/BEqFdvX.png)

![](https://i.imgur.com/QzIWjQD.png)


### 6. [Setting up debugging](https://cloud.google.com/code/docs/vscode/setting-up-an-existing-app?hl=zh-tw)

#### 6.1 新增設定

![](https://i.imgur.com/ra9Za5X.png)

#### 6.2 Cloud Code Debug: Attach (NodeJS)

![](https://i.imgur.com/Kyx2GjG.png)

#### 6.3 自動產生 Debug 檔案

![](https://i.imgur.com/wdjECiH.png)

#### 6.4 啟動應用程式
 
> Cloud Code: Run On Kubernetes

![](https://i.imgur.com/pBqUWHw.png)

#### 6.5 Attach App on Kubernetes Cluster: NodeJS

![](https://i.imgur.com/lAGCh89.png)

![](https://i.imgur.com/uEspWqV.png)

#### 6.6 這時候就可以針對程式進行偵錯

![](https://i.imgur.com/5iXJAlz.png)

> P.S 遠端偵錯不支援多個 pod

![](https://i.imgur.com/HBNX8o1.png)

### 7. Creat GKE cluster

#### 7.1. Select Project

![](https://i.imgur.com/fy9ahbS.png)

#### 7.2. Select Zone/Region

![](https://i.imgur.com/AUnXIX6.png)

#### 7.3. Select Configuration

![](https://i.imgur.com/Dy0qGWA.png)

![](https://i.imgur.com/IqOIXqO.png)

![](https://i.imgur.com/Q9hNHku.png)


# Referencce

* [對 Kubernetes 容器偵錯](https://cloud.google.com/code/docs/vscode/debug?hl=zh-tw)
* [Cloud Code for VS Code documentation](https://cloud.google.com/code/docs/vscode?hl=zh-tw)
* [GoogleContainerTools/skaffold](https://github.com/GoogleContainerTools/skaffold#installation)