【Node.js】TimeTree APIを使ってみる

# TimeTree APIを使ってみる
「[TimeTree Developer Platform](https://developers.timetreeapp.com/ja/docs/api)」の記載内容を参考に進めます。

## はじめに
* TimeTreeのアカウントを作成済みであることを前提とします。
* 検証の際に使用したOSはWindows 10です。
* Nodeはインストール済みです。

## パーソナルアクセストークンの発行

「[パーソナルアクセストークンの発行ページ](https://timetreeapp.com/personal_access_tokens)」にて、パーソナルアクセストークンを発行します。

1. ページを開き、「トークンの作成」ボタンをクリックします。
2. 「トークン名」に適切なトークン名を入力し、「TimeTree開発者ガイドラインに同意します。」にチェックを入れて「作成」ボタンをクリックします。
3. アクセストークンが発行されるので、内容をコピーし保存しておきます。

## アクセストークンを用いたCurlでの確認

取得したパーソナルアクセストークンを使用して、Curlにて動作確認を行います。
以下の内容のbatファイルを作成し、ダブルクリックして実行します。(`{accessToken}`は取得したアクセストークンで置き換えてください。)

```shell:GetUser.bat
@echo off

set accessToken="{accessToken}"
set responseFileName="GetUer-Response.json"

rem 日本語化
chcp 65001

curl -X GET^
    "https://timetreeapis.com/user"^
    -H "Accept: application/vnd.timetree.v1+json"^
    -H "Authorization: Bearer %accessToken%"^
    -o "%responseFileName%"

pause
```

成功すると以下の内容の`GetUser-Response.json`が作成されます。(`***`の箇所には適切なデータが入ってきます。)

```json:GetUser-Reseponse.json
{
    "data": {
        "id": "***",
        "type": "user",
        "attributes": {
            "name": "***",
            "description": "***",
            "image_url": null
        }
    }
}
```

アクセストークンが使用可能であることが確認できたので、以降、Node.jsによる実装を進めます。

## Node.jsによる実装
適当なフォルダを作成し、コマンドプロンプトで作成したフォルダに移動します。
以下のコマンドを実行し、初期化します。

```shell
npm init
```

いろいろと聞かれますが、`Enter`キーを連打します。

次に、同一フォルダにて`Express`、`ejs`、`config`、`request`をインストールします。

```shell
npm install express
npm install ejs
npm install config
npm install request
```

以下のような`package.json`が作成されます。(`scripts`の内容を手動で修正しています。)

```json:package.json
{
  "name": "{name}",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "node app.js"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "config": "^3.3.1",
    "ejs": "^3.1.2",
    "express": "^4.17.1",
    "request": "^2.88.2"
  }
}

```

以下の構成になるように、`app.js`ファイル、`timetreeModule.js`ファイル、`views`フォルダ、`index.ejs`ファイル、`config`フォルダ、`default.json`ファイルをそれぞれ作成します。

```
{作成したフォルダ}
┣ node_modules
┃  ┗ …
┣ config
┃  ┗ default.json
┣ views
┃  ┗ index.ejs
┣ app.js
┣ package-lock.json
┣ package.json
┗ timetreeModule.js
```

それぞれ以下のような内容とします。

```javascript:app.js
var express = require('express');
var app = express();
var timeTreeModule = require('./timetreeModule');

app.set("view engine", "ejs");

app.get('/', (req, res) => {
    timeTreeModule.getUser(function(result) {
        res.render("index",{
            data: JSON.parse(result).data
        });
    });
});

var port = process.env.PORT || 3000;

app.listen(port, () => {
    console.log('Start server port:3000');
})
```

```javascript:timetreeModule.js
var conf = require('config');
var request= require('request');

// ユーザの取得
exports.getUser = function(callback) {
    var headers = {
        'Accept': 'application/vnd.timetree.v1+json',
        'Authorization':'Bearer ' + conf.accessToken
    }
    var options = {
        url: 'https://timetreeapis.com/user',
        method: 'GET',
        headers: headers
    }
    request(options, function(error, response, body) {
        callback(body);
    })
}
```

```html:index.ejs
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Page Title</title>
</head>
<body>
    <h1>確認ページ</h1>
    <!-- コードから渡されたデータを表示-->
    <table>
        <tr>
            <th>名前</th><td><%=data.attributes.name %></td>
        </tr>
        <tr>
            <th>説明</th><td><%=data.attributes.description %></td>
        </tr>
    </table>
</body>
</html>
```

```json:default.json
{
    "accessToken": "{取得したアクセストークン}"
}
```

作成後、コマンドプロンプトにて以下のコマンドを実行し、起動します。

```shell
npm start
```

ブラウザで`http://localhost:3000`にアクセスします。ユーザ名と説明が表示されることを確認します。

## 最後に
説明不足箇所が多々あるため、時間があれば追記します。
また、今回はユーザ情報を取得するAPIを使用するにとどまったため、他のAPIを使用する例についても時間があれば追記します。