kintoneの新しいJS-SDK「kintone-rest-api-client」を使ってみた

# はじめに

去年から地味に告知は出ていたのですが、kintoneの新しいJS-SDKがver.1.0.0としてついに正式リリースされました👏👏👏

> @kintone/rest-api-client Ver.1.0.0
> <https://github.com/kintone/js-sdk/tree/master/packages/rest-api-client>

これからはこのSDKがJS-SDKでは主となるので、ぜひぜひ触ってみて下さい〜

ということで、
僕も触ってみたのでそのメモを書きます。いくつか注意点もあったのでそれも付け合わせとして添えます。

※ まぁ実は去年からver.0系としては公開はされていました

# ツールの入れ方

今までのSDKと同様に `npm` で入れます。リポジトリが別なので既存のJS-SDKのアップデートでは入らないのでそこは注意してください。

```bash
npm install @kintone/rest-api-client
```

まぁここは何の問題もないですね!

# コード書く前に

ちゃんとURLとか認証キーは `.envファイル` に書くようにしましょう。
※ 自分もよくコードに直書きしてしまうので、なるべく環境変数にするよう癖をつけないとです

```bash
# dotenvモジュールのインストール
npm install dotenv
```

```plaintext:.env
# kintone settings
KINTONE_URL=https://<subdomain>.cybozu.com
KINTONE_APITOKEN=XXXXXXXXXXXXXXXXXXXXXXXXXX
```

## 余談) dotenvのメモ

ちょっと調べてみると、コード内に `require('dotenv').config();` と書くパターンと、実行時に引数に `--require dotenv/config` をつけるパターンの2種類あるらしい。

PC自体の環境変数とかAWS Lambdaの環境変数を使う場合は `require('dotenv').config();` は必要ないので、そこを踏まえるとコード内に書くより **引数につける** ほうが良いらしい。なるほど。

ただ、実行時に引数つけるの忘れそうだな〜

# インポート・コネクションの貼り方

今までと変わっています。とても楽になりました。

```js
const { KintoneRestAPIClient } = require('@kintone/rest-api-client');

const env = process.env;
const client = new KintoneRestAPIClient({
  baseUrl: env.KINTONE_URL,
  auth: {
    apiToken: env.KINTONE_APITOKEN
  }
});
```

シングルオブジェクトで **URL、認証（ログイン、APIトークン、Basic）** 全部指定します

## 💡ポイント

新しいSDKは `TypeScript` で書かれているので、関数のパラメータなど何を書けばいいか説明が出ます。これがかなり便利！！

![スクリーンショット 2020-02-19 12.50.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/153051/96e7fa88-ad35-4754-7370-c566f192e0e5.png)

補完されるからわざわざドキュメント読んで書き方調べる必要もなし！
![スクリーンショット 2020-02-19 12.50.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/153051/c5a9240c-32b7-6c7e-a2d5-0987a8a0ff90.png)

## ⚠ 注意点

わかる人はわかると思いますが、最初のインポート時の変数を `KintoneRestAPIClient` から他の変数名にただ変えるだけだと、候補がうまく出てこないです。
![スクリーンショット 2020-02-19 12.54.29.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/153051/341737c5-a849-e8ac-2277-ded4b4083cc0.png)
候補が出ないってことは **どこか間違ってる** ってことです!!この候補アナウンスはミスの判断にも使える！
※ JavaScript の[**分割代入**](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment) ってやつが関係しています。

基本は `KintoneRestAPIClient` と書けば良い気がしますが、どうしても他の変数名を使いたい場合は下記のようにすれば良いです。

```js
const hoge = require('@kintone/rest-api-client').KintoneRestAPIClient;
const client = new hoge(...);
```

![スクリーンショット 2020-02-19 13.41.32.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/153051/2e2879cb-fc90-6609-3244-a34d4fa21cb6.png)

# レコード登録

補完に身を任せて書けばOK！

```js
const { KintoneRestAPIClient } = require('@kintone/rest-api-client');

const env = process.env;
const client = new KintoneRestAPIClient({
  baseUrl: env.KINTONE_URL,
  auth: {
    apiToken: env.KINTONE_APITOKEN
  }
});

client.record.addRecord({
  app: XXXX,
  record: {
    text: {
      value: 'SDK使いやすーい！'
    }
  }
}).then(resp => console.log(resp)).catch(err => console.log(err));
```

# ファイルアップロード

kintone APIのファイルアップロードの流れと同じく、

1. kintone自体にファイルをアップロードして `fileKey` を取得
2. `fileKey` をレコードに保存

と2回処理を書きます。

## ⚠ 注意点

現状のSDKでは **ファイルパス指定** には対応していないので、ローカルにあるファイルは **[fsモジュール](https://nodejs.org/api/fs.html)** などを使ってBufferに変換してからアップロードする必要があります。まぁそこまで手間ではないですけど。

```js
const fs = require('fs'); // ファイル操作用のモジュールをインポート
// 他は上で書いてるし割愛

client.file.uploadFile({
  file: {
    name: 'hoge.png',
    data: fs.readFileSync('<YOUR_FILE_PATH>')
  }
}).then(resp => {
  return client.record.addRecord({
    app: XXXX,
    record: {
      file: {
        value: [{
          fileKey: resp.fileKey
        }]
      }
    }
  });
}).then(resp => console.log(resp)).catch(err => console.log(err));
```

# ファイルダウンロード

アップロードと逆の手順でやればOKです。

```js
// この部分は割愛

client.record.getRecord({
  app: XXXX,
  id: XXXX
}).then(resp => {
  return client.file.downloadFile({
    fileKey: resp.record.file.value[0].fileKey
  });
}).then(res => {
  fs.writeFileSync('hoge.png', res);
}).catch(err => console.log(err));
```

# おわりに

いやー、補完があるとめっちゃ便利ですね〜👏
なんとなく 「次来るのは`app`か？`record`か？」と予想もできるので、ドキュメント読まずにさくさくコーディングができます！

それでは！ ≧(+･` ཀ･´)≦