Code Explainers

Browse the library

javascript 
import { Suspense } from 'react';
import { searchProducts } from '@/lib/products';
import SearchInput from './search-input';
 

Streaming search results in a Next.js Server Component

server-components suspense streaming
Intermediate 8 steps
rust 
use axum::{
    body::{Body, Bytes},
    extract::Request,
    http::StatusCode,

Logging request and response sizes in Axum

middleware http streaming-bodies
Advanced 8 steps
php 
<?php
 
declare(strict_types=1);
 

Normalizing human names in PHP

unicode text-normalization transliteration
Intermediate 8 steps
go 
func (h *ExportHandler) StreamExport(c *gin.Context) {
	datasetID := c.Param("id")
 
	ctx := c.Request.Context()

Streaming NDJSON progress with Gin

streaming goroutines channels
Advanced 8 steps
python 
from functools import wraps
 
from flask import Blueprint, abort, jsonify
from flask_login import current_user, login_required

Building an admin-only decorator in Flask

decorators authorization access-control
Intermediate 7 steps
ruby 
class BackfillUsersFullName < ActiveRecord::Migration[7.1]
  disable_ddl_transaction!
 
  BATCH_SIZE = 5_000

How to backfill a column safely in Rails

migrations batching backfill
Intermediate 7 steps
java 
public final class Ulid {
 
    private static final char[] ENCODING = "0123456789ABCDEFGHJKMNPQRSTVWXYZ".toCharArray();
    private static final SecureRandom RANDOM = new SecureRandom();

How to generate a ULID in Java

base32-encoding bit-manipulation identifiers
Intermediate 8 steps
typescript 
import { Injectable, inject } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable, timer, throwError } from 'rxjs';
import { switchMap, takeWhile, filter, take, catchError } from 'rxjs/operators';

Polling a job until it finishes in Angular

rxjs polling observables
Intermediate 7 steps
javascript 
import { useState } from 'react';
 
function StarRating({ value = 0, max = 5, onChange, size = 24 }) {
  const [hovered, setHovered] = useState(null);

Building an accessible star rating in React

controlled-component accessibility state-management
Intermediate 8 steps
rust 
use std::borrow::Cow;
 
pub fn escape_html(input: &str) -> Cow<'_, str> {
    let needs_escape = input

Zero-copy HTML escaping with Cow in Rust

clone-on-write zero-copy string-escaping
Intermediate 6 steps
php 
<?php
 
namespace App\Http\Controllers;
 

Handling Stripe webhooks in Laravel

webhooks signature-verification dependency-injection
Intermediate 7 steps
go 
package handler
 
type flightResult struct {
	status int

Deduping in-flight requests in Gin

middleware concurrency deduplication
Advanced 9 steps
python 
from django.urls import path, include
 
app_name = "api"
 

How URL-namespaced API versioning works in Django

api versioning url routing namespaces
Intermediate 8 steps
ruby 
class ProjectsController < ApplicationController
  def new
    @project = current_account.projects.build
    load_form_collections

The new/create pattern in a Rails controller

mvc strong-parameters tenant-scoping
Intermediate 7 steps
java 
@RestController
@RequestMapping("/api/reports")
public class ReportController {
 

Header-driven endpoints in a Spring controller

rest api request headers dependency injection
Intermediate 7 steps
typescript 
type Flatten = Record<string, unknown>;
 
function isPlainObject(value: unknown): value is Record<string, unknown> {
  return (

Flattening nested objects into dotted keys

recursion reduce type-guards
Intermediate 7 steps
javascript 
import { notFound } from 'next/navigation'
import { Suspense } from 'react'
import { getPostBySlug, getRelatedPosts } from '@/lib/posts'
import { RelatedPosts } from '@/components/related-posts'

Building a dynamic blog post page in Next.js

server-components dynamic-routing metadata
Intermediate 8 steps
rust 
use once_cell::sync::Lazy;
use regex::Regex;
 
static CREDIT_CARD: Lazy<Regex> = Lazy::new(|| {

Redacting sensitive data from logs in Rust

regex lazy-initialization checksum-validation
Intermediate 9 steps