GCP與Node.js環境建置與部屬 & 建置MongoDB
===
##### 採用"VSCode"作為文字編輯及專案管理工具
## GCP虛擬機建立
1. 建立google 帳號
2. 進入google cloud platform
3. 建立新專案，為此次專案部署伺服器(也可以多個專案共同使用同一台虛擬機)
4. 開啟"Compute Engine"
5. 選取"VM執行個體"，以建立虛擬機
6. 建立
7. 設定虛擬機資訊(包含名稱、架設區域、開機磁碟(作業系統)、記憶體大小、CPU個數)，依據申請的虛擬機設備有不同的計價方式
8. 設定完成後，若有固定ip的需求，可以到"VPC網路"，"外部IP位址"將此虛擬機的類型設定為"靜態"
9. 此時，這台虛擬機在網路上就有固定的ip可以連上他
*==ip表示這台電腦在網路上的絕對位置，不會有人跟他重複==*
## 本機建置Node.js環境
1. 下載Node.js (https://nodejs.org/en/)
2. 安裝
3. 選擇並建置本次專案資料夾
4. 於專案資料夾中執行terminal指令"$npm init -y"，(初始化node.js的套件管理工具，並對後續要求皆選擇yes)
5. 專案資料夾中會創建package.json
6. 安裝"express套件"框架
7. "$npm i express -S"，(安裝express套件，並將之寫入package.json中)(-S : -save)
8. 於"package.json"中可以看到"dependencies"中有"express"與其版號，其主要的用意是大家都是相同的套件，在上傳專案的同時可以將套件排除，當專案有需要用到此套件時，再依據此套件與版號，於網路上下載即可
9. 於專案資料夾中建立"index.js"檔案，內容如下

// 比較像是java中把express import進來的意思
const express = require('express');

const app = express();
// 在本機端開啟一個連接阜(port)，可以供外部連結本機
app.listen(3000, () => {
    console.log('listening on' + 3000);
});

10. "$node index.js"，以nodejs執行index.js這個檔案
11. 於自己的網址輸入本機網址"127.0.0.1:3000"，確認是否有連上
12. 本機後端部署完成
## 將本機ssh金鑰與GCP環境連結
1. 於terminal中輸入"$ssh-keygen -C *你的使用者名稱*"
2. 執行完成後，於本機中會有"Users/*電腦使用者名稱*/.ssh/id_rsa"(windows須自己創建)(macOS會自動新建)
3. 回到GCP中
4. 選擇"Compute Engine"中的"中繼資料"
5. 選擇"SSH金鑰"
6. 編輯並新增項目
7. 將本機中"id_rsa.pub"以文字編輯器開啟，其中的資料完整複製至此並儲存
8. 回到本機專案資料夾中
9. 於terminal輸入指令"$ssh *你的使用者名稱*@*你的虛擬機ip* -p 22 -i \"*你的金鑰於本機的儲存位置*\""

可能會長得如下
ssh {{你的使用者名稱}}@{{你的ip}} -p 22 -i \"/Users/{{你的使用者名稱}}/.ssh/id_rsa\"
===============================================
-p 22 : 表示ssh通訊協定所使用的連接阜(port)
-i 金鑰位置 : 要連上虛擬機，需確認登入的人員是誰

(補充)
若是覺得每次都需要打這些指令太麻煩，也能夠於"package.json"中"scripts"的位置，打上自己的腳本，快速呼叫指令("$npm run *你的腳本名稱*")

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    // 連上server
    "ssh": "ssh {{你的使用者名稱}}@{{你的ip}} -p 22 -i \"/Users/kj/.ssh/id_rsa\"",
    // 開啟要執行的檔案
    "start": "node index.js"
  },

10. 於vscode中點擊F1快捷鍵，選擇"SFTP : config" 選擇本次專案資料夾，於專案資料夾中會建立".vscode/sftp.json"

{
    "name": "My Server",
    // 你的虛擬機ip
    "host": "{{你的ip}}",
    "protocol": "sftp",
    "port": 22,
    // 你的使用者名稱
    "username": "{{你的使用者名稱}}",
    // 私鑰的路徑
    "privateKeyPath": "~/.ssh/id_rsa",
    // 遠端的資料夾路徑
    "remotePath": "/home/{{你的使用者名稱}}/server",
    // 排除不上傳的檔案
    "ignore":[
        "**/node_modules",
        "**/.vscode"
    ]
}

11. 將本機檔案上傳至虛擬機(sync local -> remote)(藉由sftp傳輸協定)
11. 於terminal輸入指令"$npm run ssh"，連上server
## 伺服器端建置Node.js環境
:::info
若是已經於本機端建置好專案，並已將專案推送至安裝好環境的伺服器
可以直接於專案資料夾中執行指令"$npm i"
將專案所需套件下載至專案資料夾中
:::
1. 接續上一個part連接上server
2. 於server的terminal上執行指令
3. "$curl -sL https://deb.nodesource.com/setup_11.x | sudo -E bash -"
4. "$sudo apt-get install -y nodejs"
5. 將本機端檔案推送至伺服器(Sync local to remote)
6. 同樣於伺服器端的terminal輸入指令"$sudo apt-get install lsof"
:::info
// 查看目前對外監聽TCP的服務
sudo lsof -i | grep TCP
// 查看指定port目前之監聽狀況
sudo lsof -i -P -n | grep :3000
:::
==設定伺服器對外的連接口==
7. 因為此次專案是用port 3000，所以必須在server端的port 3000開啟一個可以供外部連線的接口，想要使用此專案服務的使用者才能夠連上
8. 回到GCP，"VPC網路"中"防火牆規則"
9. "建立防火牆規則"，填入"名稱"、"目標代碼"、"來源ip範圍(0.0.0.0/0)"、"指定的通訊協定和通訊埠(打勾tcp填入3000)"
10. 再來回到"VM執行個體"後編輯，網路標記的部分加入剛剛設定好的"目標代碼"接著儲存。(此步驟將虛擬機的外部連接規則加入我們剛剛設定好的防火牆規則，讓他的port 3000可以供外部連線)
12. 接著回到伺服器中的專案資料夾
13. 伺服器中的terminal執行"node index.js"
14. 接著就可以於自己的網址欄中輸入虛擬的的ip，再連上port 3000，只要不是無法連上，即表示部署成功
## 伺服器端永遠執行程式
(待補)
## 拆分專案架構
主要拆分為routes、controllers、models、config
* routes：管理所有路由路徑(根路由/路由/路由/路由...)，依據url會導向不同的位置，執行不同的api。
* controllers：管理所有連接到此網址所要做的事，針對不同路由下，每個request會有什麼樣的response
* models：用於管理資料的型態以及身上的方法(其中屬性都為基本型態{String、Number、Boolean...})
* config：管理此專案基本配置的資訊

/* 專案的index.js */
// 表示此專案的根路由是從"/api"開始
app.use('/api', router);

/* routes/index.js */
// 此路由會階層式進入"/api/test"
router.use('/test', testRoute);

/* routes/testRoute.js */
// 經由上兩個步驟會藉由testRoute進入到"/api/test/a"
// 執行 testController身上的"a"方法
// 使用者必須採用 get 的方法向目標網址發出request
router.get('/a', testController.a);

/* controllers/testController.js */
// 根據送來的request以及身上的參數，判斷是否有符合規範
// 若有，給予相對應的response，使用者也能夠得到正確的回應
// 若無，使用者無法得到想要的回應，但同樣要給予response，否則連線無法結束，直到time-out斷線
const a = (req, res, next) =>{
    if(req.body.id != "kj"){
        res.json({status: 1, msg: 'error id'});
    }else{
        res.json({status: 1, msg: 'hello ' + req.body.id});
    }
};

## MongoDB
1. 申請"mongoDB.Atlas"帳號
2. 選擇一個架設虛擬機的公司(aws、gcp、azure)以及虛擬機所在位置
3. 選擇免費方案後創建資料庫
4. 左方菜單選擇"Database Access"，創建管理者，並給予管理權限(admin/admin)(read/write)，可讀寫所有資料庫
5. 左方菜單選擇"Network Access"，設定ip白名單，表示只有符合此名單的ip可以連上此資料庫(在此對所有ip開放{設定"0.0.0.0/0"})
6. 設定完成回到左方菜單"Cluster"，進入後選擇"CONNECT"，"Connect Your Application"，Driver："Node.js"、Version："3.0 or later"，並將下方"Connection String only"中的文字中複製起來
7. 回到專案中的設定檔"config/index.js"中，將之加入

const config = {
    port: 3000,
    mongodb: 'mongodb+srv://admin:{{你的密碼}}@cluster0-XXXX.gcp.mongodb.net/test?retryWrites=true&w=majority'
}

==此次專案採用第三方套件"mongoose"來連結資料庫==
8. 至專案資料夾中的terminal中輸入指令"$npm i -S mongoose"，加入此次專案資料夾中，並將使用到的此套件紀錄於package.json中

## Vue環境建置(本機端)
1. terminal輸入指令"$npm i -g @vue/cli"
2. 進入專案資料夾中，輸入指令"$vue create *想要的資料夾名稱*"
3. 會在專案資料夾中創建出"想要的資料夾"
4. 進入"想要的資料夾"中(同樣有package.json有預先寫好的scripts以及dependencies)
5. 輸入指令"$npm run serve"，會於本機端port:8080開啟網頁
6. 輸入指令"$npm run build"，會於"dist"資料夾中創建出"index.js"，表示此為網頁的入口

## Vue環境建置(伺服器端 ubuntu)
1. 連上伺服器
2. 先更新apt抓取套件的工具，"$sudo apt update"
3. 抓取"nginx"，terminal輸入指令"$sudo apt-get install nginx"
4. 到伺服器根目錄下(/etc/)
###### tags: `js` `server` `gcp` `mongodb`