Launching soon on Product Hunt. Follow me!😻
Docs
Get Started

Get Started - 始めましょう

このスタートガイドは、Collections を使ってはじめからコンテンツ管理を実行できるように設計されています。

1. プロジェクトを作成する

Collections を使い始める最も簡単な方法は、create-collections-app パッケージを使用することです。

npx create-collections-app my-app

Collections は、複数のデータベースに対応しています。それぞれのデータベースごとに設定オプションは異なりますが、安心してください。インストーラーの質問に答えるだけで、一連のセットアップは完了します。

// データベースクライアントを選択してください
? Which one? SQLite is the simplest. (Use arrow keys)
❯ SQLite
  MySQL / MariaDB
  PostgreSQL

SQLite の場合

// データベースファイルのパスを入力してください
? Database File Path: (/my-app/data.db)

MySQL / MariaDB の場合

// データベースのホストを入力してください
? Database Host: (127.0.0.1)
 
// データベースのポートを入力してください
? Port: (3306)
 
// データベースの名前を入力してください
? Database Name: (collections)
 
// データベースのユーザーを入力してください
? Database User:
 
// データベースのパスワードを入力してください
? Database Password:

PostgreSQL の場合

// データベースのホストを入力してください
? Database Host: (127.0.0.1)
 
// データベースのポートを入力してください
? Port: (5432)
 
// データベースの名前を入力してください
? Database Name: (collections)
 
// データベースのユーザーを入力してください
? Database User:
 
// データベースのパスワードを入力してください
? Database Password:
 
// SSLを有効にしますか
? Enable SSL: (y/N)

続いて、管理者のユーザーを作成します。

// メールアドレスを入力してください
? Email: (admin@example.com)
 
// パスワードを入力してください
? Password

以上でセットアップは完了です！以下のコマンドを実行してアプリを起動してみましょう。

cd my-app
npm run dev

http://localhost:4000/admin (opens in a new tab) を開くと、実行中のアプリが表示されるはずです。

2. データモデルを作成する

ログインすると、最初のデータモデルを作成するオプション画面が表示されます。

  1. データモデルに移動する
  2. 名前を入力する
    • 今回のデータモデル名は posts とします
  3. 保存する
  4. 保存が成功すると、メニューバーのコンテンツ管理に posts が表示される

データモデルについて

3. フィールドを追加する

最初のデータモデルを作成したら、フィールドを追加しましょう。はじめは、もっとも一般的なテキストフィールドを作成してみてください。

  1. 設定 > データモデル > posts に移動する
  2. フィールドを追加をクリックする
  3. フィールドのタイプを選択する
  4. フィールド名とラベルを入力する
    • 今回のフィールド名は title とします
  5. 保存する

4. コンテンツを作成する

データモデルとフィールドの準備が整ったので、コンテンツを作成してみましょう。

  1. コンテンツ管理 > posts に移動する
  2. 新規登録をクリックする
  3. title に値を入力する
  4. 保存する

5. ロールとパーミッションを設定する

Collections には、一般ロールと管理者ロールが組み込まれています。一般ロールは全てのパーミッションをオフにした状態で提供され、必要に応じて追加することができます。 管理者ロールは、全てのパーミッションを持っており、これを変更することはできません。

Collections で登録されたコンテンツは全てプライベートとみなされます。そのため、アクセスするにはパーミッションを付与する必要があります。 そこで、API が私たちのコンテンツを返すように、読み取りパーミッションを追加してみましょう。

  1. 設定 > ロール に移動する
  2. 新規登録をクリックする
  3. ロール名を入力する
    • 今回のロール名は public とし、管理者権限はオフのままにしておきます
  4. 保存する
  5. ロール編集画面で、posts の読み取りパーミッションを許可に変更する

6. APIに接続する

さて、プロジェクトに公開するコンテンツができたので、次はこのコンテンツを外部で使い始める番です！ Collections では、REST API エンドポイントでのアクセスがサポートされています。 今回は、一番簡単に API にアクセスする方法としてプレビュー機能を使ってみましょう。

  1. コンテンツ管理 > posts に移動する
  2. をクリックする
  3. 表示されたプレビュー画面で、取得をクリックする
    • API キーが未登録の場合は、リンクをクリックしてプロフィール画面で API キーを作成してください

すると、そこにはあなたが作成した posts コンテンツが、美しいJSONで提供され、どこでも使用できるようになっています！

{
	"data": [
		{
			"id": 1,
			"createdAt": "2023-10-03T00:34:56.486Z",
			"updatedAt": "2023-10-03T00:34:56.486Z",
			"title": "Hello World"
		}
	]
}

この例では、API を使ってごくシンプルな読み取りリクエストを行いましたが、それだけではありません。 Collections は、登録や更新・削除といった 網羅的なエンドポイントを提供し、アプリでできるすべてのアクションは API 経由で行うことができます。

HomeWordPress からの移行