本記事では、Evidenceを使ってスプレッドシートをバックエンドにしたデータアプリの構築手順をご紹介します。Evidenceがどのようなケースに相性が良いのかという点についても掘り下げてご紹介します。
前回の記事では、スプレッドシートをバックエンドにしたデータアプリを構築する複数の方法をご紹介しました。今回は、そのときに紹介したコードベースのフレームワークの1つ、Evidenceを取り上げて、詳細な紹介や構築手順の説明をしたいと思います。
前回の記事はこちらです。
Evidenceとは
Evidenceは主にSvelteKitというJSフレームワークで実装されているオープンソースのフレームワークです。利用にはNode.jsの環境が必要になります。
Evidenceフレームワークの特徴は、SQLとMarkdown記法でダッシュボードのようなデータアプリの構築ができることです。従来のBIツールのような複雑なGUI操作は不要で、コードベースでインタラクティブなダッシュボードを作成および管理をすることができます。
具体的な構築手順
Google Cloud / Google Sheet側の設定
1. Google Sheet APIを有効にする
Google Developers Consoleにログインし、新規プロジェクトを作成、Google Sheets APIを有効化してください。
2. サービスアカウントを発行し、JSONをダウンロード
API とサービス > 認証情報 のページから、新規のサービスアカウントを発行します。サービスアカウントの「キー」タブから新規のキーを作成、JSON形式でダウンロードしておきます。
3. 対象のスプレッドシートにサービスアカウントを招待する
スプレッドシートの「共有」ボタンから、サービスアカウントを追加します。これによってサービースアカウントから当該のスプレッドシートのデータにアクセスすることができるようになります。
Evidence側の設定・構築
- Evidenceフレームワークをインストールし、開発サーバーを起動します。
npx degit evidence-dev/template project-name
cd project-name
npm install
npm run sources
npm run dev
- Google sheets用のPluginをいれるために以下を実行します。
npm install @evidence-dev/connector-gsheets
- 実行後に evidence.config.yaml の末尾に以下を追加します。
"@evidence-dev/connector-gsheets": { }
-
npm run devを実行するとブラウザでEvidenceのページが開かれます。上部の「・・・」から、settingsページに遷移します。
-
+New Sourcesを押します。Source Type でgsheetsを選択し、directry nameを入力してnextを押します。
-
Google Cloud / Google Sheet側の設定の手順2で取得したjsonファイルを画面上の Choose fileからアップロードします。アップロードが完了したら、Test Configurationで接続の確認が可能です。問題がなければ save を押して接続情報を保存します。開発サーバーで起動したアプリ上から設定ファイルを書き込めるのが特徴的です。
-
接続情報が保存されたら、4で作成したdirectryの配下に connection.options.yml と connection.ymlファイルが生成されます。connection.ymlに以下をセットします。
- your_workbook_name：Googleスプレッドシートのファイル名
- your_sheet_id：GoogleスプレッドシートのID(URL https://docs.google.com/spreadsheets/d/ 以降の文字列)です。
name: [your_source_name]
type: gsheets
options: {}
sheets:
[your_workbook_name]: [your_sheet_id]
- pages配下にspreadsheet.mdというファイルを作成してアプリを構築します。
## Check data connection
```sql gsheets
select * from googlesheets.test_test
```
## Count group by date
```sql count_groupby_date
select "Created Date" as date ,
count(*) as count
from googlesheets.test_test
group by "Created Date"
order by "Created Date" DESC
```
## Dashboard
<Grid cols=2>
<DataTable data={count_groupby_date}/>
<LineChart
data = {count_groupby_date}
y = count
title = 'chart'
/>
</Grid>
- 構築したアプリをブラウザで確認してみます。
まとめ
EvidenceはSQLをメインで扱うデータチームによる、分析・報告業務のためのデータアプリ構築に最適です。具体的には、KPIのトラッキングや経営指標の共有（たとえば財務レポート、営業実績ダッシュボード、マーケティング指標のレポート）など、データアナリストチームが管理する定期的に更新されるダッシュボードの作成が適合するユースケースとなります。
従来、集計と可視化が分断（集計はSQL / 可視化はGUI操作のBIやPythonなど）されていたのに対して、SQLのみでダッシュボード作成業務を一貫して実行・管理できるのは適合するユースケースにおいて大きなアドバンテージとなります。ぜひ、皆様も試してみてください！
Discussion