使い方
- 入力欄に JSON を貼り付けるか、.json ファイルを開くか、サンプルを試してください。
- ルート型の名前を設定します(例: Order や ApiResponse)。
- interface または type 宣言を選び、export と readonly を付けるかどうかを指定します。
- 生成された TypeScript をコピーするか、types.ts としてダウンロードします。
仕組み
生成ツールは JSON ドキュメント全体を走査し、各場所で見つかった値の種類を記録します。各 JSON オブジェクトは、それぞれ名前付きの宣言になります。名前はプロパティキーを PascalCase に変換したもので、“shipping_address” は ShippingAddress になります。配列の要素には、キーの単数形に基づいて名前が付けられます。“items” は Item、“categories” は Category になり、複数形に見えないキーには “Item” という接尾辞が付きます。
1 つの配列内のすべてのオブジェクトは、1 つのインターフェースに統合されます。一部にしか存在しないキーは “?” 付きでオプションになります。値の種類が場所によって異なる場合、型は string | number のようなユニオン型になります。null は独立した型として保持されるため、時々 null になるフィールドは string | null になります。空の配列は unknown[] になります。推測する材料がないためです。プロパティと型が完全に同じ 2 つのオブジェクトは、重複して生成されず、1 つのインターフェースを共有します。“first-name” のように有効な識別子ではないキーは引用符で囲まれます。
結果は、貼り付けたサンプルのみを表します。実際にはオプションまたは null になり得るフィールドも、サンプルにそれが示されていなければ必須かつ非 null になり、日付はプレーンな文字列として扱われます。利用する前に、API ドキュメントと照らし合わせて型を確認してください。
使用例
API レスポンスの型付け
ショップ API から取得した注文を、ルート名を Order として貼り付けます。Order、Customer、Item、Shipping の各インターフェースが生成され、Item には note?: string が付きます。2 つのアイテムのうち 1 つにしか note がないためです。
読み取り専用の設定
config.json を貼り付け、「プロパティを読み取り専用にする」にチェックを入れ、結果を config.d.ts に貼り付けると、設定への誤った書き込みをコンパイラが検出してくれます。
トップレベルが配列の場合
リストのエンドポイントが [{…}, {…}] を返す場合、ルート名を Product にすると、出力は “export type Product = ProductItem[];” で始まり、その後に ProductItem インターフェースが続きます。
よくある質問
出力でフィールドが任意になるのはなぜですか?
同じ配列内のオブジェクトのうち1つでもそのキーを持たないためです。すべてのオブジェクトにそのキーがあれば必須になります。より正確に任意フィールドを判定するには、複数のレコードを貼り付けてください。
日付が string 型になるのはなぜですか?
JSONには日付型がないため、日付は文字列として扱われます。このジェネレーターは形式を推測しません。コード内で Date オブジェクトに変換する場合は、型を自分で変更してください。
interface と type の違いは何ですか?
オブジェクトの構造についてはほぼ同じように機能します。interface は後から拡張・マージできますが、type エイリアスは後から拡張できません。コードベースで既に使っているスタイルに合わせてください。
Zod スキーマのような実行時バリデーションを生成できますか?
いいえ。生成されるのは TypeScript の型宣言のみで、コンパイル時にチェックされ、実行時にデータを検証するものではありません。
プライバシー
お使いの JSON はブラウザ内でのみ解析されます。アップロード、保存、アクセス解析への利用は一切ありません。