Mastering TypeScript Data Modeling Patterns for Complex Applications

When building complex applications with TypeScript, managing data models and error handling becomes critically important. TypeScript's type system helps catch errors early, but beginners often struggle with modeling data and handling errors properly, especially when models become complex. In this article, we'll explore practical TypeScript data modeling patterns, focusing on how to effectively represent data and errors. This will help you write safer, more maintainable code.

### Understanding TypeScript Interfaces and Types for Data Modeling TypeScript provides two main ways to define shapes of data: interfaces and types. Both are useful for modeling complex objects. Interfaces are often easier for extending and implementing multiple times, while types are great for unions and mapped types.

interface User {
  id: number;
  name: string;
  email?: string; // optional property
}

type Product = {
  id: number;
  title: string;
  price: number;
};

### Handling Errors with Union Types A common pattern in complex applications is to handle success and error states explicitly using union types. This avoids using exceptions for flow control and makes error handling clearer.

type ApiResponse<T> =
  | { success: true; data: T }
  | { success: false; error: string };

function fetchUser(id: number): ApiResponse<User> {
  if (id === 0) {
    return { success: false, error: "User not found" };
  }
  return { success: true, data: { id, name: "Alice" } };
}

### Using Discriminated Unions for More Complex Errors When your errors can be of different types, discriminated unions allow you to safely narrow down the error kinds with TypeScript's control flow analysis.

type NotFoundError = { type: "NotFound"; message: string };
type ValidationError = { type: "Validation"; message: string; field: string };

type Result<T> =
  | { success: true; data: T }
  | { success: false; error: NotFoundError | ValidationError };

function processInput(input: string): Result<User> {
  if (!input) {
    return { success: false, error: { type: "Validation", message: "Input required", field: "input" } };
  }
  if (input !== "valid") {
    return { success: false, error: { type: "NotFound", message: "User not found" } };
  }
  return { success: true, data: { id: 1, name: "Alice" } };
}

// Example usage:
const result = processInput("");
if (!result.success) {
  if (result.error.type === "Validation") {
    console.log(`Validation failed on: ${result.error.field}`);
  } else {
    console.log(result.error.message);
  }
}

### Conclusion By modeling your data and errors clearly with TypeScript’s interfaces, union types, and discriminated unions, you improve the reliability and readability of your application. Beginners should focus on explicit error representation rather than exceptions, which makes handling errors safer and your code easier to maintain and extend.