Stocking up

This page is a data‑driven clone of a section from The Plant‑Based Mix & Match Cookbook by Jeannine Billups. Instead of a static cookbook page, the content here is generated dynamically from structured data (pantry.yml) to produce the lists and interactive checkboxes below.

import YAML from "npm:yaml";
const text = await FileAttachment("/data/pantry.yml").text();
const pantry = YAML.parse(text);

A well‑stocked kitchen and pantry offer numerous benefits, making cooking both efficient and enjoyable. Here are some key advantages:

Below is a list of Jeannine's most commonly used ingredients followed by the JS code used to render the list. It loops through each pantry category and uses Inputs.checkbox to display the items as an interactive checklist under their category headings.

for (const [category, items] of Object.entries(pantry)) {
  display(html`
    <h3>${category}</h3>
    <div class="ingredients-checklist">
      ${Inputs.checkbox(items)}
    </div>
  `);
}