![見出し画像](https://assets.st-note.com/production/uploads/images/130289938/rectangle_large_type_2_729000d5afa133b4a041bf5bba95e8bc.png?width=1200)
ChatGPTと作るwebアプリ!曜日計算テスト チュートリアル編
みなさん、こんにちは。Calendar Watcherの鈴木です。寒い日が続きますが、いかがお過ごしでしょうか?
私といえば最近ChatGPTに手伝ってもらいながら会話形式でwebアプリを作ることに面白みを感じていまして、これまでにもいくつか作ってきているのですが、その経験を重ねるうちに、自分でもこれは!と思うようなものがいくつかできてきました。
そして今回ご紹介するのは、そのうちのひとつ「曜日計算テスト(Day of the Week Calculation Practice App)」です。
![](https://assets.st-note.com/img/1707108888650-o2PGU4QjdJ.jpg?width=1200)
アプリの概要
アプリはランダムな日付(グレゴリオ暦1年1月1日から9999年12月31日まで)を20問出題するので、ユーザはそれらに対して正解と思う曜日を回答します。曜日計算法、とくに指カレンダー(指を使った曜日計算法)の練習を目的とするアプリです。指カレンダーの使い方については私の過去記事を参照してください。
非常にコンセプトが明快な使いやすいアプリとなっており、実際私も指カレンダーの練習に利用しています。(アプリは一問あたりの平均回答時間を計算して表示してくれるので、それが上達の目安になります。)
私は過去に同様のアプリを作成、公開した実績がありますが、上述のように、今回はChatGPTと協力して練り上げていった作品になります。とはいえ、コーディングについてはほぼほぼChatGPTが担当してくれました。なので正直、コードの中身については私もよく分かっていません。ワークフローとしては、
ChatGPTに対して自分が作りたいアプリの内容を説明する。
ChatGPTがコードを実装する。
私がコードを実行し試してみる。
私が改善点や問題点を見つける。
ChatGPT(ときどき私)が解決策を考える。(ステップ2へ戻る。)
というようになっていて、これを私が納得した、あるいはいいと思うまで続けます。
対象ユーザー
このアプリは、グレゴリオ暦の曜日計算法をすでにどこかで知っていて、その計算法を練習したい人、とくに、指カレンダーの使用者を対象にしています。
日付の範囲
日付の範囲はグレゴリオ暦の1年1月1日から9999年12月31日までです。ただし、コードがどのような計算法で曜日を計算しているかについては不明です。私がアプリを使ってみた経験としては、その謎計算はツェラーの公式(よく知られた曜日計算式)と答えが一致しています。
使い方
「Start」ボタンを押すことで、ランダムな日付が20問出題され、同時にタイマーが計測を開始します。
![](https://assets.st-note.com/img/1706856763214-k1bSgC23FN.jpg?width=1200)
ユーザは各日付に対して、正しいと思う曜日をドロップダウンメニューの中から選んでいきます。
![](https://assets.st-note.com/img/1706860379044-uZlMK1tIh1.jpg?width=1200)
全部答え終わったら「End」ボタンを押します。
![](https://assets.st-note.com/img/1706861678701-pWSvlsQejL.jpg?width=1200)
すると、アプリはユーザの回答が正しいか判定し、間違っていたら正解を教えてくれます。
![](https://assets.st-note.com/img/1706861717980-k9ka8NpEoq.jpg)
同時に、ユーザが20問回答するまでにかかった時間と、一問あたりの平均回答時間を表示します。
![](https://assets.st-note.com/img/1706861836456-zqtDVwzjkH.jpg?width=1200)
その後ユーザは「Retry」ボタンを押すことで、新たな問題に挑戦できます。
![](https://assets.st-note.com/img/1706862215384-XvBsiLqhcD.jpg?width=1200)
結び
いかがでしたでしょうか?使い方としては以上となります。このように非常にシンプルな機能で、特段変わったことはない、曜日計算の練習用アプリです。ただ、その実装担当はAIであり、すらすらとコードが書き出される様はやはり見ものでした。ちなみに、同じ目的のアプリをScratchで作ったりもしている(実装担当:私)ので、気になる方はそちらのほうもプレイしてみてください。こちらの方はSF的な世界観とエンターテインメント性を加味しております。
![](https://assets.st-note.com/img/1707451099881-CK8QMFkkuF.jpg?width=1200)
この記事が気に入ったらサポートをしてみませんか?