https://zachdrake.com/2026-10-01T09:00:00-04:002026-10-01T09:00:00-04:002026-10-01T09:00:00-04:00Zach Draketag:zachdrake.com,2026-10-01:/peanut-butter-and-jelly/

<p>A self-contained Pelican post that keeps its Markdown and images in a single directory, using <code>{attach}</code> to co-locate assets with the rendered article.</p>

<p>Peanut butter is the dependable one. It shows up in the pantry, it does not need to be refrigerated, and it will hold a sandwich together on a long hike. Python is peanut butter: batteries included, readable, and quietly everywhere — from data science notebooks to the glue scripts that keep a server farm alive.</p> <p>Jelly is the flashy one. It is bright, it is sweet, and on its own it is a little too much. JavaScript is jelly: it runs in the one runtime nobody can avoid — the browser — and it turns a dry piece of toast into something you actually want to eat.</p> <p><img alt="A jar of peanut butter labelled Python" src="https://zachdrake.com/peanut-butter-and-jelly/images/peanut-butter.svg"></p> <p>Neither one is a complete lunch. A jar of peanut butter with no jelly is a sad, sticky mouthful. A spoonful of jelly with no peanut butter is a sugar rush followed by regret.</p> <h2>The sandwich is the stack</h2> <p>The reason the PB&amp;J works is that the two spreads are complementary. The peanut butter gives structure and protein; the jelly gives sweetness and acid. In software terms, Python is where the durable logic lives and JavaScript is where the user actually touches it.</p> <p><img alt="A jar of grape jelly labelled JavaScript" src="https://zachdrake.com/peanut-butter-and-jelly/images/jelly.svg"></p> <p>Most real projects end up doing exactly this. A Python service behind an HTTP API, and a JavaScript front end that renders it. The two of them are not rivals — they are two halves of the same sandwich.</p> <p><img alt="A peanut butter and jelly sandwich labelled Python and JavaScript" src="https://zachdrake.com/peanut-butter-and-jelly/images/pbj.svg"></p> <h2>Keeping the sandwich in one place</h2> <p>The important part is that all of the ingredients for this post — the Markdown and the images — live together in a single directory:</p> <div class="highlight"><pre><span></span><code>content/ └── blog/ └── peanut-butter-and-jelly/ ├── index.md └── images/ ├── peanut-butter.svg ├── jelly.svg └── pbj.svg </code></pre></div> <p>The <code>{attach}</code> links are what make this work. When Pelican builds the article, each <code>{attach}images/...</code> reference is rewritten and the linked file is copied into the article's output directory, preserving the <code>images/</code> relationship. The post is a self-contained bundle: move the folder, and everything it needs comes with it.</p> <p>So the next time someone tries to start a language war, point out that nobody argues about whether a PB&amp;J should have peanut butter <em>or</em> jelly. You put them together, and you get lunch.</p>