概要
このプロジェクトは、タスク管理と生産性向上を目的としたウェブアプリケーションです。ユーザーは、タスクの作成・管理ができ、ポモドーロタイマーを使用して作業時間と休憩時間を効果的に管理することができます。ログインすることで、タスクや設定の情報を長期的に保持でき、統計情報の取得もできます。ログインせずに、ゲストユーザーとしても使用できます。また、Youtubeのプレイヤーが埋め込まれており、お気に入りの再生リストを再生することが可能です。
背景
私の友人は休日に個人開発を行っています。一人で作業する環境では作業と休憩が曖昧になりがちです。作業の途中で他のことに目移りしてしまったり、休憩の時間が長引いてしまったりと集中力の維持が難しくあります。特に作業中でも休憩中でも、動画を流し好きな音楽を聞いていたりすると途中で動画サイトが気になりいつの間にか動画を見続けてしまうこともあります。 私も現在一人での学習時間が多いため、共感できる部分が多くありました。そのため、これらの問題を解決することで効率よく作業を進められるようにしたいと思ったからです。
要件
- タスク管理機能: タスクの作成、編集、削除、完了を管理しやすいインターフェース
- ポモドーロタイマー: 作業時間と休憩時間を設定でき、タイマーで通知することで、集中と休憩のメリハリをサポート
- 音楽再生機能: お気に入りのプレイリストの URL を登録して再生できる
- 統計グラフ: タスク完了状況や作業時間をグラフで可視化し、作業効率を意識できる
実装の流れと学んだこと
views
UIの構築にBladeテンプレートエンジン、Bootstrap、JavaScriptを使用しました。Bootstrapの使用がはじめてでしたが使いやすく簡単に良いデザインに整えることができました。また、jQueryを使用しタスクの順番をドラッグ操作できるようにしました。
データベースの接続とマイグレーション
ユーザー認証機能を実装するためにLaravel Breezeを使用しました。ユーザー登録、ログイン、パスワードリセットなどの機能を迅速に構築することができました。
ログインしていないゲストユーザーのためのセッションidを作成しました。
コントローラーの作成
ログインユーザーとゲストユーザーでデータの管理を分岐しました。
APIリクエストとテスト
外部クライアントからのAPIリクエストを処理し、テストを行いました。
- requestの作成: 新しいタスクの作成や既存タスクの更新に対するリクエストを処理するためのRequestクラスを作成しました
- validateの実装: Requestクラスを使用して、入力データのバリデーションを行いました。タスクのタイトルが必須であることや、入力データが適切な形式であることを確認しました
- APIテスト: Talend API Testerを使用して、APIの動作をテストしました。正常系の際に正しくプログラムが実行されることを確認しました
結果
無事、期待される動作をするアプリケーションを作ることができました。今後、統計機能の実装のためのライブラリを学んで機能の追加、実装を試みて行きたいと思います。