contentみんたくみんたくの技術ブログLaravelでシンプルなTODOリストを作ってみた2018年12月14日LaravelLaravelとjQueryと使ってシンプルなTODOリスト作りました。その開発過程や使用した技術などをメモしておきます。今日やることをサクッとメモして、優先順位をつけたりできるサービスがあればなと個人的に思ったからですね。シンプルに今日やることをリスト化できればタスクに集中しやすいと思い、作りました。ボタン名もつけずに直感的に使えるようにしました。処理は非同期で行い、タスクの登録や更新はフォーカスアウトすることで確定します。タスクのソートも実行した時点で確定されます。タスクの優先順位を簡単に変更できる上下の矢印をクリックすることで、簡単にタスクの優先順位を変更することができます。書こうと思えば長く書けてしまうタスクですが、あえて1行に制限することで、何をやるべきかを明確化することを目的としています。Webサーバフロントサイド基本的に処理はAjaxを使い非同期で行っています。例として、削除時の処理をのせます。削除対象のタスクIDを取得して、サーバサイドで削除処理を実行します。false).removeClass('disabled');});});上下に移動する処理はjquery.smoothswap.jsを使って実現しています。使い方はいたって簡単。jQuery本体とこちらのプラグインを一緒に読み込み、入れ替えたいパネル単位に“smoothswap-panel”を指定します。“smoothswap-down”とクラスを指定するだけです。{});}});}移動スピードを上げるには以下を追加すれば、早くなります。OTCHY.NETwww.otchy.netサーバサイドルーティング削除ルーティングは以下の通り。'TasksController@delete');コントローラPOSTされた削除対象IDを取得し、サービスに投げ削除実行します。実行結果によって、Viewに返すJSONレスポンスを変えます。削除が失敗した場合はエラーメッセージを返します。\Illuminate\Http\Response::HTTP_NO_CONTENT);}サービスサービスで行ロックして削除処理を実行しています。シンプルにfindOrFail()メソッドでサクッとコントローラに書いても良いと思います。勉強もかねてコントローラとサービスに分けて処理を書きました。'タスクが存在しないか既に削除されています。'予期せぬエラーが発生しました。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。