今回はフロントエンド言語を使ってWebアプリケーションを作成しました。

『Camp Bonfire』

https://shibaemon.com/bonfire/

CRUD系のデータ管理アプリではありませんが、

ユーザー体験としての癒し系Webアプリを構築したいと前々から練っていました。

トップ画面と焚き火画面というシンプルな構成です。

『Camp Bonfire』操作方法

トップ画面のClickと矢印が表示されているテントをクリックします。

すると、次の画面で焚き火のシーンが自動再生されます。

動画の下に再生ボタンがあるので、再生の▶︎ボタンを押せば焚き火の音が出ます。

もし動かない場合は、ブラウザのJavaScriptを有効にしてみてください。

『Camp Bonfire』アプリケーションの構成

シンプルな構成にしたいと考え、JavaScript/HTML5/CSSを使っています。

トップ画面の動く矢印と焚き火はJavaScriptで作られています。

ぜひ、楽しんでみてくださいね!

それでは良いWebライフを!