クソアプリ Advent Calendar 2022 カレンダー3 の22日目の記事です。
二番煎じ
2022年に流行ったwordle
英単語が苦手な私は流行に乗り遅れたので悔しくてつくりました。
ラーメン二郎ならきっとできるはず
(Noodleといっていますが、ラーメン二郎限定です。)
こちらから遊べます!
Noodle
チートシートはこちら
ラーメン二郎まとめ 宅麺様
画像の利用について
今回ラーメンデータベース様から画像を借りています。
許可いただきありがとうございます。
利用した技術
vite + react + emotion
今回簡単なアプリなので、技術的なことはあまり書くことがありません...
勉強になったこと
入力後の色の移り変わりについて
animation-fill-modeを使うことで
CSS アニメーションの実行の前後にどう対象にスタイルを適用するかを設定できます。
くるっとしてから、色が変わるようにしたかったのでjsでアニメーション終わるのを検知して...とやろうとしましたがanimation-fill-modeでやりたいことができたので助かりました。
まだまだ知らない便利なCSSプロパティありそうですね...
妥協したこと
失敗時の処理
本家に倣って6回入力できるようにしていますが、二郎自体がそれほど多くないのでそもそも6回入力するパターンが少ないです。
なので、6回失敗したときの実装は省きました。
極端に単語数が少ない場合は、存在しない単語入力も可能にするのがゲームバランス的にいいのかなと思いました。
独自ドメイン
クソアプリで独自ドメインとるの大変だしいいかと思って妥協しています。
調べたところ、無料で独自ドメインを取得できるかもしれないサービスがありました。
Dot TK
ニュージーランドの領土であるトケラウの国別コードトップレベルのドメインらしいです。
今回のような一時的に公開したいクソアプリにぴったりかなと思いました。
苦労したこと
正解データを集めるのが大変でした。平仮名を手入力したのですが、
新宿小滝橋通り店のおたき?こたき?とおり?どおり?
池袋東口店のくち?ぐち?
などどう読むか分からない店舗がいくつかあって毎回調べるのが大変でした。
あとがき
かなしいことですが、Noodle制作中にラーメン二郎 茨城守谷店が閉店してしまいました。
解答データから省くときには涙がこぼれ落ちたものです。
茨城守谷店様、今までとてもおいしい二郎をありがとう、お疲れ様でした。