We're taught to separate presentation logic from code. Multi-tiered architectures, data layers, control planes, and service layers.
But maybe there's some merit to sometimes putting presentation right next to the code.
CSS-in-JS – More expressive, more reusable. You could view this as part of the wider movement to mix markup and logic in the frontend stack (e.g., JSX and React). CSS-in-JS, while ugly sounding, is a better solution than preprocessors with ever-increasing complexity.
Notebooks – Faster iteration between changes. Iteration speed is critical in the earliest phases of analysis – cleaning data, training small models, and calculating metrics.
MDX – Richer static content. This mashup of JSX and Markdown gets rid of complex templating systems and allows you to reuse UI components in your documentation. As an added benefit, it starts to change the way that we interact with static content – it's now much easier to embed code editors, interactive examples, and more into your static content.
Notion "Blocks" – Type system for markup components. Notion extends the idea of word processors by embedding typed blocks into the document. Blocks can be presentation, data, or logic. Airtable Functions, Figma Apps, and Shopify Plugins also make their presentation layer mutable by code.
The tools aren't all there yet for presentation + code, but I imagine we'll start to see more end-user-facing presentation/code applications.