目次 閉じる
Todo管理アプリ
こんな感じでポートフォリオに載せると「何ができるアプリか」「どんな工夫をしたか」が一目で伝わります。
概要
シンプルで直感的に使える Todo管理アプリ を開発しました。
ユーザーはログイン後に「ボード」を作成し、その中に複数のタスクを登録できます。各タスクには締切や画像を設定でき、さらにコメント機能を通じて他ユーザーとやり取りが可能です。
アバターによって投稿者が一目でわかるUIを意識し、使いやすさを重視しました。
主な機能
- ユーザー登録 / ログイン / ログアウト（Devise）
- ボードのCRUD（作成・閲覧・編集・削除）
- ボード内タスクのCRUD（画像・締切つき）
- タスクへのコメント投稿 / 閲覧
- アバターの設定・変更（未設定時はデフォルト画像）
使用技術
- フロントエンド : Haml / SCSS / JavaScript
- バックエンド : Ruby on Rails (Deviseによる認証)
- データベース : PostgreSQL
開発背景
Railsの学習過程で、「単なるTodoリスト」ではなく、他ユーザーとの共有やコミュニケーションを意識したタスク管理 をテーマにしました。
初学者として、CRUD・認証・画像アップロードなどの基本機能を組み合わせ、実務でも応用できるよう時間をかけて開発しました。
画面イメージ
（ここにスクリーンショットを並べる）
- ログイン画面 / サインアップ画面
- Deviseを使った認証機能
- ボード一覧画面
- 作成したボードがカード形式で表示
- 作成者のアバターを表示
- タスク一覧画面
- ボード内のタスクが画像つきで表示
- コメント数や参加ユーザーも確認可能
- タスク詳細画面
- 締切日、添付画像、コメント一覧を表示
- コメントにはユーザーアバターが付与され、視覚的にわかりやすい
工夫したポイント
- アバターによる直感的なUI : コメントやボード作成者が一目でわかる
- シンプルな操作フロー : 「ボード → タスク → コメント」と階層構造で整理
- 見やすいレイアウト : Haml/SCSSを使い、余白やカードUIを意識