###### tags: `Training`

# 安裝開發環境

## VSCode install
安裝VSCodeUserSetup-x64-1.38.1.exe
*Lina提供，*存在個人資料夾，E:\CloudPlatform-Web

## install nvm
至https://github.com/coreybutler/nvm-windows/releases/tag/1.1.7
1. 下載nvm-setup.zip
*nvm安裝路徑預設值 C:\Users\Sean\AppData\Roaming\nvm
*system path 預設值 C:\Program Files\nodejs
*存在個人資料夾，E:\CloudPlatform-Web

2. 開啟terminal，查詢nvm list available

3. 安裝12.13.1版
nvm install 12.13.1

4. 使用12.13.1版
nvm use 12.13.1

5. 下載node version
https://nodejs.org/en/blog/release/v12.13.1/

6. 檢查node version
node -v

ref
https://hsiangfeng.github.io/nodejs/20200107/3738078915/

https://drive.google.com/drive/folders/1VRjn14DTovhIyEcaaCMkxkBnf5cRto62

## install redis
1. 先安裝redisinsight-win-1.7.1.msi
*redisinsight安裝路徑預設值 C:\Program Files (x86)\RedisInsight\

2. 再安裝Redis-x64-3.2.100.msi
*redis安裝路徑預設值 C:\Program Files\Redis\
*redis預設值 port : 6379

*存在個人資料夾，E:\CloudPlatform-Web

## install mongodb
1. 先安裝mongodb-compass-1.22.1-win32-x64.msi
*mongodb-compass安裝路徑預設值 C:\Program Files\MongoDB Compass\

2. 再安裝mongodb-win32-x86_64-2012plus-4.2.1-signed.msi
*mongodb data路徑預設值 C:\Program Files\MongoDB\Server\4.2\data\
*mongodb log路徑預設值 C:\Program Files\MongoDB\Server\4.2\log\
*mongodb預設值 port : 27017

*存在個人資料夾，E:\CloudPlatform-Web

## install mysql
1. 查詢3306 port是否被占用
`netstat -aon|findstr "3306"`

2. 停用MySQL服務
`net stop mysql`

3. 切換至MySQL安裝路徑
`cd C:\Program Files\MySQL\MySQL Server 5.6\bin`

4. 使用MySQL安全模式
`mysqld --skip-grant-tables`
5. 另開terminal，並切換目錄於C:\Program Files\MySQL\MySQL Server 5.6\bin路徑下執行mysql

mysql>use mysql;
mysql>update user set password = PASSWORD('123456') where user = 'root';
mysql>flush privileges;
mysql>quit;

ref:
https://fion0708.pixnet.net/blog/post/34300729

## install TortoiseGit
略

## download
下載jade-node-framework
下載jade-portal-framework
下載jade-node-order
下載jade-portal-order
* 存放路徑E:\CloudPlatform-Web\Sample\Order>

# 開起VSCode
1. 開起資料夾路徑 Folder E:\CloudPlatform-Web\Sample\Order
2. 打開Terminal

## npm install
1. 於terminal切換至jade-node-framework資料夾
`cd .\jade-node-framework\`
2. 執行npm install安裝，會參考package.json
`npm install`

3. 重複把jade-node-framework、jade-portal-framework、jade-node-order、jade-portal-order四個project 都安裝過

## 打包前端React Code
1. 切換至react project，如jade-portal-framework，執行npm run build
`npm run build`

2. build成功後，產生出build資料夾於E:\CloudPlatform-Web\Sample\Order\jade-portal-framework\build

# 複製react build出來的build資料夾至node project
3. 複製build資料夾至jade-node-framework的server資料夾內

# 至jade-node-framework的server/config/config.ts修改設定

import express from 'express';
import os from 'os';

const app: express.Application = express();
// 取得開發環境變數
const development = app.get('env') !== 'production';
// 取得 server IP
const getIPAddress = (): string => {
  let address = '';
  const interfaces = os.networkInterfaces();
  Object.keys(interfaces).find((devName, index, array) => {
    const iface = interfaces[devName];
    iface.find((itemIface, indexIface, arrayIface) => {
      const alias = iface[indexIface];
      if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) {
        address = alias.address;
      }
      return address !== '';
    });
    return address !== '';
  });
  return address;
};
 //const serverIP = getIPAddress();
const serverIP = 'localhost';

let mongoDB = '';
let redis = '';
if (development) {
  mongoDB = 'mongodb://127.0.0.1/fixo';
  redis = '127.0.0.1';
} else {
  mongoDB = 'mongodb://mongo/fixo';
  redis = 'redis';
}

let casServer = (process.env.CAS_SERVER === 'hpc') ?
'https://account.dct-cloud.com/sso' :
'http://10.62.164.137:443/portal';
// 'http://sso.fii-hpc.com:443/portal' ;

export default class Config {
  development: boolean;
  project: string;
  region: string;
  rootUrl: string;
  publicUrl: string;
  domain: string;
  adminAPIUrl: string;
  fixoAPIUrl: string;
  serverProtocol: string;
  serverIP: string;
  serverPort: string;
  webSocketPort: string;
  originIPList: any;
  casServer: string;
  mongoDB: string;
  redis: string;
  mariaDBOrder: string;
  jwtSecret: string;
  jwtExpire: number;
  sessionName: string;
  cookieSecret: string;
  cookieMaxAge: number;
  rateLimitRedisExpiry: number;
  rateLimitWindowMs: number;
  rateLimitMax: number;
  rateLimitDelayMs: number;
  rabbitMQHost: string;
  rabbitMQPort: string;
  rabbitMQUsername: string;
  rabbitMQPassword: string;
  rabbitMQAuthMechanism: string;
  rabbitMQPathname: string;
  rabbitMQReceiveQueue: string;
  rabbitMQSendQueue: string;

  constructor() {
    this.development = development;
    this.project = 'portal';
    this.region = 'LH-Q';
    this.rootUrl = 'http://localhost:8090';
    this.publicUrl = 'order/';
    this.domain = process.env.SESSION_DOMAIN || '';
    this.adminAPIUrl = 'http://10.62.164.137:443';
    this.fixoAPIUrl = 'http://10.62.164.137:1443';
    this.serverProtocol = 'http';
    this.serverIP = serverIP;
    this.serverPort = '8090';
    this.webSocketPort = '3010';
    this.originIPList = ['http://10.134.202.131:443'];
    //this.casServer = 'http://mtjade.fii-usa.com:443';
    this.casServer = casServer;
    this.mongoDB = mongoDB;
    this.redis = redis;
    //this.mariaDBOrder = 'mariadb://root:123456@localhost:3307/order';
    this.mariaDBOrder = 'mariadb://root:foxconn@localhost:3306/order';
    this.jwtSecret = '`FWm6@gNxj!px}(mj`T"g{BMZ9>x<qdd&M;]n9.:>XbS_)YZPjzQ,nc/^x/!"_QC5J_a!Vt{g=;T9!pQbqSU#V2EF3HwN&qL_2hcB@BC[B-*&$)Z.(XLm[Fd"H&!NdQM';
    this.jwtExpire = 12 * 60 * 60; // second, 12 小時過期
    this.sessionName = 'fixo.sessionId'; //不同案子放不同解決IP相同時的衝突問題
    this.cookieSecret = '`FWm6@gNxj!px}(mj`T"g{BMZ9>x<qdd&M;]n9.:>XbS_)YZPjzQ,nc/^x/!"_QC5J_a!Vt{g=;T9!pQbqSU#V2EF3HwN&qL_2hcB@BC[B-*&$)Z.(XLm[Fd"H&!NdQM';
    this.cookieMaxAge = 12 * 60 * 60 * 1000; // milliSecond, 12 * 60 * 60 * 1000, 12 小時過期, null, 無限制
    this.rateLimitRedisExpiry = 60 * 60; // second, 1 小時內
    this.rateLimitWindowMs = 60 * 60 * 1000; // milliSecond, 1 小時內
    this.rateLimitMax = 3600; // 3600 次, 1 秒 1 次
    this.rateLimitDelayMs = 0; // disabled 延遲響應
    this.rabbitMQHost = 'localhost';
    this.rabbitMQPort = '5672';
    this.rabbitMQUsername = 'guest';
    this.rabbitMQPassword = '1QAZ2wsx';
    this.rabbitMQAuthMechanism = 'AMQPLAIN';
    this.rabbitMQPathname = '/';
    this.rabbitMQReceiveQueue = 'fixoweb';
    this.rabbitMQSendQueue = 'fixoweb';
  }
}

line37 let casServer = 'sso.dcascloud.com'; // 設定SSO Server
this.adminAPIUrl = 'http://10.134.202.68:443'; // 設定Entry API Url
this.fixoAPIUrl = 'http://10.134.202.201:443'; // 設定Region API Url
this.mariaDBOrder = 'mariadb://root:123456@localhost:3306/order'; // 設定Local mariaDB

# 我的問題
| 變數 | 用途 | 建議 |
| -------- | -------- | -------- |
| development| 佈署時，可以加入判別| isDevelop|
| project | server.ts API導流用，ex. node order判斷上面是接react portal order or react mgmt order | |
| rootUrl | 待補充 | -------- |
| publicUrl | uri前綴，ex 主應用=portal, mgmt; 子應用=portal/order, mgmt/order | -------- |
| domain | 待補充 | -------- |
| adminAPIUrl | 待補充 | entryAPIUrl |
| fixoAPIUrl | 待補充 | regionAPIUrl |
| serverProtocol | 待補充 | -------- |
| serverIP | 待補充 | -------- |
| serverPort | 待補充 | -------- |
| webSocketPort | 待補充 | -------- |
| originIPList | 跨域Access-Control-Allow-Origin | -------- |

## copyStaticAssets.ts
使用shell cmd執行
複製資料夾('server/build', 'ecosystem.config.js', 'package.json', 'package-lock.json')到'jade-web'資料夾

import * as shell from 'shelljs';

shell.cp('-R', 'server/build', 'jade-web/');
shell.cp('-R', 'ecosystem.config.js', 'jade-web/');
shell.cp('-R', 'package.json', 'jade-web/');
shell.cp('-R', 'package-lock.json', 'jade-web/');

# 至jade-portal-framework的server/server/build/portal/order/config.js修改設定

window.__env = {
    'REACT_APP_COOKIE_DOMAIN': 'fii-hpc.com',                 // 與FiXo Cookie溝通domain
    'REACT_APP_MAIN_URL': 'http://localhost:3001',            // 本地開發React時使用，目前佈署及打包未使用
    'REACT_APP_API_URL': 'http://localhost:3000',        // 設定Nodejs backend URL
    'REACT_APP_FIXO_WEB_URL': 'http://10.62.164.137:8080', // 設定dcasweb的URL，VPC創Network時使用
    'REACT_APP_FIBO_URL': 'http://fibo.dct-cloud.com:7480/swift/v1/cece8dcd33544c20aa5bbfca84412a85-order-system', // 讀取fibo資料用，目前暫時先不使用
    // Entry Registry
    'REACT_APP_ENTRY_ORDER': 'http://localhost:8091/portal/order', // portal framework下的子應用,portal代表主應用，order代表子應用
    'REACT_APP_ENTRY_METER': 'http://localhost:9002'  // portal framework下的子應用
}

# 至jade-node-order的server/config/config.ts修改設定

# 至jade-portal-order的server/server/build/portal/order/config.js修改設定