AI Study App

リポジトリ

OPENAI_API_KEY、Dockerがあれば誰でも利用できます。

設定ファイルを整えたら docker compose up -dで起動できます。

AIエージェントを利用して課題を生成するアプリです。

過去の解答履歴や保存されているメモなどをエージェンティックに検索し、苦手な分野の課題を生成する機能も備えています。

データベースからユーザーの苦手分野を分析して課題を生成するモード

課題項目からランダムに問題を生成するモード

学習ログを記録する。

1日1ログを記録できるようになっている。

また、AI Modeではこのログを参考にして課題を生成することもある。

間違えた問題の履歴を参照する。

課題項目ごとに表示することも可能。

また、解説ボタンを押すことで間違えた問題の解説を取得することができる。


言語	TypeScript
主要フレームワーク、ライブラリ	Vite+React、Mantine、React MD Editor

任意の課題を生成することが可能です。

backend/data/conf/.fields に改行区切りで生成したい課題の項目を指定します。

科学英単語
技術英単語

課題を作るための資料を backend/data/markdown に配置することで、AIエージェントが要点抽出をしたレポートをコンテキストに加えられるようになるので、課題の質を向上させることができます。

データ構造やUIはできるだけシンプルに実装し、コアとなる課題生成の仕組みを重点的に実装しました。

とくにUIは初見でもすぐに始められるような、わかりやすいデザインにしました。

課題生成では任意の課題項目を指定できるパラメーター設計を心がけました。

他にも、間違えた問題について解説させる機能も追加しました。

解説ボタンを押すと解説が始まります。

このアプリは当時（2025年）話題になっていたMCP（Model Context Protocol）の勉強を兼ねて作成しました。

コードの質はまだまだ至らないところがありましたが、サービスとしてはよいものが完成しました。

作成した当時のモデルはgpt-4系しかなかったのであまり良い生成結果が期待できませんでしたが、現在（2026年06月）のモデルは質のいい課題を生成してくれてる印象です。

コーディングエージェントを使わずに幅広い技術スタックを活用し、自力でひとつのアプリを完成させたのは私にとって素晴らしい経験となりました。

あとは余談ですが、Vite+ReactでパッケージマネージャーにはBunを採用したことにより超快適な開発環境を構築できていました。

mantineも簡単にページをレイアウトできるので技術選定も上手くいっていたと感じます。