# CDS Hooks

## 前言

相關資源:
* CDS Hooks官方網站：[cds-hooks.org](https://cds-hooks.org/)
* CDS Hooks Sandbox: https://sandbox.cds-hooks.org/
* 好文: CDS Hooks 系列篇: https://emrtech.blogspot.com/p/cds-hooks.html
* Open Source Github: https://github.com/cds-hooks
* Cheat Sheet: https://cds-hooks.org/cheat-sheet/Cheat%20Sheet%20-%20Sept%202019.pdf

## CDS sandbox

線上版可使用[CDS Hooks Sandbox](https://sandbox.cds-hooks.org/)，若要Local Development可見 [sandbox](https://github.com/cds-hooks/sandbox)

### Installation

#### Step 1: Prerequisite

install the LTS version of Node.js: https://nodejs.org/en/download/

⚠️ 特別要注意node-sass版本和node版本，否則會噴錯:

`gyp verb which failed Error: not found: python2 錯誤`

** 參考: https://hackmd.io/@mko123654/S1io-20K9

#### Step 2: Install

接著只要按照readme上的步驟執行即可:

git clone https://github.com/cds-hooks/sandbox.git
cd sandbox
npm install

#### Step 3: Run

執行:

npm run dev

> cds-hooks-sandbox@0.1.0 dev C:\Users\polly.peng\sandbox-master
> webpack-dev-server --config webpack.config.dev.js --inline

[terra-aggregate-translations] Aggregating translations for en,en-US locales.
i ｢wds｣: Project is running at http://localhost:8081/
i ｢wds｣: webpack output is served from /
i ｢wds｣: Content not from webpack is served from ./build
[BABEL] Note: The code generator has deoptimised the styling of C:\...\medication-list.js as it exceeds the max of 500KB.
i ｢wdm｣: Hash: ...
Version: webpack 4.39.3
Time: 16068ms

執行 [http://localhost:8081/](http://localhost:8081/) 即可跑出結果:

### Add CDS Services

特別注意CDS Server要啟用CORS
參考: https://groups.google.com/g/cds-hooks/c/UAOc7gzZflQ

app.use((request, response, next) => {
  response.setHeader('Access-Control-Allow-Origin', '*');
  response.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');
  response.setHeader('Access-Control-Allow-Credentials', 'true');
  response.setHeader('Access-Control-Allow-Headers', 'Content-Type, Authorization');
  response.setHeader('Access-Control-Expose-Headers', 'Origin, Accept, Content-Location, ' +
    'Location, X-Requested-With');

  // Pass to next layer of middleware
  next();
});