本当にすぐに始められる！strapiはエンジニアに優しいCMS

メリークリスマスイブ！
こんにちは、株式会社dottの中園と申します。
strapiアドベントカレンダーも残すところあと２回になりました！

今回はstrapiを使ってみて私が疑問に思ったことなどを実験してみながら、
strapiを理解していきたいと思います！

strapiをすでに使っている方からしたら浅い内容ですが、使ってみようかな？って悩んでる方はぜひ参考にしていただければ！

# なにはともあれQuick Start


といっても実はstrapiを触るのは今回が初めて。
そんな私にぴったりのアドベントカレンダー２日目の記事を参考にとにかくstrapiを動かしてみました。
[【Strapi アドベントカレンダー 2日目】Strapi Quick Start Guide 日本語訳](https://zenn.dev/tomigie/articles/e6c77540fb42f5)

# まじで５分くらいでできる
Quick Startに沿って動かすだけで、strapiってどういうもん？ってのが本当によく理解できます。
モデル定義（strapiではContent-typeというのかな？）の仕方から、モデル同士のリレーションの仕方、APIの作り方までまとまっています。

# 触ってみて気づいたところをまとめていきます
私なりに気づいた点やちょっとつまづいた点をまとめていきます。

### 1.yarnで動かしたほうが幸せ
Quick Startではyarnかnpxで動かせる、とありますが、私の環境にはyarnがまだ入ってなかったので、npxで動作させていたのですが、のちのち、 `strapi install xxx` といったコマンドがうまく動かないなどの状態に陥いりました。（私の環境だけかもしれませんが）
気を取り直してyarnを入れたら全部素直に動いてくれたので、同じように引っかかった方はyarn入れたほうがいいかもしれませんね。

↓こんなエラーでた
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/5918ada1-faa9-fabc-0966-9053378a6fed.png)

### 2.とりあえずQuick StartではSQLiteを使う設定になってる
`./config/database.js`を見てみるとわかりますが、とりあえずsqliteを使う設定になってます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/45b679a1-5544-23b1-33fc-eb5e59be44ee.png)

他のDBに変えたい場合はここをいじるって感じになります。
[公式のDatabaseのページ](https://strapi.io/documentation/developer-docs/latest/guides/databases.html#mongodb-installation)に設定方法とか書いてありますね


### 3.好奇心でデータベース消したらどうなるのかやってみた

Quick Startを終えると、以下のような形でCategoriesとRestrantsというモデルができあがります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/6df2a0f6-4278-2c3b-c3c0-7dd341de45b5.png)

ここでふと、疑問が浮かびました。
がんばって定義したモデルたちは、一体どこに保持されているのか？
もしデータベースに保持されているのだとしたら、検証用、本番用と環境を作るたびに、データベースの内容もいちいち持ってこなければならないのではないか？

**なにはともあれやってみます**
先程のdatabase.jsに記載されていた内容をみると./tmp/data.dbにデータが格納されているようです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/5494ea89-6c6f-7cbb-c920-eedd8a6bc054.png)
これを・・・
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/a7502717-507e-0d57-2108-b25428809e2a.png)
こうしてみます。（本当に消すのはなんだかはばかられた）

**そしてStrapiを再起動します。**

※Quick Startにはないですが、`yarn develop`とコマンド打てば起動できます。

#### すると・・・ユーザー登録画面が出てきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/cd08fe22-fc29-a170-7307-4ecfdfd859f9.png)

これはもしや？やはり一からやり直し？なのか？？？なんて思いながらもユーザー登録をすると！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/af0f8b75-97cc-f7fd-1c8d-fef9d344e6e9.png)

**ちゃんと残ってる！！！**

もちろんデータ自体はありませんが、一生懸命定義したモデルたちは残ってます。
さすがにstrapiさんサイドも**馬鹿にすんな**って感じでしょうけど、私もこの業界では古い人間となってきているのでこういうところが気になってしまいました。

#### モデルの定義はファイルで管理されている
apiってフォルダの中にこんな感じでファイルで管理されてるので普通にgitで管理すれば問題ないってわけですね。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/fb483e35-db33-2f49-5459-2c75211648f0.png)

めでたしめでたし・・・

#### ただし、権限は消える
APIとしてデータを読み出すためにQuickStartで設定した権限の情報は消えてしまっているようです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/b0b1bcd9-904a-5ae6-eaf6-c8e86fa6277b.png)
ここは注意が必要そうですね。（開発に慣れてくれば、真っ先に思いつくところでしょうし問題なさそうです）

### 4.Swaggerどっから吐き出すんだ？
strapi開発チームの方々は「Swaggerが自動で生成されて便利！」とか言ってて、はえーすごいなぁなんて思ってたんですが、実際どこにあるんだろうか？と少し探してみることに。

なにやら、`一般＞マーケットプレイス`のページにDocumentationとかいうものがあります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/7e5cba0c-e1e1-c2be-2ba3-0a1193d89eac.png)
「ダウンロード」を押してみましょう。

※ちなみにここでyarnが入ってないと1で言ってたようなエラーが起きました。

yarnを入れて無事ダウンロードが完了すると・・・

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/0b56b829-5913-e4b5-fcbc-7298b5fd6149.png)

プラグインのところに*Documentation*というメニューが出現！！

右上の「Open the documentation」をクリックすると

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/151088/c74589b7-fa2b-6da8-5558-4bf3603cc013.png)

はい、出ました！すごい！！！
しかもマーケットプレイスと銘打ってるぐらいなので、これからも便利なプラグインがどんどん増えていくことが期待されます！

#### 実際のswagger定義はどこにあるか
ここにあります。
`./extensions/documentation/documentation/1.0.0/full_documentation.json`
これがあれば、Postmanに食わすなり自由にできますね。

# 全体的に触ってみた感想とまとめ
という感じで、QuickStartで理解のしやすさ、作成したものの管理のしやすさ、わかりやすいGUIでなんとなくでも動かせる楽しさを感じることができました。
表題にも書きましたが非常に**エンジニアに優しい**、エンジニアがとっつきやすいCMSだなーと思いました。

さらにさらに、別日のアドベントカレンダーを参考にさせていただきますが、
strapiで実現できることはこんなにもあります！（抜粋）

- strapiの管理画面も独自に作れる [【5日目】 StrapiのLocal Pluginsを利用して独自の画面を作成する
](https://zenn.dev/fullsour/articles/2556127594ec80)
- APIのカスタマイズもできる [【6日目】 strapiで自動生成されるAPIのカスタマイズをする](https://qiita.com/yamagamisan/items/c1053d1ee021e5f30c13)
- Webhookの設定もできる [【15日目】StrapiのWebhook機能を活用する](https://zenn.dev/fullsour/articles/883978314541b5)



本当に気軽に始められて、突き詰めていけばいろんなことができる、そんな素晴らしいHeadless CMS **Strapi**をぜひぜひ体験してみてください！