【Laravel教材⑦】Laravelでブログシステム構築！〜記事削除機能実装編〜

2023年7月4日2023年9月30日

ファド

こんにちは！
PHPのLaravelやJavaScriptでWeb開発をしているフリラーンスエンジニアのファドと申します！

こちらの記事はLaravel教材の第7回目の記事になります。

その他のLaravel教材を学習したい方は下記リンクから直接教材へ飛ぶことができます。

記事削除

ここまで記事投稿・編集ができるようになったので、最後に記事の削除をできるようにしましょう。
記事削除機能に関しても記事編集機能同様、以前に実装したことの応用なので過去の実装を思い出しながら実装していきましょう。

記事削除の流れは下記のようになっています。

記事詳細からIDに紐付けたリンクを作成してルートへ渡す
コントローラーとモデルを使用してデータを削除する
エラー処理

データの削除メソッド

まずはデータを削除するためのメソッドの解説です。
登録や編集と同じように、データの削除を実現させるためのメソッドも2つあります。

それはdeleteメソッドとdestroyメソッドです。

まずはdeleteメソッドの使い方から説明します。
使い方は下記の通りです。

$article = Article::find(1);
$article->delete();

まず削除したい記事を取得して、その記事にdeleteメソッドを使用するというイメージです。
とても簡単ですね！

次にdestroyメソッドの使い方を説明します。
使い方は下記の通りです。

Article::destroy(1);

destroyメソッドは記事ID(プライマリーキー)を引数として指定することで、指定したIDのデータを削除することができます。

destroyメソッドはプライマリーキーしか指定できないので、取得したデータを削除できるdeleteメソッドを使用すればOKです。

本教材でもdeleteメソッドを利用します。

実装

deleteメソッド以外の内容は過去の実装とほぼ同じなので、さっそく実装してみましょう。

記事詳細からIDに紐付けたリンクを作成してルートへ渡す

まずは削除処理用のルートを作成していきます。

first-app/routes/web.phpを下記の通り編集してください。

<?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\ArticleController;

Route::get('/', function () {
    return view('welcome');
});

// 投稿一覧を表示
Route::get('/articles', [ArticleController::class, 'showArticles'])->name('showArticles');

// 記事投稿フォームを表示
Route::get('/article/create', [ArticleController::class, 'createArticle'])->name('createArticle');

// 記事登録処理
Route::post('/article/store', [ArticleController::class,'storeArticle'])->name('storeArticle');

// 記事編集フォームを表示
Route::get('/article/edit/{id}', [ArticleController::class, 'editArticle'])->name('editArticle');

// 記事編集処理
Route::post('/article/update/{id}', [ArticleController::class,'updateArticle'])->name('updateArticle');

// 投稿詳細を表示
Route::get('/article/{id}', [ArticleController::class, 'showArticle'])->name('showArticle');

// 記事削除処理
Route::post('/article/delete/{id}', [ArticleController::class, 'deleteArticle'])->name('deleteArticle'); // ここを追加

追加したのは下記の1行です。

Route::post('/article/delete/{id}', [ArticleController::class, 'deleteArticle'])->name('deleteArticle');

記事の削除処理には削除する記事のIDが必要なので、/article/delete/{id}としています。
また、削除処理にはRoute::postを使用します。

次にルートで作成した記事削除処理のためのボタンを作成します。
記事詳細画面に削除ボタンを設置して、ボタンをクリックされた時に削除させたいので、first-app/resources/views/articles/detail.blade.phpを下記の通り編集してください。

@extends('layout')

@section('title')
    記事詳細
@endsection

@section('content')
    <h2>{{ $article->title }}</h2>
    <div class="d-flex">
        <span class="mr-2">作成日：{{ $article->created_at }}</span>
        <span>更新日：{{ $article->updated_at }}</span>
    </div>
    <p class="mt-4">{{ $article->content }}</p>
    <div class="d-flex">
        <a href="{{ route('showArticles') }}" class="mt-3 mr-2 btn btn-secondary">戻る</a>
        <a href="{{ route('editArticle', $article->id) }}" class="mt-3 mr-2 btn btn-primary">編集</a>
        <form method="POST" action="{{ route('deleteArticle', $article->id) }}">
            @csrf
            <button type="submit" class="mt-3 mr-2 btn btn-danger">削除</button>
        </form>
    </div>
@endsection

http://localhost/article/1にアクセスして、下記画像のように削除ボタンが追加されていればOKです。

削除ボタンはフォームを使用して作成します。
そのためルートを記述した時にRoute::postとしました。
また、CSRF保護の@csrfも忘れないようにしてください。

もちろんaction属性にはdeleteArticleメソッドを指定し、第二引数には削除する記事のIDを$article-idとして指定しています。

コントローラーとモデルを使用してデータを削除する

それではArticleコントローラーにdeleteArticleメソッドを実装していきましょう。
first-app/app/Http/Controllers/ArticleController.phpを下記の通り編集してください。

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Models\Article;
use App\Http\Requests\ArticleStoreRequest;
use App\Http\Requests\ArticleUpdateRequest;
use Illuminate\Support\Facades\DB;
use Illuminate\Support\Facades\Log;

class ArticleController extends Controller
{
    /**
     * 記事一覧を表示する
     */
    public function showArticles()
    {
        // 全ての記事データを取得
        $articles = Article::all();

        // compact関数で渡す場合
        return view('articles.index', compact('articles'));
    }

    /**
     * 記事投稿フォームを表示
     */
    public function createArticle()
    {
        return view('articles.create');
    }

    /**
     * 記事投稿処理
     */
    public function storeArticle(ArticleStoreRequest $request)
    {
        // トランザクション開始
        DB::beginTransaction();
        try {
            // 記事登録処理
            Article::create([
                'title' => $request->title,
                'content' => $request->content,
            ]);

            // トランザクションコミット
            DB::commit();
        } catch(\Exception $e) {
            // トランザクションロールバック
            DB::rollBack();

            // ログ出力
            Log::debug($e);

            // エラー画面遷移
            abort(500);
        }

        return redirect()->route('showArticles');
    }

    /**
     * 記事編集画面を表示する
     */
    public function editArticle($id)
    {
        // 渡されてきた記事IDのデータを取得
        $article = Article::find($id);

        return view('articles.edit', compact('article'));
    }

    /**
     * 記事編集処理
     */
    public function updateArticle(ArticleUpdateRequest $request, $id)
    {
        // トランザクション開始
        DB::beginTransaction();
        try {
            // 渡されてきた記事IDのデータを取得
            $article = Article::find($id);

            // 編集する内容をfillメソッドを使用して記述
            $article->fill([
                'title' => $request->title,
                'content' => $request->content,
            ]);

            // 保存処理
            $article->save();

            // トランザクションコミット
            DB::commit();
        } catch(\Exception $e) {
            // トランザクションロールバック
            DB::rollBack();

            // ログ出力
            Log::debug($e);

            // エラー画面遷移
            abort(500);
        }

        return redirect()->route('showArticle', $article->id);
    }

    /**
     * 記事詳細を表示する
     */
    public function showArticle($id)
    {
        // 渡されてきた記事IDのデータを取得
        $article = Article::find($id);

        return view('articles.detail', compact('article'));
    }

    /**
     * 記事削除処理
     */
    public function deleteArticle($id)
    {
        // 渡されてきた記事IDのデータを取得
        $article = Article::find($id);

        // 記事削除処理
        $article->delete();

        return redirect()->route('showArticles');
    }
}

追加したコードは下記の通りです。

/**
 * 記事削除処理
 */
public function deleteArticle($id)
{
    // 渡されてきた記事IDのデータを取得
    $article = Article::find($id);

    // 記事削除処理
    $article->delete();

    return redirect()->route('showArticles');
}

今回は削除する記事IDが送られてきているので、$idと記述し引数として受け取ります。
これで削除する記事IDをdeleteArticleメソッドで使用できるようになりました。

取得したIDを使用して、先ほど説明したdeleteメソッドで削除処理を実装しています。

最後にリダイレクト先をshowArticlesに指定し、記事一覧表示画面遷移させる処理を実装して終わりです。

これで記事詳細画面から削除ボタンをクリックすることで記事を削除できるようになりました。

エラー処理

最後にエラー処理を実装しておきましょう。

実装する内容はいつもと同じで下記の通りです。

try-catch文
トランザクション
ログ出力
エラー画面への遷移

first-app/app/Http/Controllers/ArticleController.phpを下記の通り編集してください。

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Models\Article;
use App\Http\Requests\ArticleStoreRequest;
use App\Http\Requests\ArticleUpdateRequest;
use Illuminate\Support\Facades\DB;
use Illuminate\Support\Facades\Log;

class ArticleController extends Controller
{
    /**
     * 記事一覧を表示する
     */
    public function showArticles()
    {
        // 全ての記事データを取得
        $articles = Article::all();

        // compact関数で渡す場合
        return view('articles.index', compact('articles'));
    }

    /**
     * 記事投稿フォームを表示
     */
    public function createArticle()
    {
        return view('articles.create');
    }

    /**
     * 記事投稿処理
     */
    public function storeArticle(ArticleStoreRequest $request)
    {
        // トランザクション開始
        DB::beginTransaction();
        try {
            // 記事登録処理
            Article::create([
                'title' => $request->title,
                'content' => $request->content,
            ]);

            // トランザクションコミット
            DB::commit();
        } catch(\Exception $e) {
            // トランザクションロールバック
            DB::rollBack();

            // ログ出力
            Log::debug($e);

            // エラー画面遷移
            abort(500);
        }

        return redirect()->route('showArticles');
    }

    /**
     * 記事編集画面を表示する
     */
    public function editArticle($id)
    {
        // 渡されてきた記事IDのデータを取得
        $article = Article::find($id);

        return view('articles.edit', compact('article'));
    }

    /**
     * 記事編集処理
     */
    public function updateArticle(ArticleUpdateRequest $request, $id)
    {
        // トランザクション開始
        DB::beginTransaction();
        try {
            // 渡されてきた記事IDのデータを取得
            $article = Article::find($id);

            // 編集する内容をfillメソッドを使用して記述
            $article->fill([
                'title' => $request->title,
                'content' => $request->content,
            ]);

            // 保存処理
            $article->save();

            // トランザクションコミット
            DB::commit();
        } catch(\Exception $e) {
            // トランザクションロールバック
            DB::rollBack();

            // ログ出力
            Log::debug($e);

            // エラー画面遷移
            abort(500);
        }

        return redirect()->route('showArticle', $article->id);
    }

    /**
     * 記事詳細を表示する
     */
    public function showArticle($id)
    {
        // 渡されてきた記事IDのデータを取得
        $article = Article::find($id);

        return view('articles.detail', compact('article'));
    }

    /**
     * 記事削除処理
     */
    public function deleteArticle($id)
    {
        // トランザクション開始
        DB::beginTransaction();
        try{
            // 渡されてきた記事IDのデータを取得
            $article = Article::find($id);

            // 記事削除処理
            $article->delete();

            // トランザクションコミット
            DB::commit();
        } catch(\Exception $e) {
            // トランザクションロールバック
            DB::rollBack();

            // ログ出力
            Log::debug($e);

            // エラー画面遷移
            abort(500);
        }

        return redirect()->route('showArticles');
    }
}

これも編集時と同じで実装内容自体は記事登録時と同じですね！
もしわからない箇所がある場合は、記事登録部分を読み直してください！

★検索ワード
・Laravel 削除機能実装
・Laravel delete destroy

おめでとうございます！

Laravelの学習お疲れさまでした。
教材を1度読んだだけではなかなかLaravelを理解することは難しいと思いますが、PHPで実装するよりもLaravelで実装した方が色々簡単になりそうなことはわかりましたか？

まずはここまで理解できていればLaravelの基礎は大丈夫です。
まだイメージできないなという方は、イメージができるまで何度かこちらの教材を読み直してみてください！

次の教材

次の教材は下記から簡単に飛ぶことができます！
引き続きプログラミングを楽しんでいきましょう！

プログラミング学習サポートについて

「独学で挫折した。。。」

「一人でのプログラミング学習がしんどい。。。」

「未経験からエンジニア転職をしたいけど何をしたら良いかわからない。。。」

このような悩みをお持ちの方向けに、本教材作成者のファドがMENTAという学習サイトにてあなたのプログラミング学習とエンジニア転職を徹底サポートいたします！

サポート価格はなんと1日あたりたったの約300円！

教材で分からない箇所のサポートはもちろんのこと、本サイトで公開しているすべての課題の解答も公開しております。
また、MENTAで学習を終わらせていただいた方限定で懇意にしていただいている企業さんを紹介することもあります！

なお、サポート内容の詳細は下記の通りです。

目標設定
マインドセット
オリジナル教材見放題
オリジナル課題見放題
オリジナル課題の解答見放題
課題コードレビュー
教材への無制限質問
課題への無制限質問
ポートフォリオ作成アドバイス
褒めのコーチング

いくつかのプランを用意させていただいておりますので、下記より一度ご覧ください！

この記事が気に入ったら
フォローしてね！

Follow @fadotechjp

よかったらシェアしてね！

URLをコピーしました！

【Laravel教材⑦】Laravelでブログシステム構築！〜記事削除機能実装編〜

【Laravel教材①】ブログシステムを実装しながらLaravelの基礎を徹底的に学ぶ！〜環境構築編〜

【Laravel教材②】Laravelでブログシステム構築！〜DB接続からテストデータの作成編〜

【Laravel教材③】Laravelでブログシステム構築！〜MVCモデル解説から画面の共通化編〜

【Laravel教材④】Laravelでブログシステム構築！〜全記事一覧画面実装から記事詳細画面実装編〜

【Laravel教材⑤】Laravelでブログシステム構築！〜記事投稿機能実装編〜

【Laravel教材⑥】Laravelでブログシステム構築！〜記事編集機能実装編〜

記事削除

データの削除メソッド

実装

記事詳細からIDに紐付けたリンクを作成してルートへ渡す

コントローラーとモデルを使用してデータを削除する

エラー処理

おめでとうございます！

次の教材

プログラミング学習サポートについて

サポート価格はなんと1日あたりたったの約300円！

コメント

コメント

コメントするコメントをキャンセル

【Laravel教材⑦】Laravelでブログシステム構築！〜記事削除機能実装編〜

【Laravel教材①】ブログシステムを実装しながらLaravelの基礎を徹底的に学ぶ！〜環境構築編〜

【Laravel教材②】Laravelでブログシステム構築！〜DB接続からテストデータの作成編〜

【Laravel教材③】Laravelでブログシステム構築！〜MVCモデル解説から画面の共通化編〜

【Laravel教材④】Laravelでブログシステム構築！〜全記事一覧画面実装から記事詳細画面実装編〜

【Laravel教材⑤】Laravelでブログシステム構築！〜記事投稿機能実装編〜

【Laravel教材⑥】Laravelでブログシステム構築！〜記事編集機能実装編〜

記事削除

データの削除メソッド

実装

記事詳細からIDに紐付けたリンクを作成してルートへ渡す

コントローラーとモデルを使用してデータを削除する

エラー処理

おめでとうございます！

次の教材

プログラミング学習サポートについて

サポート価格はなんと1日あたりたったの約300円！

コメント

コメント

コメントする コメントをキャンセル

コメントするコメントをキャンセル