この記事は、トラストバンク Advent Calendar 2023の3日目です。
お疲れさまです。フロントエンドエンジニアの片柳です。
先日、トラストバンクからふるさと納税の控除額シミュレーションライブラリfurusato-tax-simulation
がリリースされましたので、紹介と実装時に考えたことなどを紹介できればと思います。
なぜライブラリを作るのか
トラストバンクが提供するふるさと納税サイト「ふるさとチョイス」では、2種類の控除上限額シミュレーションを提供しています。
「家族構成」「年収」から簡単に上限額を知ることができる簡易シミュレーション。
源泉徴収票を利用して、より細かな上限額を知ることができる詳細シミュレーション。
これらはJavaScriptを用いて各ページに実装されています。
ふるさとチョイスの他にも、トラストバンクが提供する多くのウェブサイトやアプリの中で、それぞれが独自の実装を行い、運用を行なっています。
私たちが支払う税金や、ふるさと納税にまつわる法律は日々更新されていきます。
シミュレーション結果が変わるたび、各サービスの運用者がそれぞれで修正を行うのでは手間も時間もかかります。
また、新しくふるさと納税サイトを立ち上げたいと考えているパートナーが、0から控除上限額計算の資料を読み解いてシミュレーションを作成することは難しく、「控除上限額シミュレーションを掲載したいのにできない」と、ハードルを生むことにも繋がっていました。
すべてのサービスの運用工数を下げたい社内と、従来よりも簡単に控除上限額シミュレーションを実装したい社外の双方に向け、furusato-tax-simulation
は作成されました。
どうやってライブラリを作るのか
以前、社内向けのライブラリとして、eslint-config-trustbank
を公開したことがあった*1ため、npmライブラリの作成方法については大まかに知見がありました。
(「トラストバンクのフロントエンドを支える(予定の)ESlint」もぜひご一読ください)
tech.trustbank.co.jp
index.js
を作成するだけでよいESLintのコンフィグとは異なり、今回のライブラリでは
- TypeScriptをコンパイルし
- 複数のファイルを1つにまとめ上げ
- ES Modules/Common.jsなど、環境ごとに異なる記法になるように書き分ける
といった作業が必要となります。
月並みですが、Rollup.js
を用いて環境構築を行いました。
Rollup.js
をベースとしたビルドツールとして有名なVite
にも、ライブラリのためのJavaScriptを書き出すための専用モードがありますが、今回は利用していません。
想定通りの書き出しを行うためにはVite
上でRollup.js
の設定情報を上書きする必要があり、それなら最初からRollup.js
を利用したほうがシンプルだろうと判断しました。
具体的な設定はrollup-minimum-setup
にアップロードされていますので、興味がある方はぜひご覧ください。
今回のライブラリも、このリポジトリをフォークして作成しました。
バージョン管理と運用保守
一度公開したnpmパッケージを更新するためには、必ずバージョンを更新しなくてはいけません。
npmにはいくつかのバージョンアップコマンドが存在するため、更新の規模によって、以下のように使い分けるように運用方針を定めました。
コマンド | バージョンの変更 | 対応する更新 |
---|---|---|
npm version patch |
1.0.0 -> 1.0.1 | 関数から返却される数値やレスポンスの形が変わらない軽微な修正 |
npm version minor |
1.0.0 -> 1.1.0 | 計算式の更新など、関数から返却される数値が変わる修正 |
npm version major |
1.0.0 -> 2.0.0 | 関数から返却されるレスポンスの形変わる修正 |
furusato-tax-simulation
のこれから
現在は、簡易シミュレーション・詳細シミュレーションともに、計算結果のみが返される小さなライブラリです。
社内に散らばっているシミュレーションをこのライブラリに変更する作業を進めつつ、必要なレスポンスや関数の追加、使いやすさの向上を目指します。
furuasto-tax-simulation
は、MITライスセンスで公開されており、ライブラリを実装したリポジトリも、近日中に公開予定です。
たくさんの方のご利用、IssueやPRの作成もお待ちしております。
最後に
トラストバンクでは、一緒に働く仲間を募集中です。
トラストバンク Advent Calendar 2023は、@h0r4kの「New Relicを用いたキャッシュ効果の推定」に続いていきます。
ぜひお楽しみに。