Contentful による位置情報API提供

Drupal、WordPress 試してますが、なかなか決定打と言いにくい。

では、もっと手を広げてみようということで、Contentful にも手を出してみます。
英語の勉強も兼ねて・・・

入門

どこから始めればよいのか。
公式だとここか。

Introduction to Contentful

• Work quickly and independently
  • コンテンツ（データ）と開発の分離。「反映してね」みたいなフローがなくなる。
• Manage all your content in one place
  • 考えるべきはどこに配布するかであり、データとしては1箇所で管理する。
• Write once, reuse everywhere
• Training courses

Web app overview

ContentfulとしてのWebアプリは下記のような構成

• Content page:

  • メイン機能。コンテンツの一覧を見て、ステータスを確認できる等。

• Entry editor:

  • 各コンテンツエントリーを管理。

• Media page:

  • images, videos, PDF 等をアップロードする。

• Media file editor:

  • 上記メディアファイルの編集。

• Space selector:

  • 組織の中に、スペース、チームがある。

Spaces and organizations

スペースと組織と、ロールと権限でユーザ管理

• What are spaces and organizations?

  • 特定の目的ごとにスペースを用意する。スペースに対して、以下のような設定をする。
    • Webhooks
    • API keys
    • Locales
    • Content preview
    • Space roles
  • 組織はスペースの上位にあり、例えば、組織内に開発用スペースと制作用スペースを分けたりする。プランや請求の単位になる。ユーザは組織に所属し、ロールを持っている。ロール・所属は、スペースに対してのものと、組織に対してのものがある。

• Belonging to a space

  • スペースにおけるロールとしては、Adminの定義がある。Adminは、その他のユーザのロール設定や、スペースの削除等ができる。

• Belonging to an organization

  • 組織としては、４つのロールが定義されている。
  • owner, admin, developer and member

• Fold together: considering both kinds of roles

  • スペースと組織のロールを重層的に定義する

• Takeaways

  • スペースは、特定の目的のためにコンテンツを扱う場所。組織の中で、スペースを管理する。ユーザは２面のロールを持っている。

The beginner’s guide to Contentful

ということで本題。

本来コンテンツモデルの全体像をしっかり作る必要があるわけですが、まずは実用的な例を参照するのが良いでしょう、ということで、サンプルプロジェクトを作成します。

Our example project

ブログをサンプルとします。記事内容だけでなく、画像等のメディア、投稿者プロフィール、タグ情報などがあるわけで、これらをコンテンツタイプとしてまとめるわけです。

Step 1: Get an account

Githubアカウントでサインアップできます。

次の画面で会社名も必須なのは、ちょっとなという感じ。
というか、これが組織名なのですね。実際の勤め先を入れてしまうとややこしいと思うので、後ほど変更しておきました。

その後もいろいろ聞かれます。

そしてスタートすると、最初にこの画面が表示されました。

これをやってみた方が良いのかなとも思いましたが、まずはスペースかなと思うので、ガイドに従います。

Step 2: Create a space

左上部分、組織名の下にスペース名「Blank」が表示されています。
この部分をクリックすると、下記メニューが表示されるので、「Add space」。

ところが、

無料の「Community」プランは
Single space for up to 5 users
となってました。

では、名前だけ変えておきます。

右上「Settings」から。

Step 3: Create the content model

Click the Content Model tab, then Add content type
と書いてますが、Content Model タブをクリックすると、この画面になります。

そこで、ボタンをクリックすると、コンテンツタイプ作成のボタンが表示されます。

フィールド追加のボタンが出るので、クリックして次に進みます。

Step 4: Add information to content model

Textをクリック。

Nameだけ指定して、Create。

こんな感じで追加されるので、同様に、２項目追加。
そして、右上のSave。
こんな感じに表示されるようになりました。

Step 6: Add content

今度は、Contentタブから、データの追加。

Publishすると、

良い感じです。

この後は、いろいろ足してみましょうという話なので、一旦終了。

Location（位置情報）

直近で目的としているのが、住所、位置情報を持ったデータのAPI提供なので、Locationフィールドの追加も確認しておきます。

これを追加した状態で、コンテンツ追加。

データ形式は択一ですかね。
ではなくて、入力方式をどちら行うかを選択するのであり、出力は、緯度・経度の模様。

Previewing an entry

データのプレビューについては、説明が少ない。

Open preview ボタンをクリックするということですが、初期状態ではこの状態で、クリックできません。
ので、その下の「Click here to set up a custom content preview.」リンクをクリックします。

下の、「Set up content preview」をクリック。

これだけではダメ。

「Discovery web app」でプレビューができる模様。
リンクにある下記サイトで、Space ID、Delivery API key、Preview API key を登録。

https://discovery.contentful.com/

Space ID は、Setting の SPACE SETTINGS の、General settings で確認できます。
APIキーは、Setting の SPACE SETTINGS の、API Keys で作る必要がありますね。

何か1箇所変えないとSaveできないので、Nameを変更して、Save。

Discovery web app に戻って、これらの情報を登録すると、こんな表示に切り替わります。

選択すると、画面的に見えるのも良いのですが、API Requests の方で、見えるのも良いですね。

所感

良いかなとは思います。
ただ、これで十分なのか、SaaS型だと拡張性も限定されると思うので、心配ではあります。
実際、使ってみて判断ですね。