自作のアクセスカウンターを作りたい
moe-counterみたいなものを自作したい
このリポジトリがやっていることは結構シンプルで、
GETリクエストを受け取るとDBからcountを取得
グローバルの変数に値を書き込んでプロセスが生きてる間はキャッシュ
値をDBにpushする
countに合わせた画像をsvgに埋め込んで返す
ここから制作メモ
DBはneon使う、自分用だから無料で大丈夫のはず
テーブルは参考リポジトリ真似する
id, name, countカラムがあれば良いはず
カウント画像はAIで作りたい
https://gyazo.com/0884de6410dcbd919c5c6645889a0ed3https://gyazo.com/4e3c14791cbd7dd3a3f0fbac27710379https://gyazo.com/8b22de5327606e5d8ae1d6c6d5dd9a83
2まで作って上手く出力ができなくなって困った
https://gyazo.com/f77e428f62b0586d5b81897d2ec36b36https://gyazo.com/79634032b4a0dc2ee8c1153197d17e52https://gyazo.com/2b27e0b9a5f403356d2e838c5e782a97
パターンが尽きた。
意味不明な装飾が出てくるので、ある程度参考にして自分で書いてもいいかも
ここで作ったキャラがかなり好みなのでこれを基準にしたい
https://gyazo.com/deb30df842c471cf7e4ec7c1d284e693https://gyazo.com/757e14595e2f1b81a206f7e74af8c41chttps://gyazo.com/61d2d1db26af168e43508a42902d60c4https://gyazo.com/7bdc6ecdcfa5f38ac4ad8c9756eadd56https://gyazo.com/012b0d2db3a38f8b1846a167aadeb71ehttps://gyazo.com/6d39924983e62e6d322de20c4d909bbf
微修正して減色するといい感じだけど数字が見えない…
普通にミニキャラ描いてもらって、見えやすい大きさのフリップを加筆するのがいいかも
https://gyazo.com/50dd5f4c7d2bbd75fa1f39aa14288144
かわいい
10枚求めてるクオリティのイラスト出せなくて疲れた
とりあえず仮の画像でアクセスカウンター作って後で差し替えるか…
hono + cloudflare-workersで作りたい
最初はnodeサーバーでプロセス生きてる間はキャッシュ残してDBのread減らそうとか考えてたけど上記の構成でやるならd1で良い気がした(触ったこと無い
追記
d1のproduction環境に値が反映されなすぎてわからんのでやめた
edgeランタイムで実行されると同時アクセスで数値がブレるのも嫌かも
honoでアプリ自体は出来たのでnode向けに書き直してvercelにデプロイするのが丸そう
nextjsに乗っかる関係で/apiから始まるパスが矯正されるのが少し嫌だ