はじめに 1ヶ月後にモンスターハンターになる、ノベルワークスのりょうちん（ryotech34）です。 今回は、TypeScript向けに設計されたスキーマ宣言やバリデーションを助けてくれるライブラリである、zodを使用して条件分岐バリデーションを実装した際の備忘録です。 ドメインモデルとzodを組み合わせた実装方法として、下記の記事を参考にさせていただきました。ぜひ確認してみてください。 対象読者 zodに触れているもしくはこれから触ろうと思っている方 話さないこと zodの基本的な記法 本題 テーマ toB向けのサービスがあり、組織単位でベーシック、プロ、エンタープライズという3つのプランで契約できるとします。 そこでは、プランごとに毎月使用できるクレジットが制限されており、クレジットが制限値を超えると当該月では使用できないようにするという想定です。 やりたいこと 今回はプランが変更され
Storybook の parameters Storybook の parameters は、Story や Component に静的なメタデータやパラメタを追加するための機能です。これらのパラメータは addon の設定や Story の表示方法のカスタマイズなどに利用されます。 // グローバルな parameters の設定 export const parameters = { backgrounds: { default: 'light', values: [ { name: 'light', value: '#f8f8f8' }, { name: 'dark', value: '#333333' }, ], }, }; // コンポーネントレベルでの設定 export default { component: Button, parameters: { background
はじめに バックエンド（FastAPI）とフロントエンド（React）を別々に開発していると、REST APIのスキーマ定義に不一致が生じることがあります。 せっかくTypeScriptで型定義をして安全性を高めようとしているのに、そもそもバックエンドと矛盾があってしまうとTypeScriptの強みが活かせない状態になってしまいます。 本記事では、そのようなスキーマの不一致を防ぐ方法を検証します。 また、検証にかかる時間を短縮するため、本題以外の実装にはAIコーダーClineを活用しています。 方法 バックエンドで定義しているOpenAPIの定義ファイルを利用して、フロントエンドのスキーマを自動生成することで不一致をなくします。 つまり、バックエンドを正としてフロントエンドがバックエンドを追従するようにします。 ツール 今回利用するツールはOrvalです。 Orval は React との
WeJS @ 42nd https://wajs.connpass.com/event/293440/
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
