claude-todo-app

HTML / CSS / JavaScript だけで動くシンプルな ToDo アプリです。ビルドやインストールは不要です。

機能

• タスクの追加（入力して Enter）
• 完了・未完了の切り替え（チェックボックス）
• タスクの編集（テキストをダブルクリック、Enter で確定・Esc で取り消し）
• タスクの削除（✕ ボタン）
• 「すべて / 未完了 / 完了」の表示切り替え
• 完了済みタスクの一括削除
• ブラウザの localStorage に保存（再読み込みしても残ります）
• ダークモード対応
• 期限の設定（期限切れは赤、今日までのタスクは強調表示）
• 削除の取り消し（削除後 5 秒間「元に戻す」）
• 達成率バー（完了件数と % を表示）

課題 2：追加した 3 つのアイディア

#	誰の	どんな課題を	どう解決するか
1	締め切りのある課題や用事を抱える学生・社会人	いつまでにやるべきかが分からず、気づいたら締め切りを過ぎている	タスクに期限を付けられるようにし、今日までのタスクは強調、期限切れは赤で表示する
2	スマホで片手操作する人	✕ ボタンを誤タップして、タスクが消えて戻せない	削除後 5 秒間「元に戻す」ボタンを表示し、押せば元の位置に復活させる
3	やる気が続きにくい人	どれだけ進んだかが見えず、達成感がない	完了件数と達成率（%）をバーで表示し、進み具合をひと目で分かるようにする

使い方

index.html をブラウザで開くだけで使えます。

GitHub Pages で公開する場合は、リポジトリの Settings → Pages で Branch を main、フォルダを / (root) に設定してください。

ファイル構成

index.html   画面の構造
style.css    見た目
app.js       動作（追加・完了・編集・削除・保存）