【PHP学習】初心者必見!『Laravel』入門&体験記



【PHP学習】初心者必見!『Laravel』入門&体験記

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

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

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

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

本稿で利用する Laravel のバージョン: Laravel Framework 6.14.0 (2020.02.10時点の最新版)

目次
  1. PHPのフレームワークLaravel入門&体験記
  2. Laravelとは
  3. プログラミング初心者にとってのLaravel注意点
  4. Laravel入門:開発環境の作成について
  5. Laravelの開発環境を作る
  6. Laravelで簡単なTodoアプリを作る(MVCとCRUDを体験)
  7. 今回ご紹介した内容を実際に操作している様子の動画
  8. まとめ

PHPのフレームワークLaravel入門&体験記

Laravelとは

image

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

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

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

image

データデータ収集に用いたプログラム(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注意点

image

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

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

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

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

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

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

既に Laravel6 に対応できない 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 を 2年後、 3年後安心して利用できないということ。

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

その他の注意点

今回実際に独学で 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入門:開発環境の作成について

image

Laravel は PHP のパッケージ管理: Composer を利用してインストールします。

composer global require laravel/installer

もしくは

composer create-project laravel/laravel sample

しかし一般的な 「Laravel 入門サイト」 に書いてあることだけでは ❌ で、公式ページのインストール情報を確認すると、

『 Laravel Homestead を使って Laravel 開発環境を作成することを強く薦めます』

とのこと。 多くの方が "Homestead" ?? となると思いますが、 Homestead をセットしようと思うと VirtualBox や VMWare が必要。さらに 18,000文字以上の公式ドキュメントを読んで Homestead をインストール... この時点で PHP、 Composer、 Laravel、 Homestead ... どうでしょうか、分からないことばかりで段々不安になってきませんか?

Homestead は、 Windows でも Mac でも Laravel 開発ができる、ということで開発されているもの。強力なツールであることには違いありませんが、少し大変そうなので今回は公式ドキュメントに書かれている要件を満たして、 Homestead なし・・で Laravel の実行環境を構築しようと判断しました。 Homestead を使わない分、 VPS サーバーなどでも Laravel の実行環境を作る際に役立つと思います。

【余談 Homesteadについて】

Homestead は Ubuntu 18.04 をベースにシステム設定されている Laravel の実行環境の一つ。 Homestead の中には以下のようなプログラム群がセットされています。

【Homestead に含まれているプログラム群】
Ubuntu 18.04 lmm for MySQL or MariaDB database snapshots ngrok
Git Sqlite3 Xdebug
PHP 7.4 PostgreSQL XHProf / Tideways / XHGui
PHP 7.3 Composer wp-cli
PHP 7.2 Node (With Yarn, Bower, Grunt, and Gulp)
PHP 7.1 Redis
PHP 7.0 Memcached
PHP 5.6 Beanstalkd
Nginx Mailhog
MySQL avahi
https://laravel.com/docs/6.x/homestead

Homestead のインストールだけで 9GB 近くデータ容量が必要に。また MySQL のデフォルト・データサイズは 40GB までなど、仮想環境の中で動く Homestead ならではの制限も。随時改良は行われているようですが、制約に限らず使い方もマスターする必要がありそうですね*

Laravelの開発環境を作る

image

今回 Laravel で Todo アプリを作るための開発環境を作成していきます。セットアップする目標は以下の通り。

php --version
composer --version
node --version
npm --version
mysql --version
yarn --version

こちらの要件を既に満たしていれば composer global require laravel/installer で Laravel をインストールしても問題ないでしょう。 今回は、 PHP ない、 Composer もない、 ナニもない、というゼロ地点から Laravel の Welcome 画面が表示されるところまで環境を作っていきたいと思います。一旦 Welcome 画面が表示できた後に、 Laravel で Bootstarp を使って Todo アプリを作っていきますね。

以下の画像は、 VirtualBox(仮想マシン: Ubuntu 18.04) に PHP や Composer をインストールする様子です。

PHPインストール

sudo apt update

sudo apt-get install php7.2 php7.2-cli php7.2-common php7.2-json php7.2-opcache php7.2-mysql php7.2-mbstring php7.2-zip php7.2-fpm  php7.2-xml

まずは PHP のインストールから実行。 PHP公式ページからのインストールでは Laravel の要求を満たせない可能性がありますので、上記の様に php7.2-mbstringphp7.2-xml などの PHP関連パッケージも一緒にインストール。この PHP に関連するパッケージ、何が必要であるかは Laravel 公式ページに記載されています。

【HomesteadなしでLaravelを動かすために必要な環境】
・ PHP >= 7.2.0
・ BCMath PHP Extension
・ Ctype PHP Extension
・ JSON PHP Extension
・ Mbstring PHP Extension
・ OpenSSL PHP Extension
・ PDO PHP Extension
・ Tokenizer PHP Extension
・ XML PHP Extension

PHP 以外に必要な MySQL や Composer などもインストールしていきます。

Composerインストール

image

Composer インストール完了後の様子

cd ~
curl -sS https://getcomposer.org/installer -o composer-setup.php
sudo php composer-setup.php --install-dir=/usr/local/bin --filename=composer
composer

Composerのインストール方法をネットで調べたり、参考書で見るとやり方はいろいろ。


【Composerインストール方法①】
sudo apt install composer

【Composerインストール方法②】
curl -sS https://getcomposer.org/installer | php
sudo mv composer.phar /usr/local/bin/composer

【Composerインストール方法③ 今回の方法】
curl -sS https://getcomposer.org/installer -o composer-setup.php
sudo php composer-setup.php --install-dir=/usr/local/bin --filename=composer

どのインストール方法でも composer --version とすると、 Composer がインストールできたこと確認できます。 しかし ② の場合、 Laravel プロジェクトを作成する際にエラーが。理由は、 ② の 場合は コンピューターのグローバル環境に Composer をセット、 ③ の場合は ローカル環境にセット、と Composer のインストール設定が違ってくるんですね。

今回のように PHP も Laravel も Composer も.... とやることが山積していると、 "グローバルとか" "ローカルとか" 構わずにインストールしがち。その結果、後々エラーを招きますので、下積みがない中ハイレベルな Laravel を使うというのはやや難しいかも... そうした意味でも Laravel 実行環境オススメの Homestead がいいのでしょうが....(参考: Composer公式サイト

MySQLのインストール

image

curl -OL https://dev.mysql.com/get/mysql-apt-config_0.8.14-1_all.deb
sudo dpkg -i mysql-apt-config*
sudo apt update
sudo apt install mysql-server -y

MySQLのインストール方法も Composer 同様にいくつかあり、やり方次第で簡単に Laravel と接続できたり、接続が難しくなったりいろいろ。

【MySQLインストール方法①】
sudo apt install mysql-client-core-5.7

【MySQLインストール方法②】
公式サイトからインストーラーをダウンロード(https://dev.mysql.com/downloads/installer/)

【MySQLインストール方法③ 今回の方法】
上記コマンド参照

まずポイントは、今回の MySQLは XAMPP(PHPの開発環境) とは関係なく、 phpMyAdmin も 基本なし という点。 そして ① の方法で MySQL をインストールすると、 MySQL にアクセスするためのパスワード設定が面倒に。私はこの "パスワード設定" 問題、諦めて違う方法を試しました。

また ② のインストーラーは、 Windows 用。そして ③ でいくと、 MySQL のインストールバージョンも 5系か 8系か選択できたり、パスワードの設定も可能に(上図参照)。今回は新しいバージョンの 8系をインストールしますが、これが後で問題に...

Node.jsとnpmをインストール

image

Node.js 公式

sudo apt install -y nodejs npm

Node.js のインストール、公式サイトからインストーラーをダウンロードしてセットする方法が一番簡単と思いますが、今回はあえて VPS サーバーなど模して コマンドから Node.js と npm をインストール。すると Node.js は少し古い 8系がインストール。(後で問題が起きます。)

Yarnをインストール
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
sudo apt-get update && sudo apt-get install yarn

Yarnは "糸" という意味ですが、こちらでは JavaScript のパッケージマネジャーとして利用。 公式サイトを確認すると上記コマンドで Ubuntu に Yarn をインストール可能。

はい、一旦各種ソフトがインストールできたところで上図のように確認。 Yarn 抜けていますが、 yarn --version でチェックできます。そして環境が整ったところで Laravel をインストール(下図参照)。

composer global require laravel/installer

しかし、エラーが... エラー文を確認すると "Permission denied" と権限に関することで問題が発生している様子。 どうも home/oshima/.composer にアクセスしたいが、失敗した様子。

sudo chown -R oshima /home/oshima/.composer

今回アクセスに失敗したパスの所有者を上記コマンドで oshima に変更。そして再び Laravel のインストールを実行すると、今回は上手くいきました。

laravel new 〇〇

Laravel のインストールが成功したら、今度は上記コマンドで Laravel プロジェクトを作成... のはずが 「laravel: コマンドが見つかりません」 というエラーに。これは Composer にパスが通っていないために発生するエラー。今回は ホームディレクトリ下の .bash_profile を編集して、 Composer にパスを通します。

【設定ファイルを開く】
vi ~/.bash_profile
【.bash_profile】
export PATH=~/.composer/vendor/bin:$PATH
【ファイルの読み込み】
source ~/.bash_profile

そして再び laravel new 〇〇 を実行すると Laravelプロジェクトに必要なファイル群がインストールされていきます。

Laravelプロジェクトのダウンロードが完了したら、プロジェクトディレクトリに移動して php artisan serve と実行するとサーバーが起動し、 localhost:8000 を開くと Laravel の Wekcome 画面が登場(上図参照)。そしてこの今表示されている Welcome画面は、 resources/views/welcome.blade.php で制御中(下図)。

試しに welcome.blade.php の CSS を変えてみると、変更内容が反映されたことが確認できます(上図参照)。この他にもルートのことやデータベースのことなど、いろいろ確認していきたいところですが、これらについては Todo アプリを作成する過程で紹介させて頂きたいと思います。

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

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/csspublic/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 1つ完了');
}

}

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 のエラー画面はソフトな感じ。エラーの原因のコードをハイライトしてくれ、 リクエストの情報なども提供。これだったらエラーの度に凹まずに、積極的にアプリ開発に取り組めそう。

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

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

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

CodeCampの無料体験はこちら

まとめ

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

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

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

image

2020.02.11 時点

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

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

オシママサラ
この記事を書いた人
オシママサラ
\ 無料体験開催中!/自分のペースで確実に習得!
オンライン・プログラミングレッスンNo.1のCodeCamp