うさぎのメモ帳

Strapiの特徴

2019年09月20日 - 2019年09月24日

Strapi (読み方はストラピ?)は Headless CMS です。
このメモ帳も Nuxt と Strapi で作られています。

最高すぎるところ

  • 動作が早い
    とにかく管理画面の動作が早く、思考の邪魔をしない。システムとして理想的。最高。

  • GraphQL面白い
    いつかは触りたいなと思っていたものの、はじめ方がよくわからなりませんでした。Strapiならコマンドひとつでプラグインを導入すればあら不思議、GraphQLが使えるようになったのです!

  • DB構造がシンプル
    WPの場合は投稿・固定ページ・カスタム投稿もすべて wp_posts テーブルで管理されるので直接操作しようとすると中々の手間になります。Strapiなら追加したコンテンツ (Content Type) ごとにテーブルがひとつ追加され、RDBの設計として簡単に情報を管理することができます。
    例えばこの『メモサイト』では Memo という CONTENT TYPE を追加しているのですが、そうすると複数形memosのテーブルが作成されて、1メモ1レコードとして適切に管理することができます。

Table (memos)

残念なところ

  • デプロイが超絶に面倒
    このサイトは Nuxt x Strapi で作られているのですが、どちらもデプロイ面倒じゃないですか?Nuxt は静的サイトなら簡単だし Strapi は Heroku なら簡単かもしれませんが、どうせなら SSR でしたいし、Strapi の方も Netfly or Firebase と Heroku でサービス分けたりするのも管理が面倒だったりしそうだし、どちらも now でデプロイできれば一番楽かとも思ったのですが、現状は無理そう…。
    このサイトは DigitalOcean で $5/月 のサーバを LEMP からはじめて、Nuxt と Strapi を同じサーバで動かしています。

  • 更新内容のドラフト保持ができない
    入力した内容を保持しておくことができず、すぐに公開する選択肢しかありません。これは改善される兆候がありますが、現状はネックになります。このようなメモサイト的な使い方なら問題ないですし、公開するかどうかのチェックボックスをひとつ付けて取得時にフィルタリングすればいいだけではありますが、実際のCMS運用では事前に知っておきたいところです。

  • Latexが使えない
    リッチテキストでバックスラッシュがエスケープされてしまいLatexが使えませんでした。ひとつのメモである 二点間の距離を測るには Math.hypot(x, y) が便利 では waylonflinn.github.io/markdown-it-katex/ で作成した画面をキャプチャして対応しました。

  • 入力内容の一部が保存されずに消えることが多い
    リッチテキストの入力中、入力しているテキストエリアのテキスト裏で保持しているテキストが異なっているのか、保存時に一部の文言が消えけてしまうことがよくあります。恐らく日本語入力の処理に不具合がありそう。
    現状はテキストエリアからフォーカスを外す前に適当なローマ字を1字打って消す、とするとうまく保存されそうです。

  • 入力中にページ移動してもアラートがでない
    一瞬で入力内容が消えます。こまめに保存の代わりに、こまめに全文コピーをクセにしたいところ。

残念なところが多いけど?

そういう細かいところは重要じゃなくて、超快適なGUIを操作するだけでバックエンドが作れるってことが衝撃的なんですよ。データ入力も快適そのもの。テーブルを作ってフィールドを付け外してテーブル同士を関連付けたりして、RESTでもGraphQLでも使ってその情報を取ってこれるシステムをGUIだけで作れます。さらにDBは SQLite / MongoDB / MySQL / Postgres と好きなの選べて、直接SQLでDB操作しても動くとか。ぜひとも使いたくなるでしょ。

もちろんWPでもそういったものは作れるし、最近は記事を書いたら既にAPIになっていたりとかもしますが、あのテーブル構造は管理しきれないと思いませんか? 仕方ないとは思いますが…。

ってWPもGraphQL動くんかい!いやいや私は、WPはACFあってのものと思っているので、あれがGraphQLでうまいこと取れるようなら…って取れるんかい!WPスゴいな!

以上。