JavaScript-Toy-Box

JavaScript 関連のサンプルコード

SpeechRecognition

SpeechRecognitionを利用しブラウザのマイクから入力された音声をテキストに直し表示するサンプル

express-redis-socketio-redis

socket-io を使ったチャットを複数サーバから行うために redis を用いた例

react-firebase-sample

React アプリから Firebase Realtime Database を利用するサンプルコードと合わせて Firebase Hosting にデプロイ例

react-chart

React でreact-chartjs-2,chart.jsを用いたグラフ描写

react-drag-and-drop

React でreact-beautiful-dndを用いた要素のドラッグアンドドロップ

react-query

react-query の実装サンプル

react-router-context-sample

BrowserRouter,Context を使いグローバルでデータの保持、ログイン、画面遷移、ログアウトの簡単なサンプルアプリ(CSS は Tailwind を利用)

react-notification-badge

通知バッジ（ベル、メール）の実装例

react-context-reducer-counter

React Context + Reducer でのカウンターアプリ

vanilla-counter

vanilla な JavaScript で couter アプリを class,function での実装例

redux-counter

redux で couter アプリの実装例

node-twitter

標準入力から Tweet をするサンプルアプリ

node-http

node での http サーバ

react-redux-toolkit

create-react-appのテンプレート--template reduxを順を追って作成する

three-example

three.js での実装例

puppeteer-sample

playwright-sample

openweathermap-sample

tips

JavaScript の Tips 集