Haiku Reels is an Astro boilerplate for publishing student haikus online, turning Markdown poems into a fast, SEO-ready static site organized by author, year, school, and course.
What is Haiku Reels?
Haiku Reels is an Astro starter template created by ETEC-UBA to publish collections of student-written haikus as a static website. It takes haiku files written in Markdown or MDX placed in the src/content/haikus folder and generates a site with browsable poems organized by authorship, date, year, school, and course. The template includes background layouts with slot tags to place each haiku artistically, and it supports RSS feeds, sitemaps, and OpenGraph metadata out of the box. The project is linked to the Fundación Borges, which supports arts and culture in education.
Key Features
- Lighthouse 100 performance — The template ships with a 100/100 Lighthouse performance score, as stated in the repository.
- SEO-friendly metadata — Includes canonical URLs and OpenGraph data for social sharing.
- Sitemap and RSS support — Built-in sitemap generation and an RSS feed keep the haiku archive indexable and subscribable.
- Markdown and MDX content — Haikus are stored as Markdown or MDX documents in
src/content/haikus, with metadata defined insrc/content/config.ts. - Tailwind CSS styling — The template uses Tailwind CSS, with @tailwind/typography classes for applying prose styles to the haiku text.
- Background slot system — Custom backgrounds in
src/backgroundsaccept a slot tag so developers can position the haiku and its metadata freely. - Bun-based workflow — Commands use the Bun runtime:
bun install,bun run build:dev,bun run dev,bun run build, andbun run preview.
Who is it for?
- Teachers and schools looking to publish student poetry on the web and preserve it across generations.
- Students who want to contribute haikus to a shared, curated archive categorized by course and year.
- Educational or cultural organizations such as the Fundación Borges that promote art and want an easy-to-maintain poetry platform.
- Astro developers seeking a ready-made content template with Tailwind, MDX, and SEO features preconfigured.
What can you do with Haiku Reels?
- Publish a classroom poetry collection: Add each student haiku as a Markdown file with frontmatter metadata, run
bun run build:dev, and deploy a static site. - Organize poems by school and course: The content schema stores attributes like author, date, year, school, and course, so the site can group haikus accordingly.
- Customize visual backgrounds: Developers create new background components in
src/backgrounds; each must include a slot tag where the haiku and its metadata are rendered. - Share updates via RSS: The built-in RSS feed lets subscribers follow new haikus as they are added.
How does Haiku Reels work?
- Add haiku files to
src/content/haikusfollowing Markdown or MDX syntax, with metadata defined bysrc/content/config.ts. - Run
bun run build:devto build a development site with the haikus placed into./public/. - Run
bun run devto start a local server atlocalhost:3000, orbun run buildfor a production build in./dist/.
FAQ
Is Haiku Reels free to use?
There are no pricing or license details provided in the page content, so it appears to be an open-source-style educational project.
What does Haiku Reels do?
Haiku Reels is an Astro template that converts Markdown haikus into a static website with SEO metadata, RSS, sitemap, and customizable backgrounds. Its purpose is to archive and display student poetry in schools.
What technologies does Haiku Reels use?
It uses Astro as the static-site framework, Tailwind CSS for styling (including @tailwind/typography), and the Bun runtime for package management and build scripts. Content is authored in Markdown or MDX.
How are haiku line breaks preserved?
The template supports three ways to force line breaks in haiku verses: two spaces at the end of a verse (recommended), a backslash at the end, or an HTML <br/> tag (not recommended).
Does Haiku Reels include SEO features?
Yes, the template includes canonical URLs, OpenGraph data, sitemap support, and an RSS feed, and it reports a perfect 100/100 Lighthouse performance score.
