Hanabi Koubou Tech Stack

Here's an introduction to the tech stack used in Hanabi Koubou.

Framework

Qwik

Qwik is a next-generation web framework built on a Resumable architecture.

import { component$, useSignal } from "@builder.io/qwik";

export const Counter = component$(() => {
  const count = useSignal(0);
  return (
    <button onClick$={() => count.value++}>
      Count: {count.value}
    </button>
  );
});

Key features of Qwik:

• Resumability — Instantly interactive without hydration
• Fine-grained lazy loading — Only loads the code that's needed
• SSR first — Server-side rendering by default

Tailwind CSS v4

We use Tailwind CSS v4 for styling, combining a utility-first approach with custom theming.

@theme {
  --color-bg-light: #f5f0e8;
  --color-accent-light: #8b4513;
  --font-heading: "Zen Old Mincho", serif;
}

Infrastructure

Cloudflare Workers

Deployed on Cloudflare Workers for edge computing with fast global access.

• Global CDN — 300+ data centers worldwide
• Zero cold start — Fast startup via V8 Isolates
• Free plan — Perfect for personal projects

Summary

We leverage a modern tech stack to achieve both performance and great developer experience.