Module / 05

Developer snippets

A focused library for the code patterns, commands, and utilities you reach for most.

Reusable code library

5 reusable snippets

Developer library

TypeScriptAPI

Typed API fetch helper

A small fetch wrapper with typed JSON responses and clear error handling.

export async function apiFetch<T>(path: string): Promise<T> {
  const response = await fetch(path);

  if (!response.ok) {
    throw new Error(`Request failed: ${response.status}`);
  }

  return response.json() as Promise<T>;
}

fetchapitypescript

TypeScriptUtilities

Debounce a callback

Delay a callback until input activity settles.

export function debounce<T extends (...args: never[]) => void>(
  callback: T,
  delay = 250,
) {
  let timeout: ReturnType<typeof setTimeout>;

  return (...args: Parameters<T>) => {
    clearTimeout(timeout);
    timeout = setTimeout(() => callback(...args), delay);
  };
}

utilityperformanceevents

SQLDatabase

Find recent active users

A reusable query for recent active users ordered by latest activity.

SELECT id, email, last_active_at
FROM users
WHERE last_active_at >= NOW() - INTERVAL '30 days'
  AND status = 'active'
ORDER BY last_active_at DESC
LIMIT 100;

sqlusersanalytics

ReactFrontend

Local storage state hook

Persist a small piece of React state without adding a store.

import { useEffect, useState } from 'react';

export function useLocalStorage<T>(key: string, initialValue: T) {
  const [value, setValue] = useState<T>(initialValue);

  useEffect(() => {
    localStorage.setItem(key, JSON.stringify(value));
  }, [key, value]);

  return [value, setValue] as const;
}

reacthooksstorage

BashWorkflow

Clean merged branches

Remove local branches that have already been merged into main.

git branch --merged main \
  | grep -v '\*\|main\|develop' \
  | xargs -n 1 git branch -d

gitclicleanup