花火工房の技術スタック

花火工房で使用している技術スタックを紹介します。

フレームワーク

Qwik

Qwik は、Resumable なアーキテクチャを採用した次世代のWebフレームワークです。

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

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

Qwikの特徴：

• Resumability — ハイドレーション不要で即座にインタラクティブ
• Fine-grained lazy loading — 必要なコードだけを遅延読み込み
• SSR first — サーバーサイドレンダリングがデフォルト

Tailwind CSS v4

スタイリングには Tailwind CSS v4 を使用。ユーティリティファーストのアプローチで、カスタムテーマと組み合わせています。

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

インフラ

Cloudflare Workers

デプロイ先は Cloudflare Workers。エッジコンピューティングで世界中から高速にアクセスできます。

• グローバルCDN — 300+のデータセンター
• ゼロコールドスタート — V8 Isolates による高速起動
• 無料プラン — 個人プロジェクトに最適

まとめ

モダンな技術スタックを活用して、パフォーマンスとDXの両立を目指しています。