Quantcast
Channel: CSSタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8694
↧

Laravelでresourceを使ってCRUD機能を爆速で開発する方法

March 11, 2021, 4:48 am
$
0
0

こんにちは、くりぱんです。

この記事で実現できること

  • Route::resourceの使い方
  • Controllerをphp artisanの--resourceオプションで作成する
  • CRUD機能を少ない工数で開発する

説明

今回はリソースコントローラというLaravelの便利機能を使って、CRUD機能を爆速で開発します。
今までcreateやshow、editなどのルーティングを一つ一つしていた方にもわかるように、丁寧に説明していきます。

この記事では、テーブルの作成（マイグレーションの実行）から説明します。Laravelの環境構築やデータベースとの接続方法等は説明していませんので、まずはLaravelのインストールとデータベースとの接続をしてください。
私はLaravelのプロジェクト名とデータベース名をlaravel_base_resourceにしていますでの、合わせるとわかりやすいかもしれません。

それでは行ってみましょう！

開発環境

  • OS： MacOS Catalina
  • PHP： 7.3
  • Laravel： 6.2
  • MySQL: 5.7

実装の流れ

  1. Articleモデルとマイグレーションファイルの作成
  2. Articlesテーブル作成
  3. Articleモデルの編集
  4. テストデータの作成
  5. Controllerの作成
  6. Routeの編集
  7. 記事一覧画面実装
  8. 記事投稿機能実装
  9. 記事詳細画面実装
  10. 記事編集機能実装
  11. 削除機能実装
  12. ルーティングの見直し

実装

Articleモデルとマイグレーションファイルの作成

Laravelのプロジェクトフォルダでartisanコマンドでモデルとマイグレーションファイルの作成を行います。

$php artisan make:model Models/Article -m

これでapp/Models/Article.phpというモデルとdatabase/migrationsにarticlesテーブルを作成するためのマイグレーションファイルが作成されました。
※マイグレーションのファイル名は作成した年_作成した月_作成した日_作成時間_create_articles_table.phpという名前になります。私の場合は、2021_03_07_165441_create_articles_table.phpとなっています。

モデルはデータベースとのやり取りを行う機能等を司るファイルです。
マイグレーションファイルはテーブルに関する操作をすることができます。

Articlesテーブル作成

それでは作ったマイグレーションファイルでテーブル定義を書いていきます。

2021_03_07_165441_create_articles_table.php
<?phpー省略ーclassCreateArticlesTableextendsMigration{/**
     * Run the migrations.
     *
     * @return void
     */publicfunctionup(){Schema::create('articles',function(Blueprint$table){$table->bigIncrements('id');$table->string('title',100);// ここを追加$table->text('body');// ここを追加$table->integer('status');// ここを追加$table->timestamps();});}ー省略ー}

これで記事のtitle(タイトル)とbody(内容)、status(状態)を保存するためのarticlesテーブルのマイグレーションファイルが完成しました。
早速データベースに反映させていきます。

$ php artisan migrate

Migration table created successfullyとなっていれば大丈夫です。
articlesテーブルに混じってusersテーブルやpassword_resetsテーブルなども作られています。これはLaravelをインストールした時に、元からあるマイグレーションファイルが実行されたために作成されただけなので、特に気にしなくて大丈夫です。
エラーが出ている場合は、データベースとの接続がうまくいっていないか、マイグレーションファイルに誤りがあるなどの原因が考えられるので、一度確認してみてください。

Articleモデルの編集

今回の場合はArticlesテーブルのtitleとbody、statusの内容をデータベースに保存したいので、下記のようにapp/Models/Article.phpを編集してください。

Article.php
<?phpnamespaceApp\Models;useIlluminate\Database\Eloquent\Model;classArticleextendsModel{ーーここから追加ーーprotected$fillable=['title','body','status',];ーーここまで追加ーー}

protected $fillable = ['カラム名']とすることで、指定したカラムのデータがデータベースで更新できるようになります。

テストデータの作成

1. Factoryを作る

テストデータの作成はSeederのみで作成できますが、今回は練習という意味も含めてFactoryを使用して作っていきます。Seederだけで書く場合は1つ1つデータを作っていきますが、Factoryを組み合わせると、いくつものテストデータを自動で作ってくれるのでとても便利です。
下記のコードを実行して、Factoryを作成してください。

$ php artisan make:Factory ArticleFactory

database/factories/ArticleFactory.phpが作成されていれば完璧です。

FactoryはFakerを使用してテストデータの作成をするのですが、デフォルトで挿入されるデータが英語なので、config/app.phpを変更して日本語化していきます。

app.php
<?phpreturn[ー省略ー'timezone'=>'Asia/Tokyo',ー省略ー'locale'=>'ja',ー省略ー'fallback_locale'=>'ja',ー省略ー'faker_locale'=>'ja_JP',ー省略ー];

ついでなので、タイムゾーン等も一緒に変えましたが、faker_locale => 'ja_JP'になっていれば大丈夫です。

日本語化が完了したので、データの追加処理をFactoryに記述していきます。
database/factories/ArticleFactory.phpを下記の通り編集してください。

ArticleFactory.php
<?php/** @var \Illuminate\Database\Eloquent\Factory $factory */useApp\Models\Article;// ここを変更useFaker\GeneratorasFaker;$factory->define(Article::class,function(Faker$faker){// ここを変更return[ーーここから追加ーー'title'=>$faker->word,'body'=>$faker->realText,'status'=>$faker->numberBetween(0,1),'created_at'=>now(),'updated_at'=>now(),ーーここまで追加ーー];});

$faker->とすることで様々なデータを挿入することができます。
now()はLaravelのヘルパ関数で、現在時刻を取得してくれます。
このFactoryファイルでは、titleにランダムな単語、bodyに適当な文章、statusには0か1、created_atとupdated_atには現在時刻が入るように設定しています。

Fakerではそれ以外にも様々なデータを挿入できますので、今回扱ったもの以外を使いたいときは、こちらを参考にしてください。

2. Seederを作る

次に、Seederを下記のコマンドで作成してください。

$ php artisan make:seeder ArticleTableSeeder

database/seeds/ArticleTableSeederが作成されます。

runメソッドの中を編集していきます。

ArticleTableSeeder.php
<?phpuseIlluminate\Database\Seeder;classArticleTableSeederextendsSeeder{publicfunctionrun(){factory(App\Models\Article::class,100)->create();//ここを追加}}

ArticlesテーブルにFactoryで作成した100のデータを追加するようにしています。

3. DatabaseSeeder.phpの更新

Seederを使うためにdatabase/seeds/DatabaseSeeder.phpに作成したシーダークラスを定義します。

DatabaseSeeder.php
<?phpuseIlluminate\Database\Seeder;classDatabaseSeederextendsSeeder{publicfunctionrun(){$this->call(ArticleTableSeeder::class);// ここを追加}}

4. db:seedの実行

ここまで作成できたら、artisanコマンドでシーダーを実行します。

$ php artisan db:seed

これで、titleは英語ですがbodyは日本語のテキストがDBに反映されています。Fakerの日本語化をしましたが、日本語になるものとならないものがあるので、気をつけてください。
statusには0か1の数字がフラグとして入っています。

Controllerの作成

ここまででテストデータを作成したので、次はコントローラを作成し、CRUD処理の記述をしていきたいと思います。

$ php artisan make:controller ArticleController --resource

artisanコマンドでコントローラを作成する際に、--resourceオプションをつけると、簡単にリソースコントローラを作成することができます。
app/Http/Controllers/ArticleController.phpが作成されていることを確認して、中身を見てみましょう。

ArticleController.php
<?phpnamespaceApp\Http\Controllers;useIlluminate\Http\Request;classArticleControllerextendsController{publicfunctionindex(){//}publicfunctioncreate(){//}publicfunctionstore(Request$request){//}publicfunctionshow($id){//}publicfunctionedit($id){//}publicfunctionupdate(Request$request,$id){//}publicfunctiondestroy($id){//}}

最初からindexメソッドやcreateメソッドなどが作成されていることがわかりますね。
これを編集していけば、簡単にCRUD機能が実装できるようになっています。

Routeの編集

ルーティングも簡単に行うことができるようになっています。
routes/web.phpを下記の通り編集してください。

web.php
<?phpRoute::resource('articles','ArticleController');

たった一行だけです。他に何もいりません。
ターミナルで$ php artisan route:listと叩いてルーティング確認すると、下記のようになっています。

+--------+-----------+-------------------------+------------------+------------------------------------------------+--------------+
| Domain | Method    | URI                     | Name             | Action                                         | Middleware   |
+--------+-----------+-------------------------+------------------+------------------------------------------------+--------------+
|        | GET|HEAD  | articles                | articles.index   | App\Http\Controllers\ArticleController@index   | web          |
|        | POST      | articles                | articles.store   | App\Http\Controllers\ArticleController@store   | web          |
|        | GET|HEAD  | articles/create         | articles.create  | App\Http\Controllers\ArticleController@create  | web          |
|        | GET|HEAD  | articles/{article}      | articles.show    | App\Http\Controllers\ArticleController@show    | web          |
|        | PUT|PATCH | articles/{article}      | articles.update  | App\Http\Controllers\ArticleController@update  | web          |
|        | DELETE    | articles/{article}      | articles.destroy | App\Http\Controllers\ArticleController@destroy | web          |
|        | GET|HEAD  | articles/{article}/edit | articles.edit    | App\Http\Controllers\ArticleController@edit    | web          |
+--------+-----------+-------------------------+------------------+------------------------------------------------+--------------+

Laravelは最初からURIがapi/userというものがルーティングされていますが、今回は関係ないので上記の$ php artisan route:listの表示結果からは外しています。

各メソッドの機能は下記の通りです。

※表1
| メソッド名 | 機能 |
|:-:|:-:|
| index | 記事一覧表示 |
| store | 記事投稿処理 |
| create | 記事投稿画面表示 |
| show | 記事詳細表示 |
| update | 記事編集処理 |
| destroy | 記事削除処理 |
| edit | 記事編集画面表示 |

記事一覧画面実装

メソッドはindex(記事一覧表示)を使用していきます。
わからない方は各メソットがどのような処理を担当しているかの表である※表1を参考にしてください。
ちなみにルーティングを確認するコマンドは$ php artisan route:listです。

1. controllerの編集

先程作成したapp/Http/Controllers/ArticleController.phpを下記の通り編集してください。

ArticleController.php
<?phpnamespaceApp\Http\Controllers;useIlluminate\Http\Request;useApp\Models\Article;// ここを追加classArticleControllerextendsController{publicfunctionindex(){// すべての記事を取得$articles=Article::all();// ここを追記// 記事一覧を表示returnview('articles.index',compact('articles'));// ここを追記}

これでhttp://127.0.0.1:8000/articlesにアクセスした時に、ArticleControllerのindexメソッドが走り、すべての記事データを取得してから記事一覧画面に遷移するような実装できました。
細かく見ていくと、$articles = Article::all();でArticlesテーブルからデータを取得し、return view('articles.index', compact('articles'));で
resources/views/articles/index.blade.phpというビューにArticlesテーブルのデータが渡される処理を記述していることがわかります。

2. viewの作成

今回はCSSをあまり使いたくないのでviewの作成前にBootstrapを導入していきます。
導入といっても、下の3つのコマンドを叩くだけです。

$ composer require laravel/ui:^1.0 --dev
$ php artisan ui bootstrap --auth
$ npm install && npm run dev

Bootstrapの導入がよくわからない方はこちらも参考にしてください。

Bootstrapの導入が終わった方は、resources/views配下にarticlesディレクトリを作成してください。
下記コマンドで作成しても大丈夫ですし、GUIで作成しても構いません。

$ mkdir resources/views/articles

作成できたら、resources/views/articles配下にindex.blade.phpを作成して編集してください。

$ touch resources/views/articles/index.blade.php
index.blade.php
@extends('layouts.app')

@section('content')
<divclass="container"><divclass="row justify-content-center"><divclass="col-md-12"><divclass="card"><divclass="card-header">投稿一覧</div><divclass="card-body"><divclass="table-resopnsive"><tableclass="table table-striped"><thead><tr><th>タイトル</th><th>本文</th><th>状態</th></tr></thead><tbody>
                @if(isset($articles))
                @foreach ($articles as $article)
                <tr><td>{{ $article->title }}</td><td>{{ $article->body }}</td><td>{{ $article->status }}</td></tr>
                @endforeach
                @endif
              </tbody></table></div></div></div></div></div></div>
@endsection

コントローラで渡したすべての記事データが入っている$articlesをforeachのループ処理で一つ一つ切り分けて画面に表示しています。

記事投稿機能実装

メソッドはcreate(記事投稿画面表示)とstore(記事投稿処理)を使用していきます。
それって何だっけの人は、記事一覧画面実装の最初の部分を見てみてください。

1. 一覧ページに投稿ボタンの設置

一覧画面から投稿画面に遷移したいので、一覧画面に投稿ボタンを設置します。
resources/views/articles/index.blade.phpを下記の通り編集してください。

index.blade.php
@extends('layouts.app')

@section('content')

        ーー省略ーー

        <divclass="card-header">投稿一覧</div><divclass="card-body">ーーここから追加ーー
          <buttontype="button"class="btn btn-primary mb-3 d-block w-100"onclick="location.href='{{ route('articles.create') }}'">新規投稿
          </button>ーーここまで追加ーー

          <divclass="table-resopnsive"><tableclass="table table-striped"><thead><tr><th>記事No.</th><th>タイトル</th><th>本文</th><th>状態</th></tr></thead>ーー省略ーー
@endsection

onclick="location.href='{{ route('articles.create') }}'"とすることで、ボタンをクリックすると記事投稿画面に遷移するようにしています。

2. 記事投稿画面を表示させる

記事を投稿するための投稿画面を実装していきます。
app/Http/Controllers/ArticleController.phpを下記の通り編集してください。

ArticleController.php
// createメソッドの部分だけ抜粋していますpublicfunctioncreate(){// 投稿画面表示returnview('articles.create');// ここを追記}

ただ投稿画面を表示させるだけなので、単純にこれから作成するビューファイルのresources/views/articles/create.blade.phpを返せばOKです。

次にcreate.blade.phpを作成していきます。

$ touch resources/views/articles/create.blade.php
create.blade.php
@extends('layouts.app')

@section('content')
<divclass="container"><divclass="row justify-content-center"><divclass="col-md-12"><divclass="card"><divclass="card-header">新規投稿</div><divclass="card-body"><formaction="{{ route('articles.store') }}"method="POST">
                        @csrf
                        <divclass="form-group row"><labelfor="title"class="col-md-2 col-form-label text-md-right">タイトル</label><divclass="col-md-9"><inputid="title"type="text"class="form-control"name="title"value="{{ old('title') }}"></div></div><divclass="form-group row"><labelfor="body"class="col-md-2 col-form-label text-md-right">本文</label><divclass="col-md-9"><textareaname="body"id="body"style="resize: none; height: 200px; width: 100%">{{ old('body') }}</textarea></div></div><divclass="form-group row"><labelclass="col-md-2 col-form-label text-md-right">ステータス</label><divclass="form-check form-check-inline ml-3"><inputclass="form-check-input"type="radio"id="open"name="status"value="0"checked="checked"><labelclass="form-check-label"for="open">公開</label></div><divclass="form-check form-check-inline"><inputclass="form-check-input"type="radio"id="private"name="status"value="1"><labelclass="form-check-label"for="private">未公開</label></div></div><divclass="form-group row mb-0"><divclass="col-md-6 offset-md-4"><buttontype="button"class="btn btn-secondary"onClick="history.back()">戻る</button><buttontype="submit"class="btn btn-primary ml-3"name='action'value='add'>投稿
                                </button></div></div></form></div></div></div></div></div>
@endsection

これで新規投稿のビューファイルが完成しました。
注意点として、@csrfというものがformタグのあとにありますが、セキュリティの貧弱性であるCSRFにこれ一文字で対策できるスグレモノです。
Laravelではformタグの中に@csrfがないとsubmitできないので、絶対に記述しましょう！

3. 記事投稿の処理を実装する

app/Http/controllers/ArticleController.phpのstoreメソッドで新規投稿をできるようにしていきたいので、storeメソッドを編集していきます。

ArticleController.php
// storeメソッドの部分だけ抜粋していますpublicfunctionstore(Request$request){// 投稿内容保存処理$article=Article::create(['title'=>$request->title,'body'=>$request->body,'status'=>$request->status,]);// ここを追加returnredirect()->route('articles.index');// ここを追加}

$requestという変数でフォームの入力内容を受け取り、Articleモデルを介してフォームの入力内容をArticlesテーブルに登録しています。
また、投稿完了後はトップページに戻るようにしています。

記事詳細画面実装

メソッドはshow(記事詳細画面表示)を使用していきます。
それって何だっけの人は、記事一覧画面実装の最初の部分を見てみてください。

1. 記事一覧画面のタイトルに詳細画面を表示させるためのリンクを追加

記事一覧画面のタイトルに詳細画面へのリンクを貼り、タイトルをクリックしたら、クリックした記事の詳細を表示させる画面に遷移させていこうと思います。
まずはresources/views/articles/index.blade.phpにリンクを追加していきます。

index.blade.php
@extends('layouts.app')

@section('content')
<divclass="container"><tableclass="table table-striped"><thead><tr><th>タイトル</th><th>本文</th><th>状態</th></tr></thead><tbody>
            @if(isset($articles))
            @foreach ($articles as $article)
            <tr><td><ahref="{{ route('articles.show', $article->id) }}">{{ $article->title }}</a></td> // ここを編集
                    <td>{{ $article->body }}</td><td>{{ $article->status }}</td></tr>
            @endforeach
            @endif
        </tbody></table>ーー省略ーー

</div>
@endsection

href={{ route('articles.show', $article->id) }}に注目してください。
まず、articles.showというルーティングに飛ばされ、article.showのURIは、articles/{article}となっているので、第2引数の$article->idが{article}の部分に入るようになります。よって、localhost/articles/記事IDというURLに飛ばされることになります。

2. 記事編集フォームを表示させる

app/Http/Controllers/ArticleController.phpのshowメソッドを下記のように編集してください。

ArticleController.php
// showメソッドの部分のみ抜粋publicfunctionshow(Int$id){// ビューから渡されたIDの記事を取得$article=Article::find($id);// 記事詳細画面を表示returnview('articles.show',compact('article'));}

$article = Article::find($id);でビューから渡された記事IDに紐付いた記事データをArticlesテーブルから取得しています。
その取得したデータを詳細画面のビューに渡しています。

ビューファイルも合わせて作っちゃいましょう。

$ touch resources/views/articles/show.blade.php
show.blade.php
@extends('layouts.app')

@section('content')
<divclass="container"><divclass="row justify-content-center"><divclass="col-md-12"><divclass="card"><divclass="card-header">記事詳細</div><divclass="card-body"><divclass="table-resopnsive"><tableclass="table table-striped"><thead><tr><th>タイトル</th><th>本文</th><th>状態</th></tr></thead><tbody>
                @if(isset($article))
                <tr><td>{{ $article->title }}</a></td><td>{{ $article->body }}</td><td>{{ $article->status }}</td></tr>
                @endif
              </tbody></table>
            @if(isset($article))
            <divclass="text-center"><buttontype="button"class="btn btn-secondary"onClick="history.back()">戻る</button><buttontype="button"class="btn btn-primary ml-3"onClick="location.href='{{ route('articles.edit', $article->id) }}'">編集
                </button></div>
            @endif
          </div></div></div></div></div></div>
@endsection

記事一覧画面の記事タイトルをクリックすると記事詳細がこれで表示さるようになりました。
また、ブラウザバックのための戻るボタンと次に実装していく記事編集画面に行くための編集ボタンも設置しています。

記事編集機能実装

メソッドはedit(画面表示)とupdate(編集処理)を使用していきます。
それって何だっけの人は、記事一覧画面実装の最初の部分を見てみてください。

1. 記事編集画面を表示させる

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

ArticleController.php
// editメソッドの部分のみ抜粋publicfunctionedit(Int$id){// ビューから渡されたIDの記事を取得$article=Article::find(Int$id);// ここを追記// 記事編集画面を表示returnview('articles.edit',compact('article'));// ここを追記}

編集したい記事のデータをedit.blade.phpに渡したいだけなので、詳細画面を表示させるためのshowメソッドとコードはほとんど同じです。

edit.blade.phpを作成していきましょう。

$ touch resources/views/articles/edit.blade.php
edit.blade.php
@extends('layouts.app')

@section('content')
<divclass="container"><divclass="row justify-content-center"><divclass="col-md-12"><divclass="card"><divclass="card-header">新規投稿</div><divclass="card-body"><formaction="{{ route('articles.update', $article->id) }}"method="POST">
                        @csrf
                        <divclass="form-group row"><labelfor="title"class="col-md-2 col-form-label text-md-right">タイトル</label><divclass="col-md-9"><inputid="title"type="text"class="form-control"name="title"value="{{ old('title', $article->title) }}"></div></div><divclass="form-group row"><labelfor="body"class="col-md-2 col-form-label text-md-right">本文</label><divclass="col-md-9"><textareaname="body"id="body"style="resize: none; height: 200px; width: 100%">{{ old('body', $article->body) }}</textarea></div></div><divclass="form-group row"><labelclass="col-md-2 col-form-label text-md-right">ステータス</label><divclass="form-check form-check-inline ml-3"><inputclass="form-check-input"type="radio"id="open"name="status"value="0"{{$article->status === 0 ? 'checked' : null }}>
                                <labelclass="form-check-label"for="open">公開</label></div><divclass="form-check form-check-inline"><inputclass="form-check-input"type="radio"id="private"name="status"value="1"{{$article->status === 1 ? 'checked' : null }}>
                                <labelclass="form-check-label"for="private">未公開</label></div></div><divclass="text-center"><buttontype="button"class="btn btn-secondary"onClick="history.back()">戻る</button><buttontype="submit"class="btn btn-primary ml-3"name='action'value='add'>編集
                            </button></div></form></div></div></div></div></div>
@endsection

編集フォームなので、投稿フォームであるcreate.blade.phpとほとんど同じです。
value="{{ old('title', $article->title) }}"としていますが、第2引数の$article->titleが初期値に指定されています。そのため、編集フォームの中にはじめから選択した記事のタイトルが入っていることになります。
また、ラジオボタンの初期値を設定するために、{{ $article->status === 0 ? 'checked' : null }}という記述を追加しています。これは、条件演算子を使って記事ステータスが0のときはcheckedを追加し、0以外のときは何もしないという処理になっています。

2. 記事編集処理の実装

storeメソッドと似ていますが、投稿ではなく編集なので、fill+saveメソッドを使用していきます。編集処理はsaveメソッド以外にもupdateメソッドというものがありますが、saveメソッドは差分保存でupdateメソッドはまるっと全部保存という違いがあります。つまり、saveメソッドは何か変更が加えられたときのみ処理が走るのに対して、updateはデータが変更されてようが、されてなかろうが更新してしまいます。今回は差分だけ保存できればいいので、saveを使用して行きます。
それではapp/Http/Controllers/ArticleController.phpを編集していきます。

ArticleController.php
// updateメソッドの部分のみ抜粋publicfunctionupdate(Request$request,Int$id){// 選択された記事データを取得$article=Article::find($id);// 編集処理実行$article->fill($request->all())->save();// 記事一覧画面へreturnredirect()->route('articles.index');}

削除機能実装

メソッドはdestroy(記事削除処理)を使用していきます。
それって何だっけの人は、記事一覧画面実装の最初の部分を見てみてください。

1. 削除ボタンの配置

削除ボタンは記事詳細画面に設置するので、resources/articles/show.blade.phpを下記の通り編集してください。

show.blade.php
@extends('layouts.app')

@section('content')
<divclass="container">ーー省略ーー

            @if(isset($article))
            <divclass="text-center"><buttontype="button"class="btn btn-secondary"onClick="history.back()">戻る</button>ーーここから追加ーー
                <formstyle="display:inline"action="{{ route('articles.destroy', $article->id) }}"method="post">
                    @method('DELETE')
                    @csrf
                    <buttontype="submit"class="btn btn-danger ml-3">
                        {{ __('削除') }}
                    </button></form>ーーここまで追加ーー

                <buttontype="button"class="btn btn-primary ml-3"onClick="location.href='{{ route('articles.edit', $article->id) }}'">編集
                </button></div>
            @endif

            ーー省略ーー

</div>
@endsection

2. 削除処理実装

ArticleController.php
// destroyメソッドの部分のみ抜粋publicfunctiondestroy(Int$id){// 選択された記事データを取得$article=Article::find($id);// 削除処理実行$article->delete();// 記事一覧画面へreturnredirect()->route('articles.index');}

削除したい記事のデータを取得して、$article->delete()でデータを削除しています。

ルーティングの見直し

現在はhttp://127.0.0.1:8000/articlesとアクセスすると記事一覧画面が表示されますが、http://127.0.0.1:8000と検索しただけで記事一覧画面を表示して行こうと思います。

routes/web.phpを編集していきます。

web.php
<?phpRoute::get('/','ArticleController@index')->name('articles.index');// ここを追記Route::resource('articles','ArticleController')->except('index');// ここを編集Auth::routes();// bootstrap導入時に勝手に追記されているRoute::get('/home','HomeController@index')->name('home');// bootstrap導入時に勝手に追記されている

except('メソッド名')とすると、指定したメソッドはルーティングされなくなります。
その代わりにRoute::get('/', 'ArticleController@index')->name('articles.index');としてあげることで、http://127.0.0.1:8000にアクセスしただけで記事一覧画面が表示されるようになりました。
$ php artisan route:listをしてみてもexceptする前と同じだと思います。
ぜひ確かめてみてください。

最後に

これでCRUD機能の実装は終了です。
これからは、これを元に色々やっていきたいと思います。

少しでも役に立った！という時は、LGTMをポチッと、、、笑
1つでもLGTMが付くとその日がハッピーになるんです！
役に立たなかった時は、怒らないでコメント頂けると幸いです笑

Twitterもやってます！
プログラミングや金融知識についてやエンジニアの現実についてつぶやいています！
よかったら見てみてくださいね！

↧
Search
Viewing all articles
Browse latest Browse all 8694

Latest Images

赤坂中華　わんたん亭

赤坂中華　わんたん亭

July 20, 2025, 4:00 am
赤坂中華　わんたん亭

赤坂中華　わんたん亭

July 20, 2025, 4:00 am
赤坂中華　わんたん亭

赤坂中華　わんたん亭

July 20, 2025, 4:00 am
赤坂中華　わんたん亭

赤坂中華　わんたん亭

July 20, 2025, 4:00 am
Спутник スプートニク 洗車する

Спутник スプートニク 洗車する

July 19, 2025, 4:17 pm
Спутник スプートニク 洗車する

Спутник スプートニク 洗車する

July 19, 2025, 4:17 pm
Спутник スプートニク 洗車する

Спутник スプートニク 洗車する

July 19, 2025, 4:17 pm
Спутник スプートニク 洗車する

Спутник スプートニク 洗車する

July 19, 2025, 4:17 pm
熱中症になりかかっていたかも

熱中症になりかかっていたかも

July 18, 2025, 11:34 pm
.NETで応答性の高いビジュアル入力コントロールを使用

.NETで応答性の高いビジュアル入力コントロールを使用

July 18, 2025, 8:38 am

Trending Articles

井上貴博アナウンサー彼女や結婚の噂は？実家や親が話題？人気は？

September 15, 2013, 1:59 am

SSHエラー集

October 26, 2016, 9:17 pm

お手柄郵便局員に感謝状　詐欺被害を未然に防止

August 28, 2014, 5:11 pm

三代目奈須一家

August 3, 2018, 12:00 am

2014年4月18日号　三井住友銀行（4月1日付）

April 19, 2014, 7:21 pm

千畳敷カール_その２

July 20, 2012, 9:07 am

香川　善通寺市の市議逮捕　コップ投げつけ飲酒検知を拒否

May 28, 2013, 1:15 pm

8.17全国高校生グレコローマン選手権・第1日／組み合わせ

August 16, 2018, 9:01 am

長野の御代田のタイ人スナックが集まる場所に乗り込んだら自転車で盛大にコケた話１～日中編

April 27, 2016, 7:27 am

「五香西口納涼盆踊り大会」中止のお知らせ／松戸市

August 23, 2020, 4:10 pm

ポケットモンスターフレイムレッド (2)(1).zip (ポケットモンスターフレイムレッド (2)(1).zip)

November 16, 2017, 2:56 pm

自宅警備員2　-灰原家の血族-　攻略

November 5, 2018, 7:26 am

梶浦郁乃(東邦高校元マネージャー)今現在OLで彼氏(藤島健斗)とは交際は続いている?

June 9, 2017, 9:26 pm

中古艇（中古シーカヤック）「ウォーターフィールド　Ｎｅｗサスケ」のご案内！

March 6, 2012, 11:33 pm

《WA/40thアルティメットコレクション》は、PBシステム搭載！

January 28, 2014, 11:06 pm

☆今は無き荻窪の珈琲店「琲珈里（ひかり）」

February 11, 2016, 3:48 am

イコラブが来てくれて、まじでありがたい

September 25, 2017, 2:09 am

Salesforceのエクセル/CSV出力で文字化けするときは、文字コードをUTF-8にすればよい(BOM付き)

November 16, 2017, 4:59 am

やはり夜ですね(o^-^)登戸フィリピンパブ

March 24, 2017, 4:24 am

大阪・泉南イオンで飛び降り自殺とみられる転落事件が発生：ネットで拡散された理由とは

July 15, 2016, 12:05 pm
Search

Latest Images

赤坂中華　わんたん亭

赤坂中華　わんたん亭

July 20, 2025, 4:00 am
赤坂中華　わんたん亭

赤坂中華　わんたん亭

July 20, 2025, 4:00 am
赤坂中華　わんたん亭

赤坂中華　わんたん亭

July 20, 2025, 4:00 am
赤坂中華　わんたん亭

赤坂中華　わんたん亭

July 20, 2025, 4:00 am
Спутник スプートニク 洗車する

Спутник スプートニク 洗車する

July 19, 2025, 4:17 pm
Спутник スプートニク 洗車する

Спутник スプートニク 洗車する

July 19, 2025, 4:17 pm
Спутник スプートニク 洗車する

Спутник スプートニク 洗車する

July 19, 2025, 4:17 pm
Спутник スプートニク 洗車する

Спутник スプートニク 洗車する

July 19, 2025, 4:17 pm
熱中症になりかかっていたかも

熱中症になりかかっていたかも

July 18, 2025, 11:34 pm
.NETで応答性の高いビジュアル入力コントロールを使用

.NETで応答性の高いビジュアル入力コントロールを使用

July 18, 2025, 8:38 am
<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>