短音声/音楽登録サービス「Echo-Echo」を公開しました。

掲題の通り、短音声/音楽登録サービス「Echo-Echo」を公開しました。

Echo-Echo

本サービスの実装にあたって数点書き記しておきます。

参考

― Echo-Echo

目的

「Echo-Echo」の開発にあたっては、いくつかの背景があり基本的に以下の内容を達成したかった。

  • 2023年Denoに入った機能、Deno KVとDeno Cronの実践投入(他にDeno Queueなどあるが今回はスキップ)
  • Fresh x hono の実践投入
  • daisyUI の素振り

これを目的にするにあたり、必然的にストレージはDeno KVを使い、ジョブスケジューラはDeno Cronを採用した。

以前なら、truso をメインのDBにして、ジョブスケジューラはupstashのqstashを採用するなどしただろう。
2023~2024年のDeno 及び Deno Deployはこれらの外部サービスに必ずしも頼らなくていい環境が整いつつある。
これらを実践投入したかった。

機能内容の背景

保存の内容は、Denoハンズオン＆もくもく会：Fresh + KVに伺った際、少し相談などさせてもらっていた。
特に具体的な内容ではなくて、「KVでトランザクションを組めるキー数を越えた容量の保存ってできますかねー」みたいなもの。
結論ベースでいうなら、難しいというところと、フェアユースのルールに抵触しなければというところであまり容量を許容するのはやめた。
この時点で、低容量で定期的に消すという構成が確定した。
(あとは投稿内容をイチイチチェックするわけでもないし、永続的な保存を許す気はなかったけれども。)

構成

  • デプロイ先： Deno Deploy
  • ストレージ： Deno KV
  • ジョブスケジューラ： Deno Cron
  • フレームワーク：Fresh、Hono
  • CSSライブラリ： tailwindcss、daisyUI

この構成でトライした。

ソースコード

Echo-Echoのソースコードは公開しています。
プルリクは歓迎だし、ローカルでももちろん動くので、ぜひ触ってみて欲しい。
kivi を入れると、データの登録状況も見やすい。

よかったこと

  • Deno KV の使いようを実践レベルに落とし込めた

    • RDB脳とはスイッチしなければならない、キャッシュ以外のKey-Valueストアの使いようの一端をつかめた

  • Fresh x Hono は、やはり使いやすい

    • 参考にさせていただいたayameさんのLTを聞けて本当に良かった
    • 改めて感謝

  • Hono csrfを参考に、CSRF対策を独自実装した

  • daisyUI は、他を積極的に選ぶ理由が無ければ是非次も採用したい

    • これのおかげで、36時間くらいで全体の実装が完了したといっても過言ではない
    • Fresh 1.6 に tailwindcss プラグインが入ったことで tailwindcss 用プラグインを使うパターンが有効に使えるようになった
    • Denoハンズオン＆もくもく会：Fresh + KV でCSSライブラリについて、Flowbite がいいという話が聞こえたのもあってピンときたというのもある

Next action

実は、hono/openapi を絡めたうえでのhono RPCモードが、エディタで型が解決しない状況になってしまっている。
公式にはできるとしているので、何か書き方が悪い/理解できていない点があると考えている。
この点はうまく作りきれなかった点で、openapiを使わない場合綺麗に解決する見込みあはあるのでそちらに近々書き換えも考えたい。
(TSを使う利点が生きていないというのもある。)

直った!ので追記

後はXへのシェアとOGP作成機能のようなものは作る想定。

一通り作ってみて

それぞれ、作り切る中で学びが良かったのはとてもGood。
daisyUIを触った中で是非次も採用したい。
ただ、どちらかというとポップめなデザインではあるし、もう少し固めのデザインのものをもう1つ当てにできるものを用意しておきたい。
管理画面で使うようなものは、用意したい。
雰囲気でいうなら、cloudscapeのようなものをtailwindで構築できると嬉しい。
「自分で作る」というのが望ましいだろうけども。(が、決して得意ではないのでパートナーが欲しいなぁ。)

では。