更新日: 2020年11月04日
公開日: 2020年04月23日

Laravelとは？イストール方法からToDoアプリの作成まで

私が仕事をしているコワーキングスペースで、「〇〇スクールでは PHP 学習に Laravel を実施していますが、コードキャンプさんでは Laravel しないんですか？」という会話が。

"Laravel" どんなものか、ご存じない方も多いと思いますので、生々しく "Laravel" をご紹介させて頂きたいと思います。また紹介を通じて Laravel で Todo アプリを作ってみました。

「これから Laravel はじめようか...」「どのプログラミングスクールで PHP はじめようか」と考えている方、ご参考下さい。

当記事は、 Laravel を肯定・否定するものではありません。
あくまで中立的な立場を意識しての、 "体験記" です。
開発に関わる方にとって失礼ございましたら、お許しください。

本稿で利用する Laravel のバージョン： Laravel Framework 6.14.0 （2020.02.10時点の最新版）

Laravelとは？イストール方法からToDoアプリの作成まで
Laravelとは
プログラミング初心者にとってのLaravel注意点
Laravel入門：インストール方法
Laravelで簡単なTodoアプリを作る（MVCとCRUDを体験）
今回ご紹介した内容を実際に操作している様子の動画
まとめ

Laravelとは？イストール方法からToDoアプリの作成まで

Laravelとは

Laravel開発者の Taylor Otwellさん　(img: GitHub/Taylor Otwell)

PHPで一番人気の Webフレームワーク
Bootstrap や Vue、 React も標準対応
Ruby on Rails と同じ、 MVC で CRUD を採用
オープンソースで無料

まず Laravel といえば近年 PHP の中でも一番人気のフレームワーク。例えば GitHub の新規リポジトリ数を確認してみると以下のように。

データ、データ収集に用いたプログラム（Python）

圧倒的に他のフレームワークを抜いて、 Laravel が使われている様子がありますね。 Laravel が選ばれる理由はいくつかあると思いますが、主には上記で挙げているような「MVC」や「CRUD」、 Bootstrap や Vue 対応という点でしょう。

"MVC" や "CRUD" の効果は、 Ruby on Rails で実証済みで、アジャイル開発を積極的に手伝ってくれます。この効果は文面やイラストを見るより、実際に自分で体験するのが一番。それから "Bootstrap" や "Vue"、 "React" 標準対応というのは近年の開発環境を汲みとっての機能。従来のフレームワークでは煩雑だった Bootstrap や Vue の設定を

composer require laravel/ui --dev
php artisan ui bootstrap
npm install && npm run dev

（Bootstarp を利用する場合）

php artisan の "artisan" は、 Larabel 特有のコマンド、"職人" という意味

の 3行でやってくれます。こうした充実機能が Laravel の人気を支えているのでしょう。

【余談　Laravel開発者のマインド】

Laravel はテイラーさんによって開発され、現在も積極的にテイラーさんは開発に参加中。 Laravel での決済処理を手伝ってくれる「Laravel Cashier」や API 開発を手伝ってくれる「Laravel Dusk」など Laravel に関連したプログラムも続々登場。つまり「Web で〇〇したい」という欲求を Laravel なら実現できる、というイメージでしょう。

そしてフレームワークを理解する上で知っておきたい開発者のポリシーは、以下の通り。

私の使命は、Webアプリケーションを作成するためのすばらしいツールを作成することにより、開発者の生活をより楽しく、平和にすることです。アプリケーションの作成に使用するツールは、機能的で美しいものでなければなりません。簡単に習得でき、しかも素晴らしいソリューションを構築するために必要なパワーを提供する必要があります。（https://github.com/sponsors/taylorotwellより引用）

なんかすごくカッコイイですよね。

プログラミング初心者にとってのLaravel注意点

Laravel、すごく魅力的なフレームワークに感じますよね。しかし、それはここまで。

ココからは実際に私大島が Laravel を使おうと思ってハマった点、ストレスに感じた点をご紹介。 Laravel をはじめる前に「もうプログラミング嫌だ」「どうせ自分にはできない..」とならないために事前告知しておきます。

注意①　環境設定の難しさ
注意②　複雑に絡みあうプログラム群
注意③　Laravel自体のバージョン

注意① 環境設定の難しさ

これは Paizaクラウドなどの Laravel インストール済みの環境を使えば関係ないことですが、自分のパソコンに Laravel をセットしようとすると一苦労するかもしれません。一番複雑なパターンは、既に "PHP" や "Composer" などが入っていて、公式ドキュメントを読まずに、ネット検索で設定する場合。

「自分のパソコンには PHP や Composer 入ってるし、直ぐに Laravel 使える」と思っていたら、「あれっ、書いてあるとおりに Laravel インストールしようとしても ❌ だ...」となりかねません。 Laravel は高度なプログラム群で構成させれており、各種ソフトのバージョンについても敏感。現在最新の Laravel 8系では PHPバージョン 7.3 以上が必要で、 7.1.3 などは ❌。　また Composer のバージョンも古いと Laravel のインストールを上手く処理できません。

Laravelプロジェクトを作成しようとしても、 Composer のバージョンが古くて ❌ なケース。

既に Laravel8 に対応できない PHP や Composer が自分のパソコンに入っている場合は、一旦アンインストールして、再度新しいバージョンのモノをインストールし直すことをオススメします。もしくは公式ドキュメントに書かれている、 "Laravel Homestead" というシステムを利用するか。

注意② 複雑に絡み合うプログラム群

こちらは主に "npm" の依存関係について。 Node.js や Angular などの JavaScript ライブラリを使ったことのある方なら大丈夫と思いますが、「Node.js はじめて」という方は、少し警戒する必要があるでしょう。 Laravel は標準で Bootstarp や Vue などをサポートしていますが、実際に Laravel で Bootstarp を使おうと思うと Node.js や npm を利用します。その際に関係する npm の依存関係は 10 以上。 npm の依存関係先のパッケージ・バージョンによっては、下図の様にエラーが出たりします。

Node.js や npm 自体のバージョンが古いというエラー。それから Popper.js は、バージョン 1が廃止になって、今は 2 を使おうね、というエラー文。詳細は「npm popper.js」で検索し、確認。この時点では、 2.0.5 が最新で、 npm のページには「 npm i popper.js@1.14.3 」と 1.14.3 のインストールも紹介中。一体どうすればいいか、 npm の事を知っておかないと ??? ですよね。参考ページ: npm/popper.js

Laravel のエラーに屈することなく、プロジェクトを運営しようと思うと、 npm や Package.json についての知識も必要。 PHP に Laravel、それに加えて npm となると、かなり奥が深くなってきますね。

注意③　Laravel自体のバージョン

Laravel と Rails のバージョン経緯（データ： Wiki）

2011年に登場した Laravel、 2005年開始の Ruby on Rails と早くもバージョン No. が同じです（上図）。コレは Laravel は半年に一度のペースでバージョンアップ中、つまりバージョン更新が比較的早い・頻繁ということ。多少バージョンが変わって、 Laravel 自体の仕様が変わっても柔軟に対応できないと、今勉強する Laravel を 2年後、 3年後安心して利用できないということですね。

結局表面的な Laravel 操作を覚えても ❌ で、根本的な Laravel の構成・動き、 npm などとの絡みを理解しないと継続利用は難しいということでしょう。Laravel に対する自分のモチベーションを確認した上で学習を取り組む方がいいかもしれませんね。 8ヶ月前の Laravel 6 と今の Larabel 8 では、プロジェクトのディレクトリ構造も違ってきます...

その他の注意点

今回実際に独学で Laravel を利用してみて感じたことですが、「自分の欲しい情報が "ジャストフィット" で見つかりにくい、見つからない」というストレス。例えば Laravel のプロジェクトを作成するコマンド laravel new 〇〇 が上手くいかない時。コマンド laravel のパスが上手く通っていないことはわかるものの、具体的にどうすればいいか、解決するのに時間がかかります。

Laravel に関するネット上の情報は多いものの、セットアップ方法が違ったり、開発環境が違ったりすると同じ問題のソリューションに対しても上手くいかないことがほとんど。この過程を数回繰り返すと、心身共にくたびれます...

また Laravel に関する情報は Linux 系が多い印象で、 Windows での Laravel 情報は少ないと思っていた方がいいでしょう。これは Laravel 自体の最終セットアップがサーバーになりますし、Laravel公式が推奨する開発環境（Home Stead）に Ubuntu（Linux）が搭載されているため、 Linux 系の情報が多いと考えられます。つまり、 Windows ユーザーの方にとっては OS 面での利用環境のストレスも加わるということ。 Windows派の方は、ちょっと覚悟した上で Laravel 取り組む方がいいかも、ですね。

【余談　Laravelのエラー対策】

laravel new 〇〇が上手くいかない時、 2つの項目を確認し解決しました。 1つはパス、もう 1つは Composer のセット内容。 Composer を「 composer.phar 」でセットするのと、「 composer-setup.php 」でセットするのではパスの設定が違ってきます。 Laravel、 Composer、パスと 3つぐらいの不安定要素が絡むと一気に解決難易度が上がる印象。あれこれ情報をミックスして Laravel を起動しようとするのではなく、一連の流れにそって、情報源を 1箇所にして作業することをオススメしますね。

さあ Laravel に関する基本情報はここまで。ココからは実際に Laravel をセットする様子や Laravel の MVC や CRUD を使う様子をご紹介していきます。

Laravel入門：インストール方法

Laravel のインストール、セットアップ方法はいくつかパターンがあります。またどの環境に Laravel をセットしようか、という点も悩むところ。

どの方法がシンプルで分かりやすいか、以下の方法を試してみました。

VitualBox で Ubunutu を起動し、Laravel をインストール
Homesteadを使って Laravel をインストール
AWS（無料利用枠）の OS: Ubuntu に Laravel をインストール
VPSサーバー： Conoha に OS:Ubuntu をセットし、Laravel をインストール
Heroku に Laravel をセット
レンタルサーバー：X-Server に Laravel をインストール
ローカル環境に Larabel をインストール（SQLite）

Heroku以外は Laravel を動かすための環境整備が必要だったり、 Laravel をインストールしてセットアップしないといけなく、特に最初の Welcome画面を開くのに一苦労。AWS などのサーバー環境で Laravel を動かせれば、自分のパソコン環境を維持したまま Larabel 開発を行えますが、ポートや .env ファイルの環境設定などが少し難。

ローカル環境については、XAMPP を使って Larabel をセットアップする方法も有りますが、私の場合 XAMPP の Apache がエラーで起動しないため、少し考えました。「そうだ、Laravel のテスト環境にサーバーの Apache は必須でない、でもわざわざデータベースのために XAMPP を起動するのも重いしな」。その結果、データベースは Mac に標準で入っている SQLite でOK、という結論に。「Laravel SQLite」で検索しても情報がヒットするので大丈夫そう。

SQLiteはテスト環境用です、同時書き込みが弱かったりしますので本番環境では使わないようにご注意ください。

この Larabel + SQLite の開発環境であれば最低限の開発環境整備でよく、 PC 負荷も比較的少なく、 Laravel を学習することが可能。今回はこの方法で Laravel をインストール及びセットアップし、Welcome 画面まで表示する方法をご紹介します。

まず Laravel は PHP ベースで動かしますので、PHP の実行環境が必要。 PHP、単に　PHP 公式サイトからインストールする方法もありますが、 phpenv を使えば PHP バージョンを柔軟に変更できるという利点も。 PHP の使用用途によって、標準の PHP インストールか phpenv か選んでください。

PHP のインストール方法についてはたくさんのサイトで紹介されていますので割愛させて頂き、次は Laravel のバージョン管理などを司る Composer という PHP マネジメントツールをインストール。こちらは公式ページに書かれているコマンドを実行するだけ。

php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
php -r "if (hash_file('sha384', 'composer-setup.php') === 'c31c1e292ad7be5f49291169c0ac8f683499edddcfd4e42232982d0fd193004208a58ff6f353fde0012d35fdd72bc394') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
php composer-setup.php
php -r "unlink('composer-setup.php');"

https://getcomposer.org/download/

そして composer とターミナルもしくは PowerShell で叩けば Composer に関する情報が紹介されます。

この時もし Composer のバージョンが１系と古かった場合、 Laravel のコマンドを実行する度に「古いね」と注意されますので composer self-update で Composer 自体のバージョンを上げるようにしましょう。

Macの方はコレで Larabel を起動することができます。Windows の方は SQLite をダウンロードして sqlite3 --version で SQLite 環境が整っていることをご確認ください。

Laravel の開発環境には Node.js や Yarn が必要ですが、 Welcome画面の表示だけなら不要なため、割愛させて頂きます。ローカル環境なら Node.js もダウンロードマネジャーで比較的簡単にインストールでき、また Vue.js や React を検討されている方は nodebrew で Node.js のバージョン管理ができる方が ◎。 Laravel だけでも複雑な状況に Node.js の最適なインストール環境、チョットややこしいので控えます。

上記のような　PHP、Composer、 SQLite の環境で以下のコマンドを実行。

composer create-project --prefer-dist laravel/laravel プロジェクト名

例）composer create-project --prefer-dist laravel/laravel myapp

そして cd myapp でプロジェクトディレクトリに移動して、以下のコマンドを実行すれば Laravel をインストールできたことが確認でき、 Welcome画面も確認できます。

php artisan --version
php artisan serve

そして Laravel プロジェクトでデータベースが使えるように SQLite を以下のようにセット。

Laravel プロジェクト内の .env ファイルを上図のように SQLite 仕様に変更し、 php artisan migrate を実行すると Larabel でデータベースが使えることが確認できます。

Laravelで簡単なTodoアプリを作る（MVCとCRUDを体験）

以下は Laravel を使って ToDo アプリを作成する様子。こちらは Node.js や Yarn などの環境も必要になりますので、Laravel のセットアップが完了し、挑戦してみたい方はご参考ください。尚、以下のチュートリアルは Larabel 6 のものになり、一部ディレクトリ構造等が異なる点、ご了承ください。

composer create-project --prefer-dist laravel/laravel todo

or

laravel new todo

まずは先ほどとは別の Laravel プロジェクトを上記コマンドで始動。一通りセットアップが完了したらプロジェクトディレクトリに移動して php artisan serve もしくは php artisan --version でプロジェクトの作成を確認。

composer require laravel/ui --dev
php artisan ui bootstrap
npm install && npm run dev

今回は Laravel で標準的に使用できる Bootstarp を利用。公式ドキュメントを元に Bootstarp の利用環境をセットしていきます。上記コマンドを実行すると上図の様にエラーが。 2つエラーが出てるようで、最初の方は Node.js や npm、 Yarn のバージョンに関するもの。 2つめは、 npm のパッケージ Popper.js のバージョンがよくないとのこと。まずは最初のエラーから対応していきます。

今回 Node.js と npm は、公式サイトからではなく sudo apt install nodejs npm でインストールしました。その時のバージョンは、 Node.js 8.0.9、 npm 3.5.2 でした。 Laravel 自体はこれらのバージョンで問題ありませんでしたが、 Laravel + Bootstarp となると ❌ なよう。

この問題に対しては、 Node.js を "アップグレード"する方法と "再インストール"する方法の 2種類が考えられますね。今回は以下のコマンドで Node.js を 8 から 12 にアップグレードしました。

sudo npm install n -g
sudo n stable
sudo apt purge -y nodejs npm
sudo apt autoremove
exec $SHELL -l

コマンド実行結果は、上図参照

ポップアップ処理を手伝ってくれる Popper.js

次は Popper.js のバージョンに関するエラー。実はこのエラー、出ていても Bootstarp の環境は作成できます。最初は npm install && npm run dev を実行しても、 Todoプロジェクト内に変更がないため「やっぱりダメだな...」と思っていましたが、実はディレクトリを更新すると Bootstarp に必要な js と css が登場。

参考までに Popper.js を確認すると 2週間ほど前に、バージョン 1を廃止して 2に移行した様子（上図）。そのため npm install で依存関係のエラーが、しかし、よく Popper.js のドキュメントを読むと、 1.14.3 が利用可能。コマンド上のエラー文だけ読むと、バージョン 1 は ❌、バージョン 2にするべきか、一体どうすれば... となるのですが、 Popper公式を確認すると安心しますね。完全に文系力が必要と、しみじみ感じます...

そして Laravelプロジェクトにセットした Bootstarp は、 public/css と public/js フォルダ内にファイルが自動生成。中身を確認すると上図の様に。

次は Todo の情報を管理するためにデータベースと Laravel プロジェクトを接続。 Laravel のデータベースの設定内容は、 .env ファイルに書かれていて、データベース名やパスワードを変更します（上図参照）。ちなみにデータベースの作成は以下のコマンド。

mysql -u root -p

create database データベース名;
exit

Laravel のデータベース設定を終えたら一旦 php artisan migrate で MySQL との接続確認。すると上図のようなエラーが。これは Laravel とデータベースが接続できなかった為に発生したエラーで、 .env の設定内容や MySQL が起動しているか status を確認するなどが基本。しかし一向に接続できない...

時間をかけて調べていくと、どうも Laravel バージョン6 と MySQL バージョン8 の SHA256 方式の接続は ❌ とのこと（そもそも MySQL で SHA256 セットしていませんが...）。この問題の解決策としては、 MySQL のパスワード方式を SHA256 から従来のパスフレーズ方式に変更できれば OK。以下のコマンドでユーザーのパスワード方式を変更できます。

mysql -u root -p

select user, plugin from mysql.user;

ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'パスワード';
exit

上記コマンド実行結果は、上の画像を参考下さい。ユーザー：root の plugin が cashing_sha2_password から mysql_native_password に変わっています。

MySQLのパスワード形式を修正したところで、再び php artisan migrate で接続を確認。上手くいった様子が確認できます（上図）。

php artisan make:model Todo --migration

さあそれでは今回利用する Todo アプリ用のデータベースのテーブルを作成するために、上記コマンドで実行ファイルを作成。コマンド実行後、 database/migrations ディレクトリ下に、今の日付のファイルが生成。このファイル内の up() 関数を編集して、利用したいデータをセット。今回はシンプルに id と時間、タイトルとメモの 4項目をセット。

参考までに上記設定にして、アプリを起動させると結果は以下のようになります。

今回のアプリ完成後のデータベースの様子

database/migrations ファイルを編集したら、 php artisan migrate を実行し、 MySQL に todos テーブルを作成。

次はデータベースとデータをやり取りするための設定を app/Todo.php でセット。今回は title と memo のデータを読み書き。コード内の $fillable は、データをセキュアに通信するための Larabel 特有の機能。詳しい内容については公式ドキュメントをご確認ください。

php artisan make:controller TodoController --resource

そして次はコントローラ操作。 MVC の "C" ですね。上記コマンドを実行すると app/Http/Controllers 内に TodoController.php が生成されます。コマンド実行時に --resource をつけることで、 CRUD の index() や edit()、 destroy() が自動生成。

【Laravelの CRUD自動生成項目】

・ index()
・ create()
・ store()
・ show()
・ edit()
・ update()
・ destroy()

これで MVC の "MModel" と "CController" までできました。あとは VView ですね。

Route::resource('todos', 'TodoController');

View の前にルートを確認。現在は Laravel の Welcome 画面のルート設定しかされていません。 Todo アプリを表示できるように routes/web.php を上図のように編集。これで localhost:8000/todos にアクセスすると、 TodoController が呼び出されて、 TodoController.php で定めた CRUD によって処理が遂行されます。

ココからは TodoController の index() や edit() などに関するコード的な項目になりますので、興味ある方は以下のタブを開いて確認してみて下さい。また今回の Todo アプリについては GitHub にもコードをあげていますので、合わせてご参考下さい。

app/Http/Controllers/TodoContolloer.php


<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Todo;

class TodoController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        #$todos = Todo::all();
        $todos = Todo::orderBy('id','desc')->get();
        return view('todos.index', compact('todos'));
    }

/**
 * Show the form for creating a new resource.
 *
 * @return \Illuminate\Http\Response
 */
public function create()
{
    return view('todos.create');
}

/**
 * Store a newly created resource in storage.
 *
 * @param  \Illuminate\Http\Request  $request
 * @return \Illuminate\Http\Response
 */
public function store(Request $request)
{
    $request-&gt;validate([
        'title'=&gt;'required'
    ]);

    $todo = new Todo([
        'title' =&gt; $request-&gt;get('title'),
        'memo' =&gt; $request-&gt;get('memo')
    ]);
    $todo-&gt;save();
    return redirect('/todos')-&gt;with('success', 'todo saved!');
}

/**
 * Display the specified resource.
 *
 * @param  int  $id
 * @return \Illuminate\Http\Response
 */
public function show($id)
{
    $todo = Todo::find($id);
    return view('todos.show', compact('todo'));
}

/**
 * Show the form for editing the specified resource.
 *
 * @param  int  $id
 * @return \Illuminate\Http\Response
 */
public function edit($id)
{
    $todo = Todo::find($id);
    return view('todos.edit', compact('todo'));        
}

/**
 * Update the specified resource in storage.
 *
 * @param  \Illuminate\Http\Request  $request
 * @param  int  $id
 * @return \Illuminate\Http\Response
 */
public function update(Request $request, $id)
{
    $request-&gt;validate([
        'title'=&gt;'required'
    ]);

    $todo = Todo::find($id);
    $todo-&gt;title =  $request-&gt;get('title');
    $todo-&gt;memo = $request-&gt;get('memo');
    $todo-&gt;save();

    return redirect('/todos')-&gt;with('success', 'Todo 更新完了');
}

/**
 * Remove the specified resource from storage.
 *
 * @param  int  $id
 * @return \Illuminate\Http\Response
 */
public function destroy($id)
{
    $todo = Todo::find($id);
    $todo-&gt;delete();

    return redirect('/todos')-&gt;with('success', 'Todo １つ完了');
}


}

resources/views/base.blade.php


<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Lravel Todo</title>
    <link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css" />
</head>
<body>
    <div class="container">
      @yield('main')
    </div>
    <script src="{{ asset('js/app.js') }}" type="text/js"></script>
  </body>
</html>

resources/views/todos/index.blade.php


@extends('base')
@section('main')
<div class="col-sm-12">
  @if(session()->get('success'))
    <div class="alert alert-success">
      {{ session()->get('success') }}
    </div>
  @endif
</div>
<hr>
<div>
 <a style="margin: 15px;" href="{{ route('todos.create')}}" class="btn btn-primary">Todo追加</a>
</div>
<hr>
<div class="row">
<div class="col-sm-12">
    <h1 class="display-3">Todoリスト</h1>
  <table class="table table-striped">
    <thead>
        <tr>
          <td>ID</td>
          <td>タイトル</td>
          <td>メモ</td>
          <td colspan = 2>Actions</td>
        </tr>
    </thead>
    <tbody>
        @foreach($todos as $todo)
        <tr>
            <td>{{$todo-> id}}</td>
            <td>
                <a href="{{ route('todos.show',$todo->id)}}">{{$todo-> title}}</a>
            </td>
            <td>{{$todo-> memo}}</td>
            <td>
                <a href="{{ route('todos.edit',$todo->id)}}" class="btn btn-primary">編集</a>
            </td>
            <td>
                <form action="{{ route('todos.destroy', $todo->id)}}" method="post">
                  @csrf
                  @method('DELETE')
                  <button class="btn btn-danger" type="submit">完了</button>
                </form>
            </td>
        </tr>
        @endforeach
    </tbody>
  </table>
<div>
</div>
@endsection

resources/views/todos/create.blade.php


@extends('base')
@section('main')
<div class="row">
 <div class="col-sm-8 offset-sm-2">
    <h1 class="display-3">Todo 追加</h1>
  <div>
    @if ($errors->any())
      <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
              <li>{{ $error }}</li>
            @endforeach
        </ul>
      </div><br />
    @endif
      <form method="post" action="{{ route('todos.store') }}">
          @csrf
          <div class="form-group">
              <label for="title">タイトル:</label>
              <input type="text" class="form-control" name="title"/>
          </div>
          <div class="form-group">
              <label for="memo">メモ:</label>
              <input type="text" class="form-control" name="memo"/>
          </div>
          <button type="submit" class="btn btn-primary">追加</button>
      </form>
  </div>
</div>
</div>
@endsection

resources/views/todos/edit.blade.php


@extends('base')
@section('main')
<div class="row">
    <div class="col-sm-8 offset-sm-2">
        <h1 class="display-3">Todo 内容変更</h1>
        @if ($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
        <br />
        @endif
        <form method="post" action="{{ route('todos.update', $todo->id) }}">
            @method('PATCH')
            @csrf
            <div class="form-group">
                <label for="title">Todo:</label>
                <input type="text" class="form-control" name="title" value={{ $todo->title }} />
            </div>
            <div class="form-group">
                <label for="memo">メモ:</label>
                <input type="text" class="form-control" name="memo" value={{ $todo->memo }} />
            </div>
            <button type="submit" class="btn btn-primary">変更</button>
        </form>
    </div>
</div>
@endsection

resources/views/todos/show.blade.php


@extends('base')
@section('main')
<div class="row">
    <div class="col-sm-12">
        <h1 class="display-3">Todoの確認</h1>
        <ul class="list-group list-group-flush">
            <li class="list-group-item">ID： {{$todo->id}}</li>
            <li class="list-group-item">Todo： {{$todo-> title}}</li>
            <li class="list-group-item">メモ： {{$todo-> memo}}</li>
        </ul>
    </div>
</div>
<hr>
<a href="{{ route('todos.index')}}">もどる</a>
@endsection

〇〇.blade.phpファイル

Blade は、 Rails の〇〇.html.erb に似たテンプレートエンジン。 PHP 機能を制限なく利用できる特徴があります。

プログラムの概要

① localhost:8000/todos にアクセス
② TodoContoller によって、 resources/views/todos/index.blade.php が反応
③ Todo追加ボタンをクリックすると、 TodoContoller 経由で localhost:8000/todos/create にアクセス
④ resources/views/todos/create.blade.php が反応し、 Todo 追加画面を表示
⑤ 追加ボタンのクリックで localhost:8000/todos/store に入力データがポスト
⑥ localhost:8000/todos/store は TodoContoller の store() メソッドによって処理
⑦ 入力データがデータベースに保存され、 localhost:8000/todos にリダイレクト

⑧ トップページでTodoのタイトルがクリックされると、 TodoContoller経由で resources/views/todos/show.blade.php が反応し、 該当項目のデータをデータベースより引用、表示
⑨ もどるボタンで resources/views/todos/index.blade.php にアクセス

⑩ トップページで 編集ボタンをクリックすると、 TodoContoller経由で resources/views/todos/edit.blade.php が反応
⑪ データ修正後は、 TodoContoller の update() によってデータベース内のデータが書き換えられ、トップページにリダイレクト

⑫ 完了ボタンを押すと、 TodoContoller の destroy() によってデータ削除【delete()】が実行、そしてトップページにリダイレクト

さてプログラムの編集が完了したら、 php artisan serve で実行。エラーなくプログラムを構成できていたら、以下のように Todoアプリが起動。

Laravel を使った Todo アプリのトップ画面及び Todo 追加と詳細画面

データの並び替えは、上図のように Laravel に備わっている orderBy() を使うと簡単に降順、昇順変更可能。

そして最後にエラー画面を確認。

閉じカッコがなくてエラーが出ている様子

私は、今まで Ruby on Rails や Django などのフレームを経験してきましたが、 Laravel のエラー画面はソフトな感じ。エラーの原因のコードをハイライトしてくれ、リクエストの情報なども提供。これだったらエラーの度に凹まずに、積極的にアプリ開発に取り組めそう。

今回ご紹介した内容を実際に操作している様子の動画

本稿と合わせてご参照頂ければ幸いです。

今回のコード： GitHub/oshimamasara

＼Webサイト担当者としてのスキルが身に付く／

無料カウンセリングはこちら

まとめ

今回興味本位で取り組んだ Laravel。実際使ってみると Laravel のことだけではなく、 Composer、 Node.js、 npm、 MySQL、 JSON など様々な Webテクノロジーが融合して Laravel が動いていると実感。これは個人的な感想ですが、「プログラミング初心者には、荷が重すぎる...」と思い、コワーキングスペースの方にも「とりあえず PHP やってからでよくない？」と Laravel は薦めませんでした。

しかし、一方で PHP も Node.js もデータベースも Linux もある程度自由に使える方にとっては Laravel かなり強力なツールと実感。 MVC、 CRUD をはじめ、開発側からリリースされているパッケージ群（決済やAPI搭載機能など）もかなり強力。さすが GitHub で急上昇しているだけあるな、と痛感する限りです。

一方で Laravel スキルホルダーに対する求人状況。

2020.02.11 時点

Wantedly を除いて、概ね Laravel より WordPress に対する需要の方が強い様子。つまり焦って難しい Laravel をして、挫折リスクを高めるより、着実に PHP や HTML、 CSS などの基礎を築きつつ、徐々にレベルアップしていく方が安全、と考えられませんか？あくまで PHP を学ぶ学習目的がドコにあるか、という点が重要にはなってきますが、プログラミングはじめて、コマンド操作は未経験、という状況であればハイスペックな Laravel より、 PHP 自体を堪能する方が適切と考えます。

「あぁ、できると思ったけど、やっぱり基礎抜きではフレームワークきついわ...」という方、 CodeCamp で基礎学習をブートアップしてみませんか？ CodeCamp では PHP の基礎や MySQL の基礎、それから HTML や CSS、 JavaScript の基礎をレッスンしています。「えっ、スクール高いやろっ..」と思われた方、まずは "スクール" の価値を無料体験で確かめてみませんか？「そうや今日は早く帰る日や」という方、よろしければ公式サイトから無料体験の "空き" チェックしてみて下さい。きっと前向きな気分になれると思いますよ。