調子を管理するWebアプリをリリースしました

2022-08-08

たいちょ

毎日の調子を入力して確認することができるだけの Web アプリです。

現時点でクオリティは α 版以上 β 版未満くらいですが、最低限の機能は乗っかっていると思います。

ぜひ使っていただいて、フィードバックをもらえると嬉しい限りです。


今回本アプリの開発に至ったのは、妻から毎日の調子を管理するアプリがほしいと頼まれたのがきっかけでした。

そこで、そろそろ制限の少ない Serverless なアプリを自分一人で作れるようにならないとあかんよなと思い、頑張って作ってみました。

今回も開発自体は 1 週間かからずくらいとなっています、まだ完成とは言い難い出来ではありますが…。

今回使用した技術は以下のとおりです。

  • Next.js
  • Radix
  • Strapi
  • Vercel
  • Heroku
  • npm workspace
  • Firebase Authentication
  • PWA

ざくっと解説をば。


Radix

Radix は React のコンポーネント集で、最近少しだけ流行っているようだったので部分的に取り入れてみました。

フロントエンドロードマップ にも記載があるので、安心して使えました。

フレームワークという感じではなく、本当に必要なコンポーネントだけを導入することができるスタイルで、1 つ 1 つのコンポーネントがしっかりと作り込んである感じもあり、とても使いやすかったです。

Strapi × Heroku

まさか自分が Strapi を再度使うときが来るとは思いませんでした。

というのも、過去一度業務で Strapi を使用したことがあったのですが、型はないわ UX は悪いわで散々な目に会って『二度と使うか!!』と正直思っていました。

今回も Serverless で作ることを決めた際、データベースをどこに持たせるか考えたのですが。

Contentful だと使い慣れているし型も強いのですが、いかんせん 25,000 レコードという上限があるので、今回の仕様には合っていないと思い見送りました。

続いて前々から気になっていた Fauna を使用しようと思い、実際にある程度開発を進めていたのですが。

Fauna って驚くことに、update 系の api が公開されていないんですね…。

一応問い合わせた場合には api を公開すると公式ドキュメントに書かれていたので、問い合わせて公開してもらったんですが。

いかんせんその機能がまだ正式リリースされておらず、自分の環境では不安定極まりなかったので使用を諦めてしまいました。

ざっくり触ってみた感じでは良さそうな感触だっただけに、結構残念でした。

ということでさぁ困ったぞとなってしまったのですが。

色々と調べていくうちに Stapi も当時からかなりアップデートされているらしく、悪くなさそうな雰囲気を感じたのでもう一度だけ使ってみることにしました。

で、結論から書いてしまうと、まだかゆいところに手が届かない感じはあるもののある程度の使用には耐えうるかな、というのが現時点での自分の印象です。

好印象なポイントとしては以下のとおりです。

  • ローカル環境のレスポンスが良い
  • UI UX がわかりやすい
  • Heroku などデプロイに関する公式のドキュメントがよくまとまっている

逆にイマイチなポイントは以下のとおりです。

  • 型の生成が甘い
  • 公式のドキュメントが一部古い
  • npm パッケージが弱い

とくに型の甘さから、ひいては npm パッケージがしょぼいのはもう少し頑張ってもらいたいなーと思いました。

Next.js の api から axios を叩いて Strapi にアクセスしている状態なので、Contenful を見習って api のコールをラップするパッケージくらいはほしいですね…そうしたら Rest なり GraphQL なりをそもそも意識する必要がなくなるので、開発的には非常に楽になると思いました。

とはいえはじめて Heroku も使いましたが、ほんと抵抗感なく導入できたのは Strapi 公式のドキュメント様様です、ありがたや。


そんな感じです。

フロントからバックエンドまで一貫して 1 人で作れるようになったのはデカイよなーと。

今後もちょっと規模感の大きめの Web アプリを作る場合は Next.js × Vercel × Strapi × Heroku の組み合わせで作っていこうかなーと思っています。

一応今回もリポジトリを公開していますので、参考になりましたら。

ただ今回はあまり実装が綺麗にできていないので、あしからず…。

© 2018 kk-web