laravel8でtodoリスト管理ツールを作る
Laravel 8を使用して、ToDoリスト管理ツールを作成する手順を以下に示します。
１．Laravelをインストールする
Laravel 8をインストールするには、ターミナルから以下のコマンドを実行します。
composer create-project --prefer-dist laravel/laravel todo-list２．データベースを設定する
データベースの設定を変更するには、.env ファイルを編集します。以下の設定に変更してください。
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=todo_list
DB_USERNAME=root
DB_PASSWORD=３．データベースをマイグレーションする
ターミナルで以下のコマンドを実行し、ToDoリストのデータベースをマイグレーションします。
php artisan migrate４．ToDoモデルを作成する
ToDoモデルを作成するには、ターミナルで以下のコマンドを実行します。
php artisan make:model Todo -m５．マイグレーションファイルを編集する
ToDoリストのためのテーブルを作成するため、database/migrations/{timestamp}_create_todos_table.php を編集します。
public function up()
{
Schema::create('todos', function (Blueprint $table) {
$table->id();
$table->string('title');
$table->text('description')->nullable();
$table->boolean('completed')->default(false);
$table->timestamps();
});
}
public function down()
{
Schema::dropIfExists('todos');
}６．ルートを作成する
ToDoリストを表示するためのルートを作成します。routes/web.php ファイルを開き、以下のコードを追加します。
Route::get('/', [TodoController::class, 'index'])->name('todo.index');７．ToDoコントローラーを作成する
ターミナルで以下のコマンドを実行し、ToDoコントローラーを作成します。
php artisan make:controller TodoController８．ToDoコントローラーを編集する
ToDoコントローラーを編集して、ToDoリストを表示するためのアクションを作成します。
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Todo;
class TodoController extends Controller
{
public function index()
{
$todos = Todo::all();
return view('todo.index', compact('todos'));
}
}９．ToDoビューを作成する
ToDoリストを表示するためのビューを作成します。resources/views/todo/index.blade.php ファイルを作成し、以下のコードを追加します。
<!DOCTYPE html>
<html>
<head>
<title>ToDo List</title>
</head>
<body>
<h1>ToDo List</h1>
<ul>
@foreach ($todos as $todo)
<li>{{ $todo->title }}</li>
@endforeach
</ul>
</body>
</html>１０．ToDoリストを追加するフォームを作成する
ToDoリストに項目を追加するフォームを作成します。resources/views/todo/index.blade.php ファイルを編集し、以下のコードを追加します。
<!DOCTYPE html>
<html>
<head>
<title>ToDo List</title>
</head>
<body>
<h1>ToDo List</h1>
<form method="POST" action="{{ route('todo.store') }}">
@csrf
<label>Title</label>
<input type="text" name="title">
<br>
<label>Description</label>
<textarea name="description"></textarea>
<br>
<button type="submit">Add ToDo</button>
</form>
<ul>
@foreach ($todos as $todo)
<li>{{ $todo->title }}</li>
@endforeach
</ul>
</body>
</html>１１．ToDoリストを追加するためのルートを作成する
ToDoリストを追加するためのルートを作成します。routes/web.php ファイルを開き、以下のコードを追加します。
Route::post('/todo', [TodoController::class, 'store'])->name('todo.store');１２．ToDoを追加するためのアクションを作成する
ToDoを追加するためのアクションを作成します。app/Http/Controllers/TodoController.php ファイルを編集し、以下のコードを追加します。
public function store(Request $request)
{
$todo = new Todo;
$todo->title = $request->title;
$todo->description = $request->description;
$todo->save();
return redirect()->route('todo.index');
}以上で、Laravel 8を使用したToDoリスト管理ツールの作成が完了しました。必要に応じて、デザインや機能を追加してカスタマイズしてください。
