はじめに
以下の記事にて、Evidenceのインストール手順をまとめました。
次は、実際に手元のデータを使ってEvidenceを触ってみる場合に必要となる、データソースの追加について、その手順をまとめようと思います。
データソースの追加
具体的には、以下の２パターンについて、手順をまとめようと思います。
- ローカルに保存しているCSVファイル
- Snowflake（キーペア認証）
このご時世、データベースへの接続の際はセキュリティを考慮してユーザ/パスワードだけで接続することは少なくなり、２段階認証が当たり前になってきました。特に、Snowflakeではユーザ/パスワードによる接続の際、２段階認証が必須となりました。そのため、各種ツールからSnowflakeに接続する場合は、キーペア認証による接続が候補として挙がることも増えてきていると思います。よって、今回はキーペア認証を使用したSnowflakeへの接続方法もご紹介いたします。
共通手順
まず、以下コマンドにより、新規プロジェクトを作成し、ローカルサーバを立ち上げます。
npx degit evidence-dev/template <project_name>
cd <project_name>
npm install
npm run sources
npm run dev
ブラウザにて画面が表示されるので、その画面の右上の「･･･」クリックし、その中のメニューの「Settings」をクリックします。
次に、表示された設定画面にて、「＋ New Source」をクリックします。
すると、以下のような表示に切り替わります。
ここから先は、接続するデータソースにより、手順が変わります。
ローカルCSV
お好きなCSVファイルをご利用いただいて問題ございません。使えそうなデータが手元に無い方用に、サンプルデータを記載しておきます。
使用するサンプルデータ
これを、「List.csv」という名前で保存したものを使用します。
先ほどの共通手順最後の画面にて、以下のように入力します。
| 項目名 | 内容 |
|---|---|
| Source Type | プルダウンにて「csv」を選択 |
| Directory Name | 対象のデータソースを格納するフォルダの任意の名前を入力 |
この状態で「Next →」をクリックします。
すると、オプション指定の画面が表示されますが、今回は何も指定しなくても問題ありません。仮に、以下のようなオプションを指定したい場合は、Options欄に入力してください。
header=false # 1行目から読み込む
delim="|" # 区切り文字を指定する
header=false,delim="|" # 上記２つの両方を指定
この状態で「Test Configuration」をクリックし、「Save」をクリックすると、以下のような画面が表示されます。
この状態で、作成したプロジェクトの「source」フォルダを見てみると、先ほど入力したとおりのフォルダが作成されています。
このフォルダの中に、用意しておいたCSVファイルをコピーします。
この状態で、以下のクエリとタグを「index.md」の任意の場所に追記してみます。
どうせならEvidenceで表現できることを試すことを兼ねて、少し工夫しています。
```sql game_list
select
Rank as rank,
Name as name,
"Thumbnail URL" as thumbnail_url,
"Store Link" as store_link,
Price as price,
cast(replace("Current Players", ',', '') as int) as current_players,
cast(replace("Peak Today", ',', '') as int) as peak_today,
"Genre Tags" as genre_tags
from steam_top100_games.List
```
<DataTable data={game_list}
headerColor=#242d3d
headerFontColor=#ffffff
backgroundColor=#4581a5
search=true
rows=all
rowShading=false
sort="current_players desc"
> <Column id=Name />
<Column id=Rank />
<Column id=current_players title="Current Players" contentType=bar barColor=#5c7e10 />
<Column id=peak_today title="Peak Today" contentType=bar barColor=#5c7e10 />
</DataTable>
追加イメージは、こんな感じです。
---
title: Welcome to Evidence
---
<Details title='How to edit this page'>
This page can be found in your project at `/pages/index.md`. Make a change to the markdown file and save it to see the change take effect in your browser.
</Details>
+ ```sql game_list
+ select
+ Rank as rank,
+ Name as name,
+ "Thumbnail URL" as thumbnail_url,
+ "Store Link" as store_link,
+ Price as price,
+ cast(replace("Current Players", ',', '') as int) as current_players,
+ cast(replace("Peak Today", ',', '') as int) as peak_today,
+ "Genre Tags" as genre_tags
+ from steam_top100_games.List
+ ```
+ <DataTable data={game_list}
+ headerColor=#242d3d
+ headerFontColor=#ffffff
+ backgroundColor=#4581a5
+ search=true
+ rows=all
+ rowShading=false
+ sort="current_players desc"
+ >
+ <Column id=name />
+ <Column id=rank />
+ <Column id=current_players title="Current Players" contentType=bar barColor=#5c7e10 />
+ <Column id=peak_today title="Peak Today" contentType=bar barColor=#5c7e10 />
+ </DataTable>
```sql categories
select
category
from needful_things.orders
group by category
```
以下続く･･･
この状態でindex.mdを保存し、画面左上の「← Home」をクリックしてホーム画面に戻ってみると、画面が更新されています。
これで、ローカルCSVファイルへの接続が成功したことを確認できました。
Snowflake（キーペア認証）
次は、キーペア認証によるSnowflakeへの接続についてです。
これを実施するにあたり、事前にSnowflakeにてキーペア認証を使用したユーザを作成しておく必要があります。
キーペア認証を使用したユーザの作成方法については、以下のSnowflakeのドキュメントを参考に作成してみてください。
ちなみに、個人的には以下のページのほうが分かりやすかったです。
Snowflakeにてキーペア認証を使用したユーザを作成した状態で、先ほどの共通手順最後の画面にて、以下のように入力します。
| 項目名 | 内容 |
|---|---|
| Source Type | プルダウンにて「snowflake」を選択 |
| Directory Name | 対象のデータソースを格納するフォルダの任意の名前を入力 |
この状態で「Next →」をクリックします。
すると、Snowflakeへの接続情報を入力する画面が表示されます。
ここで、それぞれ以下のとおりに入力します。
| 項目名 | 内容 |
|---|---|
| Account | <アカウントロケーター>.<リージョン>.<クラウド>（例：AWS東京リージョンの場合：****.ap-northeast-1.aws） |
| Username | Snowflakeログインユーザ名 |
| Database | 接続先データベース名 |
| Warehouse | 使用するウェアハウス名 |
| Role | 使用するロール名 |
| Schema | 接続先スキーマ名 |
| Auth Method | JWT（これを指定すると、以下２つの欄が追加表示される） |
| Private Key | 秘密鍵の中身（BEGIN～ENDも含める） |
| Passphras | 秘密鍵のパスフレーズ |
| Number of Prefetched Batches | 2（デフォルト） |
この状態で「Test Configuration」をクリックし、左下に「Connected」と表示されれば、接続成功です。その状態で「Save」をクリックすると、以下のような画面が表示されます。
この状態で、作成したプロジェクトの「source」フォルダを見てみると、先ほど指定した名前の新しいフォルダ（私は「snowflake_keypair」を指定していたので、「snowflake_keypair」フォルダ）が作成されているかと思います。
その後、新しく作成されたフォルダの中に、sqlファイルを作成し、以下のようにクエリを記載します。
select * -- 項目を指定してもよい
from <スキーマ名>.<テーブル名>
以下のクエリを「index.md」の任意の場所に追記してみます。
```sql <任意の名前>
select *
from snowflake_keypair.<sqlファイル名（拡張子無し）>
```
追加イメージは、こんな感じです
---
title: Welcome to Evidence
---
<Details title='How to edit this page'>
This page can be found in your project at `/pages/index.md`. Make a change to the markdown file and save it to see the change take effect in your browser.
</Details>
+ ```sql <任意の名前>
+ select *
+ from snowflake_keypair.<sqlファイル名（拡張子無し）>
+ ```
```sql categories
select
category
from needful_things.orders
group by category
```
･･･以下続く
この状態でindex.mdを保存し、画面左上の「← Home」をクリックしてホーム画面に戻ってみると、画面が更新されています。
これで、Snowflakeへの接続が成功したことを確認できました。
おわりに
Evidenceを触ってみるにあたり、手元のデータソースを使用してみる際の手順をまとめました。
今回の記事が、Evidenceを触ってみる方の助けに、少しでもなれば幸いです。
Discussion