Patterns I underestimated for too long, and the cases where each one earns its place in the codebase.
This is where the full article body would live. The layout follows editorial conventions: ~70 character measure, generous leading, and pull quotes when warranted.
Each article is keyed by id and has translations stored alongside. The reading progress bar at the top of the viewport fills as you scroll.
A subhead, set in Sora
Subheads use the display family to keep the type voice consistent. The body returns to Inter for sustained reading at 17px / line-height 1.8.
“Tests don’t make code correct. They make change cheap.”
More content here. The author’s voice carries through, and readers can navigate back to the journal at any time.
// Compound components pattern
function Tabs({ children }) {
const [active, setActive] = useState(0);
return <TabsContext.Provider value={{ active, setActive }}>{children}</TabsContext.Provider>;
}
Wrapping up. Subscribe to the journal — or don’t, but feel free to share if it helped.