はじめに
前回のDiatonic Cheatに続いて、HTML + CSS + JavaScriptで作ったWebアプリをReact.jsで作り直し企画の第二弾です。
半分ネタで作ったアプリです。
画面に表示されたボタンをクリック(タッチ)すると効果音が鳴るという極めてシンプルなアプリです。
タイトルの由来は、オノマトペ(効果音)の鳴るボタンをまとめたサイトであるというノリで付けました。五秒くらいで考えつきました。ジョンレノンの奥さんではありません。
オノまとめ
動画
使い方
-
まず、鳴らしたい効果音のジャンルを選んで
.
-
ボタンをクリック(タッチ)してを出す
使用した技術
- React.js
- TypeScript
前回同様、React.jsを使って制作したことによって以前作ったアプリをPWAとして使えるようになったので利便性が増しました。
今回もまたlocalStorageを活用しています。
一度選んだジャンルを記憶して、一度アプリを落とした後でも再度開くとすでにそのキーが選ばれた状態で表示されます。
まとめ
効果音を鳴らすだけですが、結構遊びやイタズラに使える音が多く入っていると思います。
ただし、イタズラは自己責任でお願いします。
スマホと相性がいいと思うので、PWAでダウンロードすれば使いやすいと思います。
もう一つあるHTML + CSS + JavaScriptで作ったWebアプリもReact.jsでリメイクしたので、そちらの記事も書きました。