コンテンツにスキップ

コンテンツ管理

ProyectaのCMSはアプリのプライマリデータレイヤーです — ブログ投稿やマーケティングコピーだけでなく、アプリの基盤となる実際のレコードも管理します。コレクションはUIが存在するにプロビジョニングされ、リアルなサンプルコンテンツでシードされるため、アプリは最初のビルドから編集可能なデータに接続された状態で公開されます。

ほとんどのProyectaアプリは、組み込みのCMSにデータを保存します。アプリを説明すると、Proyectaはデータモデルを設計し、必要なコレクションを作成し、リアルなサンプルコンテンツで埋めます — すべて、単一のページが構築される前に行われます。そしてページは、AIが自動的に接続してくれるtyped hooksを通じて、その実際のオーナー編集可能なコンテンツを読み取ります。全体像については、**アプリのデータの仕組み**をご覧ください。

始めるにあたって、これらのことを意識する必要はありません — すべて自動的に行われます。このページでは、その仕組みを説明します。

コンテンツはコレクションシングルトンに整理されます:

タイプ 説明
コレクション 多数のエントリーを持つコンテンツタイプ — 1つのスキーマ、多数の行。 posts, services, testimonials, catalogItems
シングルトン エントリーがちょうど1つのコンテンツタイプ — グローバルな一回限りのコンテンツ。 businessInfo, seoSettings

コレクションは「形」であり、各エントリーはその形の1つのアイテムです(1つのブログ投稿、1つのサービス、1つのFAQ)。シングルトンは、ビジネスのアイデンティティや、ページのヒーロー/セクションのコピーなど、1つの編集可能なレコードを保持します。

どのようなコンテンツに対応しているか

Section titled “どのようなコンテンツに対応しているか”

Proyectaには、実際のビジネスが管理するレコードの種類に対応した既製のコレクションデザインが用意されています — 適切なフィールド、管理ヒント、スターターコンテンツが含まれます:ブログ投稿や記事、サービス、プロダクトカタログ、フードメニュー、お客様の声とレビュー、チームメンバー、フォトギャラリー、FAQ、イベント、ロケーション、ダウンロード可能なリソース、求人情報、コース、ツアー、宿泊施設リストなどです。

メニューから選ぶ必要はありません。アプリを説明すると、Proyectaはあなたのブリーフ(ビジネスタイプ、リクエストした機能、使用言語)に合ったものを選び、リアルなサンプルコンテンツで事前入力した上で作成します。既存のコレクションでカバーできないものが必要な場合は、Proyectaが独自のフィールドを持つカスタムコレクションを設計します。

そのため、管理パネルにはアプリのコレクションが表示されます — 固定リストではありません。 管理パネルはアプリのライブコンテンツモデルから自動的に構成されるため、Proyectaが作成したもの(組み込みかカスタムかを問わず)がそのまま表示・編集できます。2つのProyectaアプリが同じコレクションセットを持つことはほとんどなく、それは意図的な設計です。

すべてのコレクションは、型付きのフィールドで構成されています。フィールドタイプはエンドツーエンドで適用されます — 管理パネルは適切なエディターをレンダリングし、ページは正しく型付けされた値を受け取ります。

フィールドタイプ 用途
string 短い1行の値 — タイトル、名前、住所。
text プレーンテキストの段落。
markdown 長形式のリッチテキスト — 記事本文、「about」コピー。
slug URLの識別子。別のフィールド(タイトルなど)から自動導出。
number カウント、評価、期間。
money 価格や通貨金額 — 金額として表示・編集。
boolean オン/オフのフラグ。
date カレンダーの日付。
datetime タイムスタンプ — 公開日、イベントの開始時刻。
weeklyHours 週の各曜日の営業時間。
asset 画像、動画、またはPDF(パブリックURLとして保存)。
reference 別のコレクションのエントリーへのリンク。
enum 固定の選択肢リストからの値。
array 文字列のリスト — タグ、電話番号、ゾーン。
blocks スタック可能なコンテンツブロック — 型付きセクションで構成されたページ。
json 上記のタイプに当てはまらない構造化データ。

エントリーはコレクション内の1つのアイテムです。すべてのエントリーにはステータスがあります:

  • Draft — 作業中のコンテンツ。ライブサイトには表示されません。
  • Published — ライブ状態で訪問者に表示されます。
  • Archived — 使用終了。邪魔にならないよう保管されます。

公開ページは常にPublishedのエントリーのみを表示します — 下書きとアーカイブされたアイテムは自動的に非表示になるため、コンテンツを公開前に安全に準備できます。

コンテンツの管理(コード不要)

Section titled “コンテンツの管理(コード不要)”

コンテンツを追加・編集する方法は2つあります — どちらもコードに触れる必要はありません:

  1. チャットでAIに依頼する。 変更内容を説明するだけで、AIが適切なコンテンツを編集してくれます:
    • "Add a testimonial from María González: 'Best service in town', 5 stars."
    • "Change the tagline in Business Info to 'Café de especialidad en la Roma'."
    • "Mark the last five contact-form submissions as read."
  2. アプリの管理パネル。 公開されたすべてのアプリには、サインイン保護された組み込みの**管理パネルが付属しており、あなた(およびアクセスを付与したスタッフ)がコンテンツとフォームの送信内容を直接管理できます — コレクションごとのスプレッドシート形式のエディターと送信インボックスが含まれます。アプリのライブコンテンツモデルから自動的に設定されるため、新しいコレクションは自動的に表示されます。管理パネル**をご覧ください。

アプリの管理パネルまたはAIを通じてCMSコンテンツを管理してください — ビルダー内のコンテンツエディターはロードマップに含まれています(近日公開予定をご覧ください)。ライブ更新アプリ向けのリアルタイムレコードブラウザも近日公開予定です。

アプリがコンテンツを読み取る仕組み

Section titled “アプリがコンテンツを読み取る仕組み”

ページは@/hooks/useContentの型付きhooksのセットを通じてコンテンツを読み取ります — その接続はAIが書いてくれます。ページを説明すると、Proyectaはこれらのhooksを実際のコレクションに対して呼び出すコンポーネントを生成します。ご自身で直接触れることはほとんどありませんが、それぞれの機能は以下の通りです:

Hook 機能
useCollection('posts') コレクションのPublishedエントリーを一覧表示します(オプションのフィルター/ソート/リミット付き)。
useEntry('posts', slug) slugでPublishedエントリーを1件取得します(詳細ページ用)。
useSingleton('businessInfo') シングルトンを読み取ります(ビジネス情報、ページコンテンツ)。
useFormSubmit('contactForm') フォームを送信し、バリデーションエラーを報告します。
// A blog index — exactly the kind of code the AI generates for you
import { useCollection } from '@/hooks/useContent';
function BlogList() {
const { data: posts, isLoading } = useCollection('posts', { sort: 'published_at:desc' });
if (isLoading) return <Spinner />;
return posts?.map((post) => <PostCard key={post._id} post={post} />);
}

Proyectaがコレクションに対して型付きインターフェースを生成すると、hooksは完全に型付けされます(useCollection<Post>('posts'))。これにより、エディターがすべてのフィールドをオートコンプリートするようになります。読み取りはベイクされたスナップショットから初回ペイント時にハイドレーションされます — ページは即座にSEOフレンドリーな形でレンダリングされ、その後バックグラウンドでライブに更新されます。

フォームはファーストクラスの機能であり、AIが手動で構築するものではありません。フォームブロックを配置するだけで、フィールドのレンダリング、入力のバリデーション、送信、成功状態の表示が行われます:

<FormBlock form="contactForm" />

フォームも既製品が用意されています — お問い合わせフォーム、見積もりリクエスト、予約フォーム、注文フォーム、登録フォーム — Proyectaが適切なフォームをページに接続します。送信内容はアプリの管理パネルのインボックスに届き、新しい送信があるとオーナーにメールが送信されます。詳細は**フォーム**をご覧ください。

コンテンツは複数のロケールに翻訳できます。ローカライズ済みとしてマークされたフィールドは言語ごとに値を保存し、読み取りhooksは訪問者のアクティブなロケールを渡すと、フォールバックチェーン(リクエストされた言語 → 設定されたフォールバック → デフォルト)を通じて解決します:

const { data: posts } = useCollection('posts', { locale: 'es' });

単一言語のアプリはロケールを完全に無視します — 設定するものは何もありません。翻訳全体の仕組みについては、**国際化**をご覧ください。

リリースは複数のエントリーをまとめて一度に公開(または非公開に)するための機能です — ローンチ、新しいプロダクトページ、FAQの更新など、調整されたコンテンツの一括公開をステージングし、一度にすべてを切り替えられます。

注意: 自動タイムド公開はまだ実装されていません。scheduled_atの日付を持つリリースはscheduledステータスになりますが、手動で公開する必要があります。スケジュールされた時刻での自動公開は近日公開予定です。

よくあるパターン(AIに接続を任せる)

Section titled “よくあるパターン(AIに接続を任せる)”

これらを手動で書くことはほとんどありません — やりたいことを説明すると、Proyectaが実際のコレクションに対して構築してくれます:

  • "Build a blog. Each post has a title, cover image, rich-text body, category, and tags. Public routes at /blog and /blog/[slug], newest first."
  • "Add an FAQ section the owner can edit, grouped by category."
  • "Add a bookable services list with a request-a-quote form."
  • "Make the site bilingual — English and Spanish — with a language switcher."
  • "Seed the testimonials with five realistic reviews for a coffee shop."

CMSは永続的なコンテンツとレコードのデフォルトの保存場所です。一部の種類のデータは、専用のシステムに保存されます:

データの種類 保存場所
コンテンツ&レコード(投稿、サービス、リスト、FAQ、カタログ、予約) Proyecta CMS(このページ) — デフォルト
リアルタイム/動作状態(ライブチャット、フィード、プレゼンス、ゲーム状態) リアルタイムストア近日公開予定
ユーザーアカウント&サインイン Auth
商品、注文、サブスクリプション、支払い Commerce
アップロードされたファイル&メディア Files & Media
ビルドに組み込まれた静的アセット プロジェクト内のpublic/ディレクトリ

CMSがデフォルトです。真の意味でのリアルタイム動作のためのリアルタイムストアは近日公開予定ですが、それでも永続的なコンテンツとコマースカタログは引き続きCMSに保存されます。

  • ビルダー内コンテンツエディター — ビルダーダッシュボードから直接CMSコレクションを閲覧・編集できます(現在は管理パネルまたはAIでコンテンツを管理してください)。
  • リッチテキストWYSIWYGエディターmarkdownフィールドのビジュアル編集(現在はMarkdownとして編集)。
  • タイムド自動公開 — スケジュールされた時刻に自動的に公開されるリリース。
  • コンテンツ変更のライブプレビュー — アプリに対するコンテンツ変更のプレビュー。
  • コンテンツロール — 編集者の権限と開発者の権限の分離。