A practical tour of the diagram types that earn their place in engineering documentation — when to reach for each one, and how to keep them maintainable.

The real goal is simpler: make the terminal fast, readable, predictable and comfortable enough that it gets out of your way.

https://www.chezmoi.io/

I've started using chezmoi to manage my dotfiles: shell config, Git config, editor settings, aliases, and all those small files that make a machine feel like mine.

The basic idea is simple:

chezmoi source repo  ↔  my real $HOME files

But the direction matters.

https://ogp.me/

Testing Open Graph locally is a bit deceptive: your browser can see localhost, but Facebook, LinkedIn, Slack, Discord, X/Twitter, etc. cannot.

The best workflow is:

1. Check the HTML locally
2. Expose localhost with ngrok
3. Test the public URL in real social preview/debugger tools

Chrome plugins are useful for fast feedback, but the final validation should happen through a public HTTPS URL.

I wanted a tiny CLI tool for a very specific workflow: take an image and expand its canvas to 1200x630, centered, without resizing the image itself. Useful for Open Graph images.

But the interesting part was not the image logic. The interesting part was this constraint:

I do not want global Node, npm, pnpm, TypeScript, or tsx.

That changes the setup.

Caring isn't just a nicety, it's a productivity multiplier.

This is the first of a series of posts about the most common mistakes in Frontend development. This is the most common mistake I see in React projects.

This post explains what the Single Responsibility Principle (SRP) is and why it's important for React components. It shows how putting too much code and too many tasks in one component can lead to messy, hard-to-maintain apps.

Cookies are tiny key–value blobs with rules. Chrome enforces those rules rigorously: where the cookie applies (domain/path), when it’s sent (request matching + SameSite), how it’s protected (Secure/HttpOnly), and how long it survives (expiry/eviction). This post walks through the full lifecycle, browser behavior, sharp edges, and production patterns—with TypeScript examples.

• Use server-set, Secure; HttpOnly; SameSite=Lax cookies for auth.
• Scope deliberately with domain and path; avoid accidental overlaps.
• Understand SameSite (and partitioning) for cross-site flows.
• Keep cookies small, few, and purposeful.

The Compound Component Pattern has become a popular approach in React for building flexible, reusable components. You'll often see it in two flavors: separate exports (<SelectTrigger />) or dot notation (<Select.Trigger />). But like any pattern, it comes with significant trade-offs. Let's explore both sides.

When you need to inspect, modify, or replay HTTP(S) traffic, few tools are as powerful and flexible as mitmproxy.
It's open-source, scriptable in Python, and works seamlessly as a man-in-the-middle proxy.