ゆっくりしていってね
研究室には、データセットの公開ダウンロード機能に加えて、誰が何回ダウンロードしたかを記録する必要がありました。その結果、このプロジェクトが生まれました。
CITE Lab MoCap and Humanoid Group Download Center
ダウンロード画面
管理バックエンド
当初は、自分が使い慣れた FastAPI + SQLite で実装しようと考えましたが、以下のプロンプトをそのまま AI（Claude 3.7 Sonnet）に与えたところ、非常に実用的なコードが得られました。主なバグは2つあり、1つはSMTPメール送信時に暗号化が使われていなかったこと、もう1つは NJU Box のバージョンが古すぎて、対応する Seafile API を手動で探さなければならないことでした。
FastAPIとJavaScriptなどのテクノロジースタックを使って、研究室のダウンロードセンターのウェブページを作成してください。以下の機能が必要です：
1. バックエンドでSeafile APIを使用してストレージリポジトリ内のファイル一覧を取得し、フロントエンドでは最初の行にドロップダウンメニューで各ファイルを表示し、ユーザーが対象のファイルを選択できるようにします。
2. フロントエンドの2行目では、ユーザーがメールアドレスを入力する欄を設けます。教育機関または学術機関のメールアドレスであることを必須とし、入力欄の右側に「認証コード送信」ボタンを配置します。ユーザーがクリックすると、バックエンドがSMTPサーバー経由で認証コードをメールに送信します。フロントエンドとバックエンドの両方でメール形式の妥当性をチェックし、各IPアドレスは1分間に1回までしかメールを送信できません。
3. フロントエンドの3行目では、ユーザーが認証コードを入力する欄を設けます。
4. 4行目では、学校・所属機関を入力する欄を設けます。
5. 5行目では、氏名を入力する欄を設けます。
6. すべての入力欄は空欄不可であり、フロントエンドとバックエンドの両方でバリデーションを行い、悪意のある送信を防ぎます。
7. 最後の行には「送信」ボタンを設け、クリックされたらバックエンドが認証コードが正しいか確認し、Seafile APIを使用して対応するファイルに共有リンクを生成し、そのリンクをユーザーのメールに送信します。同時にフロントエンドは自動的にそのリンクに移動します。
8. また、バックエンドはSQLiteデータベースにレコードを挿入し、ファイル名、メールアドレス、学校・所属機関、氏名、共有リンク、送信日時を記録します。
9. インターフェースは英語表記です。
10. ページは可能な限り美しくデザインしてください。
11. 最後に、このプロジェクト全体をDockerイメージとしてパッケージするためのDockerfileを記述してください。
しかし、これではインターフェースがやや地味で、拡張性もあまり良くありませんでした。そこで、より先進的な Next.js を使ってこのプロジェクトを再構築することを考えました。しかし、既存コードを参考に再構築させるか、あるいは初めからプロンプトを与えるかに関わらず、AIが出力するコードは非常に質が低く、コンパイルエラーさえ発生しました。最新のいくつかのAI IDEを試しても、満足のいく結果は得られませんでした。
結局、最終的には人間の手に頼るしかありませんでした。1日かけてまずフレームワークを構築し、以前の FastAPI 実装の各ファイルを順次 AI に渡し、現在の Next.js プロジェクトに対応する機能を参考にして完成させました。その後、少しずつ小さな機能改善を指示しながら、手作業でバグ修正を繰り返し、ようやく上記の2つの画像のような成果物を得ることができました。
現時点で実装済みの機能：
- 技術スタック：Next.js + TypeScript + Tailwind CSS + Ant Design + Seafile API + MongoDB + Redis
- フロントエンドにダウンロード画面を提供し、ユーザーは複数のファイルを選択してダウンロード可能。
- 教育機関／学術機関のメールアドレスのみを許可し、正しいメール認証が完了した後でのみダウンロード可能。
- ダウンロード条件を提示し、読了後のみ続行可能。
- バックエンドでユーザーのダウンロード履歴を記録（ユーザー名、ファイル名、ダウンロード時間など）、管理バックエンドを提供して閲覧可能。
- ファイルは Seafile（NJU Box）に保存され、このプロジェクトはユーザー向けに一時的なリンクを生成するのみで、直接ファイルリンクを公開せず、サーバーのトラフィックを節約。
- Seafile内の readme.md ファイルを解析し、ダウンロード画面に表示してファイル説明として利用。
- サブパスの設定をサポートし、既存のウェブサイトに統合可能。
- ダークモードをサポート。
- メールアドレスからAIを使って組織名を解析。
@阙：「使えないAIなんてない。ただ、それ以上に頑固な人間がいないだけだ。」