技術の話

技術構成

クイズ生成アプリ　

AIにクイズを作ってもらって知識を身につけよう！

工夫したところ

• クイズの配列を用意するのではなく、AIに生成してもらうようすることで、総問題数の制限をなくした
• 回答を一時的に表示できるようにした
• すべての回答の表示非表示を切り替えられるようにした

詰まったところ

• OpenAIの導入がうまくいかなかった
• 配列更新のプログラムの理解に苦しんだ

TODO管理アプリ

タスク管理できるアプリ

工夫したところ

• 完了したタスクの取り消し機能をつけた
• タスクのidをuuidで生成した
• フォームに何も入力されていないときに追加ボタンを押しても追加されないようにした

詰まったところ

• useStateの扱い

家計簿アプリ

• 日々の支出入を記録できるアプリ
• 記入した内容が週間・月間・年間でグラフ化されたものを，見ることができる．

工夫したこと

• グラフを表示して支出入の様子を可視化した．
• グラフの横軸表示で，タブを開いた日を必ず右端に来るようにして，週間なら直近7日間，月間なら直近30日間，年間なら直近1年間のデータをしっかり表示するようにした．（例えば月間グラフで日時（横軸）を，1，2，‥‥，29，30と固定すると，1日や2日に表示するとその日以降は空欄になりほとんどグラフが表示されなくなる．このようなことが起こらないようにした．）

詰まったところ

• Next.jsでlocalStorageを使ったため，サーバ側にデータが無いことで発生した「Hydration Error 」に苦しめられた．useStateを用いて対処した．

その他の話

目標

• 全員が全員がwebアプリの基本構成がわかる・実装できること

そのために

• 全員フルスタックで開発しよう
• できたね　LTしようね　継続開発もしようね

おまけ

メンターするつもりだったけどみんな自走してたから隠しコンテンツ作りました さがしてね