TypeScript & JSON — Type Safety with Zod, io-ts & More

1const raw = '{"name": "Alice", "age": 30}';
2const data = JSON.parse(raw);
3// data is "any" — TypeScript has no idea what's inside
4
5console.log(data.nmae); // Typo! No error at compile time.
6console.log(data.age.toUpperCase()); // Runtime crash — number has no toUpperCase

1interface User {
2  id: number;
3  name: string;
4  email: string;
5}
6
7const data = JSON.parse(raw) as User;
8// TypeScript now treats data as User — but NO runtime check happens.
9// If the JSON is missing "email", data.email is undefined and code may crash later.

1interface User {
2  id: number;
3  name: string;
4  email: string;
5}
6
7function isUser(value: unknown): value is User {
8  return (
9    typeof value === 'object' &&
10    value !== null &&
11    'id' in value && typeof (value as Record<string, unknown>).id === 'number' &&
12    'name' in value && typeof (value as Record<string, unknown>).name === 'string' &&
13    'email' in value && typeof (value as Record<string, unknown>).email === 'string'
14  );
15}
16
17const data: unknown = JSON.parse(raw);
18
19if (isUser(data)) {
20  console.log(data.name); // TypeScript knows data is User here
21} else {
22  console.error('Invalid user data');
23}

1import { z } from 'zod';
2
3const UserSchema = z.object({
4  id: z.number(),
5  name: z.string().min(1),
6  email: z.string().email(),
7  role: z.enum(['admin', 'editor', 'viewer']),
8  active: z.boolean().default(true),
9  tags: z.array(z.string()).optional(),
10});
11
12// Infer the TypeScript type from the schema
13type User = z.infer<typeof UserSchema>;
14// User = { id: number; name: string; email: string; role: "admin" | "editor" | "viewer"; active: boolean; tags?: string[] }

1const raw = JSON.parse(responseBody);
2
3const result = UserSchema.safeParse(raw);
4
5if (result.success) {
6  const user: User = result.data;
7  console.log(user.name); // Fully typed, validated at runtime
8} else {
9  console.error('Validation errors:', result.error.issues);
10  // [{ path: ["email"], message: "Invalid email", code: "invalid_string" }]
11}

1import * as t from 'io-ts';
2import { isRight } from 'fp-ts/Either';
3
4const User = t.type({
5  id: t.number,
6  name: t.string,
7  email: t.string,
8});
9
10type User = t.TypeOf<typeof User>;
11
12const result = User.decode(JSON.parse(raw));
13
14if (isRight(result)) {
15  const user: User = result.right;
16  console.log(user.name);
17} else {
18  console.error('Validation failed:', result.left);
19}

1{
2  "compilerOptions": {
3    "resolveJsonModule": true,
4    "esModuleInterop": true
5  }
6}

1import config from './config.json';
2// TypeScript infers the exact type from the file contents:
3// { port: number; host: string; debug: boolean; ... }
4
5console.log(config.port); // Typed as number
6console.log(config.prot); // Compile error: Property 'prot' does not exist

1import { z, ZodType } from 'zod';
2
3async function fetchJson<T>(url: string, schema: ZodType<T>): Promise<T> {
4  const response = await fetch(url);
5  if (!response.ok) {
6    throw new Error(`HTTP ${response.status}: ${response.statusText}`);
7  }
8  const json = await response.json();
9  return schema.parse(json);
10}
11
12// Usage — fully type-safe, validated at runtime
13const user = await fetchJson('/api/users/1', UserSchema);
14const posts = await fetchJson('/api/posts', z.array(PostSchema));