ministaを選ぶ理由
ministaは、使い慣れたReactのJSXを使いながら静的なHTML・CSS・JavaScriptを成果物として公開・納品したいときに適しています。
Table of Contents
慣れた書き方で制作できる
ページも共通パーツもJSX・TSXで記述します。Reactのコンポーネント、props、JavaScriptの式を使えるため、ページ用に別のテンプレート記法を覚える必要はありません。
TypeScriptの補完や型チェック、コードの自動整形も利用できます。本文中心のページにはMarkdown・MDXを選び、共通部分はReactコンポーネントとして再利用できます。
納品に合わせて出力できる
Webサイトの公開だけでなく、生成したHTMLやアセットを引き渡す制作にも対応します。
ファイル名や出力先を調整し、HTML・CSS・JavaScriptを読みやすく整形してZIPにまとめるため、既存サイトの改修や、別のシステムへHTMLを組み込む案件にも向いています。
納品コードの整形と納品用アーカイブで具体的な設定を紹介します。
公開先を選びやすい
公開先には、静的ファイルを配信できる環境を使います。静的ホスティングやCDNに加え、FTPでアップロードするレンタルサーバーでも公開できます。
公開後にNode.jsやministaのサーバーを運用する必要はありません。サイト内検索も、ビルド時に生成した検索データとブラウザ側のUIで実装できます。
向いているプロジェクト
- 共通コンポーネントで複数ページを制作するコーポレートサイト
- HTMLを成果物として引き渡すLPやサービスサイト
- Markdown・MDXで本文を管理するドキュメントやブログ
- ビルド時にCMSのデータを取得するコンテンツサイト
特に、内容をビルド時に確定できるサイトや、静的ファイルの納品が必要な制作に向いています。ページの一部に操作UIが必要でも、通常のscriptやIslandを組み合わせられます。
別の仕組みが必要なケース
ministaは静的サイト生成に特化しているため、サーバーサイドでリクエストごとに動的処理を行いたい場合には適していません。
以下のような要件がある場合は、他のフルスタックフレームワーク(Next.jsなど)を検討するか、外部サービスと組み合わせる必要があります。
- リクエストごとの動的ページ生成
- ログイン状態に応じた表示の切り替えや、アクセス時のリアルタイムなデータ処理が必要な場合(※静的生成ではなくSSR/ISRが必要です)。
- 頻繁なコンテンツ更新
- 管理画面からの更新をリアルタイムに反映したい場合は、Headless CMSのWebhookと連携して自動再ビルドを行うか、ブラウザ側でAPIからデータを取得します。
- フォーム送信やユーザー認証
- サーバー側の処理が必要な機能は、外部のAPIサービス(Formspree、Supabase、Firebaseなど)やサーバーレス関数(Cloudflare Workers等)と組み合わせます。