{
  "version": "https://jsonfeed.org/version/1.1",
  "title": "Alex Rivera: blog",
  "home_page_url": "https://alex-rivera.example/blog",
  "feed_url": "https://alex-rivera.example/feed.json",
  "description": "Software engineer building developer tools and reliable backends.",
  "language": "en",
  "authors": [
    {
      "name": "Alex Rivera",
      "url": "https://alex-rivera.example"
    }
  ],
  "items": [
    {
      "id": "https://alex-rivera.example/blog/hello-world",
      "url": "https://alex-rivera.example/blog/hello-world",
      "title": "Hello world",
      "summary": "A first post that doubles as the authoring guide for this site. Replace it with your own writing.",
      "content_html": "<p>This is the starter post. It shows what a post can do, and the source of this file is the reference. When you write your own first post, delete this one (or keep it as a draft with <code>draft: true</code>).</p>\n<h2 id=\"create-a-post\">Create a post<a class=\"heading-anchor\" aria-label=\"Link to this section\" href=\"#create-a-post\">#</a></h2>\n<pre class=\"shiki github-dark-default\" style=\"background-color:#0d1117;color:#e6edf3\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#FFA657\">pnpm</span><span style=\"color:#A5D6FF\"> new:post</span><span style=\"color:#A5D6FF\"> \"My first post\"</span><span style=\"color:#79C0FF\"> --description</span><span style=\"color:#A5D6FF\"> \"One sentence about it.\"</span><span style=\"color:#79C0FF\"> --tags</span><span style=\"color:#A5D6FF\"> notes</span><span style=\"color:#79C0FF\"> --publish</span></span></code></pre>\n<p>That creates <code>content/posts/my-first-post.md</code>. The file name is the URL: <code>/blog/my-first-post</code>. Without <code>--publish</code> the post is a hidden draft, so you can write in peace and publish later.</p>\n<h2 id=\"frontmatter\">Frontmatter<a class=\"heading-anchor\" aria-label=\"Link to this section\" href=\"#frontmatter\">#</a></h2>\n<p>Every post starts with a block between <code>---</code> lines:</p>\n<ul>\n<li><code>title</code>, <code>description</code> and <code>published</code> are required. The description is used on cards, in search results and in feeds.</li>\n<li><code>published</code> can be a date (<code>2026-11-10</code>) or a date with a time (<code>2026-11-10T14:30</code>). Posts are listed newest first, and the time orders posts from the same day.</li>\n<li><code>tags</code> become topic pages and filter chips.</li>\n<li><code>projects</code> lists project names from <code>content/github-projects.ts</code>; the post then shows them as \"where I use this\" cards.</li>\n<li><code>cover</code> is optional: a finished 1200x630 JPEG under <code>content/public/</code>, with the title already on it.</li>\n<li><code>aliases</code> lists former slugs. If you rename a post, put the old name here and the old link redirects.</li>\n<li><code>draft: true</code> hides the post everywhere.</li>\n</ul>\n<h2 id=\"callouts\">Callouts<a class=\"heading-anchor\" aria-label=\"Link to this section\" href=\"#callouts\">#</a></h2>\n<aside class=\"callout callout-tip\"><p class=\"callout-title\"><svg class=\"callout-icon\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5\"></path><path d=\"M9 18h6\"></path><path d=\"M10 22h4\"></path></svg>Callouts</p>\n<p>GitHub alert syntax works: NOTE, TIP, IMPORTANT, WARNING, CAUTION and TLDR. Add a title after the type, as in this one.</p>\n</aside>\n<h2 id=\"code\">Code<a class=\"heading-anchor\" aria-label=\"Link to this section\" href=\"#code\">#</a></h2>\n<p>Fenced code is syntax highlighted:</p>\n<pre class=\"shiki github-dark-default\" style=\"background-color:#0d1117;color:#e6edf3\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color:#FF7B72\">export</span><span style=\"color:#FF7B72\"> const</span><span style=\"color:#D2A8FF\"> greet</span><span style=\"color:#FF7B72\"> =</span><span style=\"color:#E6EDF3\"> (</span><span style=\"color:#FFA657\">name</span><span style=\"color:#FF7B72\">:</span><span style=\"color:#79C0FF\"> string</span><span style=\"color:#E6EDF3\">) </span><span style=\"color:#FF7B72\">=></span><span style=\"color:#A5D6FF\"> `Hello, ${</span><span style=\"color:#E6EDF3\">name</span><span style=\"color:#A5D6FF\">}!`</span><span style=\"color:#E6EDF3\">;</span></span></code></pre>\n<p>A <code>prompt</code> block is a prompt readers can copy or open in Claude or ChatGPT:</p>\n<div class=\"prompt-box\"><div class=\"prompt-head\"><p class=\"prompt-title\">Try it with your agent</p></div><pre class=\"prompt-text\"><code>Explain what a callout is and when to use one in a blog post.</code></pre></div>\n<h2 id=\"figures\">Figures<a class=\"heading-anchor\" aria-label=\"Link to this section\" href=\"#figures\">#</a></h2>\n<p>A figure is a small Svelte component that plays on its own while it is on screen. This one is registered in <code>content/figures/index.ts</code>:</p>\n<p><em>Figure: An example figure: write, check, ship, on a loop.</em> <a href=\"https://alex-rivera.example/blog/hello-world#figure-example\">Open the interactive figure</a></p>\n<p>To add your own, create a component next to <code>ExampleFigure.svelte</code>, register it in that index with a caption and a text description, and put <code>::figure your-id</code> on a line of its own. Feeds and the Markdown copy use the caption and description instead of the component.</p>\n<h2 id=\"images\">Images<a class=\"heading-anchor\" aria-label=\"Link to this section\" href=\"#images\">#</a></h2>\n<figure class=\"media-figure\"><img src=\"https://alex-rivera.example/images/og-image.png\" alt=\"A placeholder banner\" loading=\"lazy\" decoding=\"async\"><figcaption>A titled image becomes a captioned figure</figcaption></figure>\n<p>Put image files in <code>content/public/images/</code> and reference them with a path starting with <code>/images/</code>.</p>\n<h2 id=\"before-you-publish\">Before you publish<a class=\"heading-anchor\" aria-label=\"Link to this section\" href=\"#before-you-publish\">#</a></h2>\n<p>Run <code>pnpm check-content</code>. It tells you what is missing or still a starter value.</p>",
      "date_published": "2026-11-10T00:00:00.000Z",
      "tags": [
        "meta",
        "writing"
      ],
      "image": "https://alex-rivera.example/blog/hello-world/og.png"
    }
  ]
}