Typescript code explainers

typescript

import { z } from "zod";
 
const DatabaseSchema = z.object({
  host: z.string().min(1),

Validating config with Zod schemas

schema-validation runtime-safety type-inference

Intermediate 8 steps

typescript

import { inject } from '@angular/core';
import {
  ActivatedRouteSnapshot,
  CanActivateFn,

How a functional route guard works in Angular

route-guards dependency-injection rxjs

Intermediate 5 steps

typescript

type SortDirection = "asc" | "desc";
 
interface SortKey<T> {
  selector: (row: T) => string | number | Date | null | undefined;

Multi-column sorting in TypeScript

generics comparators sorting

Intermediate 6 steps

typescript

type EditorState = {
  content: string;
  cursor: number;
};

Undo/redo with two stacks in TypeScript

undo-redo stacks state-management

Intermediate 7 steps

typescript

import { z, type ZodType } from "zod";
 
export class HttpError extends Error {
  constructor(

A type-safe fetch wrapper with Zod

generics runtime-validation error-handling

Intermediate 8 steps

typescript

import { Component, Input, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, FormArray, FormControl, Validators, ValidatorFn } from '@angular/forms';
 
interface FieldSchema {

Building dynamic reactive forms in Angular

reactive-forms dynamic-forms validation

Intermediate 8 steps

typescript

import { Controller, Get, Param, StreamableFile, Res, NotFoundException, Header } from '@nestjs/common';
import { Response } from 'express';
import { createReadStream, promises as fsp } from 'fs';
import { join } from 'path';

Streaming CSV file downloads in NestJS

file-streaming http-headers error-handling

Intermediate 7 steps

typescript

import { Controller, Get } from '@nestjs/common';
import {
  HealthCheck,
  HealthCheckService,

Liveness vs readiness probes in NestJS

health-checks dependency-injection observability

Intermediate 6 steps

typescript

import {
  Controller,
  Post,
  Headers,

Verifying Stripe webhooks in NestJS

webhooks signature-verification event-handling

Intermediate 7 steps

typescript

type JsonValue = Record<string, unknown> | unknown[];
 
export function parseJsonStream<T = JsonValue>(
  stream: ReadableStream<Uint8Array>,

Streaming JSON parsing with a depth counter

streams parsing state-machine

Advanced 9 steps

typescript

import { useEffect, useRef, useCallback } from "react";
 
type DraftPayload = Record<string, unknown>;

A debounced auto-save hook in React

debouncing request-cancellation refs

Advanced 7 steps

typescript

type Curried<A extends any[], R> = A extends [infer First, ...infer Rest]
  ? (arg: First) => Rest extends [] ? R : Curried<Rest, R>
  : R;

Type-safe currying in TypeScript

currying conditional-types recursion

Advanced 8 steps

typescript

import { Injectable } from '@angular/core';
import {
  HttpInterceptor,
  HttpHandler,

Refreshing tokens with an Angular HttpInterceptor

http-interceptor token-refresh rxjs

Advanced 8 steps

typescript

type StorageSchema = Record<string, unknown>;
 
interface StorageOptions {
  namespace?: string;

A type-safe wrapper around localStorage

generics type-safety serialization

Intermediate 9 steps

typescript

type Fetcher<T> = (key: string) => Promise<T>;
 
export class RequestDeduplicator<T> {
  private inFlight = new Map<string, Promise<T>>();

Deduplicating in-flight requests in TypeScript

deduplication promises caching

Intermediate 7 steps

typescript

import { Injectable, computed, inject, signal } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { firstValueFrom } from 'rxjs';

Optimistic updates with Angular signals

signals optimistic-updates state-management

Intermediate 9 steps

typescript

type EventMap = Record<string, unknown>;
 
type Handler<T> = (payload: T) => void;

A type-safe event bus in TypeScript

generics event-emitter type-safety

Advanced 7 steps

typescript

export class PriorityQueue<T> {
  private heap: Array<{ value: T; priority: number }> = [];
 
  get size(): number {

Building a binary-heap priority queue in TypeScript

binary-heap priority-queue generics

Intermediate 9 steps