Staticms

Staticms は、GitHubの自分のリポジトリをストレージとして利用する、開発者に優しいヘッドレスCMSです。 DenoとReactで構築されており、 GitHubと密接に連携することで、リポジトリ内のMarkdownやYAMLファイルを安全かつ直感的に編集・管理できます。

データベースは不要。すべてのコンテンツはあなたのGitHubリポジトリに保存されます。

特徴

• GitHub ネイティブ: データベース不要。コンテンツ、画像、設定の全てがGitリポジトリで管理されます。
• 安心のドラフト機能: 執筆内容はブラウザのローカルストレージに自動保存され、タブを閉じても消えません。
• 画像ドラッグ＆ドロップ: エディタに画像をドロップするだけでアップロードとリンク挿入が完了します。
• Pull Request ワークフロー: 編集内容は直接コミットされず、まず PR として作成されるため、安全にレビューできます。
• リアルタイム連携: Webhookを利用し、GitHub上でのマージや変更が即座にエディタのロック状態などに反映されます。
• 柔軟な設定: フロントマターのスキーマ定義やアーキタイプ（テンプレート）を、Web UI上からノーコードで設定できます。

---

📖 ユーザーガイド

Staticms によるコンテンツ管理の流れを説明します。

1. 利用開始（ログインとリポジトリ選択）

1. Staticmsにアクセスすると、GitHub認証画面へリダイレクトされます（初回のみ）。
2. 「Authorize」ボタンを押してアクセスを許可してください。
3. ログイン後、Staticms Appがインストールされているリポジトリの一覧が表示されます。管理したいリポジトリを選択してください。
   • ※ リポジトリが表示されない場合は、画面内のリンクからGitHub Appのインストール設定へ移動し、アクセス許可リポジトリを追加してください。

2. コンテンツ設定 (Content Configuration)

初めて管理するリポジトリや、新しい種類の記事を追加する場合は、設定画面から構成を定義します。

1. ダッシュボードの Add New Content または既存設定の Edit（歯車アイコン）をクリックします。
2. Configuration 画面で以下を設定します：
   • Type:
     • Collection (Files): ブログ記事など、複数のファイルを管理する場合。
     • Singleton (File): サイト設定など、単一のファイルを管理する場合。
   • Binding:
     • Directory: 指定フォルダ内の index.md を対象とします（画像と一緒に管理する場合におすすめ）。
     • File: 特定のファイルパスを直接指定します。
   • Path: コンテンツが格納されているディレクトリパス（例: content/posts）。
   • Fields: タイトル、日付、タグなどのフロントマター（メタデータ）項目を定義します。
3. Save をクリックして保存します。この操作により、リポジトリへのWebhook設定も自動的に行われます。

3. 記事の編集

コンテンツ一覧から記事を選択すると、エディタ画面が開きます。

• フロントマター編集: 定義したフィールド（タイトルやタグ）を入力フォームで編集できます。
• Markdown本文: リアルタイムプレビュー付きのエディタで執筆できます。
• 画像挿入:
  • エディタ内に画像をドラッグ＆ドロップ（またはコピペ）すると、画像リンクが自動挿入されます。
  • 挿入された画像はサイドバーの「Pending Images」に追加され、記事保存時にまとめてアップロードされます。
• ドラフト保存:
  • 入力内容は即座にブラウザに保存されます。誤って閉じても、次回「Draft」として復元されます。
  • Reset ボタンを押すと、サーバー上の最新の状態にリセット（下書き破棄）できます。

4. 保存と公開 (Pull Request)

書き終わったら、**画面下部（フッター）**のアクションエリアを使用します。

1. コミットメッセージ入力:
   • フッター左側の入力欄に、変更内容の説明（コミットメッセージ）を入力します。必須項目です。
2. Pull Request (PR) の作成/更新:
   • メッセージを入力すると、Create PR（または Update PR）ボタンが有効になります。
   • ボタンを押すと、新しいブランチに変更がコミットされ、PRが自動作成（または更新）されます。
3. 編集ロック:
   • PRが作成されると、記事は「In Review (Locked)」状態になり、競合を防ぐために編集できなくなります。
4. 公開:
   • GitHub上でPRをマージすると、Webhook通知によりStaticms上のロックが自動的に解除され、再び編集可能な状態（Clean）に戻ります。

---

プロジェクト構造

• public/: 静的アセット
• src/: ソースコード
  • app/: フロントエンド (React / SPA)
  • server/: バックエンド (Deno / Oak)
  • shared/: 共有型定義など
  • testing/: テストユーティリティ
• architecture/: 設計仕様書とドキュメント

開発者向け情報

Staticms自体の開発や、自前のサーバーでのホスティングに興味がある方は、DEVELOPMENT.md を参照してください。 開発環境の構築方法、テストの実行方法、および本番環境（Deno Deploy）へのデプロイ手順について詳しく解説しています。

ライセンス

MIT License