nicetool.dev logo

JSONからTypeScript

APIのレスポンスやJSONオブジェクトを貼り付けてください。入力に合わせて型が更新されます。

JSON
生成されたコード
export interface User {
  id: number;
  name: string;
  email: string;
  score: number;
  active: boolean;
  tags: string[];
  address: Address;
  orders: Order[];
}

export interface Address {
  city: string;
  postcode: null;
}

export interface Order {
  id: number;
  total: number;
  paidAt?: string;
  coupon?: string;
}

なぜJSONから型を生成するのか?

API、設定ファイル、WebhookはJSONを返しますが、TypeScript、Go、実行時バリデーターには明示的な構造が必要です。大きなレスポンスのinterfaceを手で書くのは時間がかかり、ミスも起こりがちです。ときどき欠けるフィールド、ときどきnullになる数値、入れ子になったオブジェクトの配列などは特に間違えやすい部分です。このツールは実際のサンプルを読み取り、構造を推論します。オブジェクトの配列は統合され、一部の要素にしかないキーは省略可能に、nullになることがあるキーはnull許容になり、入れ子のオブジェクトにはそれぞれ型名が付きます。

機能

  • • 省略可能(?)フィールド付きのTypeScript interfaceまたはtype
  • • jsonタグ、omitempty、Goらしい命名(ID、URL)のGo構造体
  • • 推論されたTypeScript型付きのZodスキーマ(参照順に並べ替え)
  • • オブジェクトの配列を統合し、null、混在型、整数を検出
  • • "first-name"のように識別子として無効なキーは引用符で囲む

データは外に出ません

解析とコード生成はブラウザ内で行われます。実際の顧客データを含むAPIレスポンスが端末の外に出ることはありません。

アップロードなし、オフラインでも動作。

JSONからTypeScriptの使い方

  1. 1

    JSONのサンプルを貼り付けます。ブラウザのNetworkタブ、Postman、curlからコピーしたレスポンスなどです。配列の要素が多いほど省略可能なフィールドを正確に検出できます。

  2. 2

    出力を選びます。TypeScriptのinterface、Goの構造体、Zodスキーマから選べ、TypeScriptではtypeエイリアスにも切り替えられます。

  3. 3

    UserやOrderResponseなどルートの型名を設定します。入れ子のオブジェクトはキー名から、配列の要素は単数形(ordersならOrder)で名前が付きます。

  4. 4

    結果を確認し、サンプルから分からない点(実は日付や列挙値である文字列など)を調整してからコードにコピーします。

活用例

REST APIレスポンスの型付け

GET /api/users/42のJSONを貼り付けると、入れ子のAddress型を持つUserインターフェースが得られ、fetchやaxiosですぐに使えます。

外部APIのGoクライアント

StripeやGitHubのWebhookペイロードからjsonタグ付き構造体を生成します。省略可能なキーにはomitemptyが付き、入れ子のオブジェクトは別の型になります。

Zodによる実行時バリデーション

リクエストボディのサンプルをZodスキーマにし、Next.jsのルートハンドラーでschema.parse()を使って不正な入力を弾き、静的型にはz.inferを使います。

設定ファイル

JSONの設定ファイルを貼り付けて型付きインターフェースを作れば、エディターがキーを補完し、タイプミスを検出します。

よくある質問

省略可能なフィールドはどう検出されますか?+

ルートや入れ子の値がオブジェクトの配列の場合、全要素を統合します。少なくとも1つの要素で欠けているキーは省略可能(TypeScriptの?、Goのomitempty、Zodの.optional())になります。

null値はどう扱われますか?+

一部の要素でnull、他で文字列のキーはstring | null(Zodのnullable()、Goの*string)になります。サンプルで常にnullのキーは、実際の型が分からないためnullのままです。

Goで数値がint64になるのはなぜ?+

サンプル内の整数はint64、小数はfloat64になります。両方が混在するフィールドはfloat64(TypeScriptではnumber)に広げます。

日付、列挙値、UUIDは検出できますか?+

できません。JSONには日付や列挙の型がないため文字列として表示されます。z.string().datetime()やリテラル値のユニオンなどで手動で絞り込んでください。