Intermediate code explainers

typescript

import { Pipe, PipeTransform, Inject, LOCALE_ID } from '@angular/core';
 
interface MoneyOptions {
  currency?: string;

Building a cached money pipe in Angular

pipes memoization internationalization

Intermediate 8 steps

rust

use serde::{Deserialize, Serialize};
 
#[derive(Debug, Serialize, Deserialize)]
pub struct UserProfile {

Trimming JSON output with serde attributes

serialization json attributes

Intermediate 8 steps

javascript

import { useEffect, useRef } from "react";
import { useLocation } from "react-router-dom";
 
export function RouteFocus({ title, children }) {

Managing focus on route change in React

accessibility focus-management routing

Intermediate 6 steps

python

import base64
import hashlib
import hmac
import os

How TOTP two-factor codes work

totp hmac authentication

Intermediate 7 steps

php

<?php
 
namespace App\Jobs;

A retrying queue job in Laravel

queues background-jobs retries

Intermediate 7 steps

ruby

class Contact < ApplicationRecord
  PHONE_FORMATS = {
    "US" => /\A\+1\d{10}\z/,
    "GB" => /\A\+44\d{10}\z/,

Country-aware phone validation in Rails

validation callbacks regex

Intermediate 6 steps

python

from configparser import ConfigParser, ExtendedInterpolation
from pathlib import Path

Layered INI config loading in Python

configuration parsing defaults

Intermediate 8 steps

java

@AutoConfiguration
@EnableConfigurationProperties(RateLimiterProperties.class)
@ConditionalOnClass(RateLimiter.class)
public class RateLimiterAutoConfiguration {

Building a Spring Boot rate-limiter auto-config

auto-configuration conditional-beans rate-limiting

Intermediate 7 steps

javascript

const STORAGE_KEY = "theme-preference";
 
function getSystemTheme() {
  return window.matchMedia("(prefers-color-scheme: dark)").matches

Building a dark-mode toggle that respects the OS

dark-mode localstorage matchmedia

Intermediate 8 steps

ruby

module AppConfig
  module_function
 
  def fetch(key, default: nil, required: false)

Typed environment variable config in Ruby

environment-variables type-coercion configuration

Intermediate 7 steps

typescript

interface JwtPayload {
  exp?: number;
  iat?: number;
  sub?: string;

Decoding a JWT to check expiry

jwt base64url type-guards

Intermediate 8 steps

go

package logbuffer
 
import (
	"bufio"

A buffered logger with background flushing in Go

concurrency buffering context

Intermediate 8 steps

python

from urllib.parse import urlparse
 
 
class RobotsRules:

Parsing and applying a robots.txt file

parsing longest-prefix-match state-machine

Intermediate 10 steps

rust

use std::net::{IpAddr, SocketAddr};
 
use axum::extract::{ConnectInfo, FromRequestParts};
use axum::http::request::Parts;

How a custom ClientIp extractor works in Axum

extractor http-headers proxy-forwarding

Intermediate 8 steps

java

import java.math.BigDecimal;
import java.math.RoundingMode;
import java.util.Currency;

A safe Money value type in Java

immutability bigdecimal value-object

Intermediate 10 steps

javascript

'use client';
 
import { useRouter } from 'next/navigation';
import Link from 'next/link';

Archiving with router.refresh in Next.js

client-component data-mutation transitions

Intermediate 7 steps

php

<?php
 
namespace App\Providers;

Defining feature flags with Laravel Pennant

feature-flags service-provider config-driven

Intermediate 6 steps

typescript

import { Directive, EventEmitter, HostListener, Input, Output } from '@angular/core';
 
interface Shortcut {
  key: string;

A keyboard shortcut directive in Angular

directives event-handling keyboard-shortcuts

Intermediate 9 steps