Lesson 192 of 2116
TypeScript Types and Interfaces
type vs interface, optional fields, and structural typing. Model your data once and let every function benefit.
Lesson map
What this lesson covers
Learning path
The main moves in order
- 1Two Ways to Name a Shape
- 2interface
- 3type alias
- 4optional
Concept cluster
Terms to connect while reading
Section 1
Two Ways to Name a Shape
`interface` and `type` are almost interchangeable for object shapes. Interfaces are extendable and play nicely with classes. Type aliases handle unions, tuples, and mapped types.
Optional fields use `?`. Readonly prevents mutation. Extends builds richer types from simpler ones.
interface User {
id: string;
email: string;
name?: string; // optional
readonly createdAt: Date;
}
interface AdminUser extends User {
role: "admin";
}
const u: AdminUser = {
id: "u_1",
email: "ada@example.com",
createdAt: new Date(),
role: "admin",
};
// u.createdAt = new Date(); // error: readonlyType aliases for unions and maps
Discriminated unions force you to check the tag before using the payload. Makes null checks compile-time.
type ID = string & { readonly __brand: "ID" }; // branded nominal type
type Result<T> =
| { ok: true; value: T }
| { ok: false; error: string };
function parse(input: string): Result<number> {
const n = Number(input);
return Number.isNaN(n)
? { ok: false, error: "not a number" }
: { ok: true, value: n };
}
const r = parse("42");
if (r.ok) console.log(r.value * 2);
else console.error(r.error);Key terms in this lesson
The big idea: model your domain with interfaces and unions. Every function you write afterward gets safety for free.
End-of-lesson quiz
Check what stuck
15 questions · Score saves to your progress.
Tutor
Curious about “TypeScript Types and Interfaces”?
Ask anything about this lesson. I’ll answer using just what you’re reading — short, friendly, grounded.
Progress saved locally in this browser. Sign in to sync across devices.
Related lessons
Keep going
Creators · 50 min
The Landscape: Copilot vs. Cursor vs. Windsurf vs. Claude Code
The AI coding tool market fragmented fast. Let's map the 2026 landscape honestly: who is for autocomplete, who is for agents, who wins on cost, and what the tradeoffs actually feel like.
Creators · 50 min
Installing and Using Claude Code CLI
Claude Code is Anthropic's terminal-native coding agent. Let's install it, wire it to a project, and use the features most engineers miss on day one.
Creators · 45 min
Installing and Using the OpenAI Codex CLI
Codex CLI is OpenAI's terminal coding agent. It runs locally, supports MCP, and ships a codex cloud mode for background tasks. Let's install it and compare it honestly to Claude Code.
