Tips

PHPおすすめフレームワーク『Laravel5』入門 基本を押さえるサンプル

PHPおすすめフレームワーク『Laravel5』入門 基本を押さえるサンプル

PHPおすすめフレームワーク『Laravel5』入門 基本を押さえるサンプル

はじめに

PHPフレームワークの学習方法として
『「ブログ」やら「掲示版」やらのサンプルアプリケーションをとりあえず作ってみよう』
と、おすすめされることがよくあります。

PHPフレームワークに限らずWebアプリケーションの仕組みを理解する上で、
こういった「ブログ」「掲示版」系のサンプルというのは非常に頻繁に登場します。
やはりデータベースからレコードを取得し、登録、削除する、いわゆる「CRUD」がシンプルな構成で実現できるからでしょう。

さて、PHPのおすすめフレームワーク『Laravel5』を扱う本シリーズでも、
多分に漏れずブログページを作成する手順をまとめていくことにします。

Laravel5を使ったブログサンプルの概要

以下の内容で作成していきます。「基本を押さえる」ことを意識して、なるべくシンプルに。

テーブル定義(Model)

テーブル:articles
・title
・body

ルーティング

メソッド パス 説明 コントローラ&メソッド
GET / 一覧 ArticlesController@index
GET /{id} 詳細 ArticlesController@show
GET /create 新規 ArticlesController@create
POST /store 新規保存 ArticlesController@store
GET /edit/{id} 編集 ArticlesController@edit
PATCH /edit/{id} 編集保存 ArticlesController@update
DELETE /delete/{id} 削除 ArticlesController@destroy

ブレード(View)

・articles/index.blade.php(一覧)
・articles/detail.blade.php(詳細)
・articles/edit.blade.php(編集)
・articles/create.blade.php(新規投稿)

Laravel5を使ったブログサンプルの作成手順

1.LaravelのProject作成

$ composer create-project "laravel/laravel" --prefer-dist blogsystem

※composerインストール済みが前提
※ドキュメントルート以下で実行

2.DB作成(blogsystem)

$ mysql -u root -p
mysql> create database blogsystem;

※MySQLインストール済みが前提

3.「.env」ファイルの変更

DB_DATABASE=blogsystem
DB_USERNAME=root
DB_PASSWORD=XXXX

※上記作成したデータベース及びログイン時のユーザパスワードに合わせる

4.ドキュメントルートの修正

以下がドキュメントルートになるようhttpd.confを修正
/[Document-Root-Path]/lara5.2.blogsystem
※Webサーバ再起動し、表示を確認しておく。
「Laravel5」の文字がかっこよくセンタリングされて表示されればOK。

~ここまででLaravel使用準備OK~

5.routes.phpを編集する

Route::group(['middleware' => ['web']], function () {
    Route::get('/create','ArticlesController@create');          //新規
    Route::post('/store','ArticlesController@store');           //新規保存
    Route::get('/edit/{id}','ArticlesController@edit');         //編集
    Route::patch('/edit/{id}','ArticlesController@update');     //編集保存
    Route::delete('/delete/{id}','ArticlesController@destroy'); //削除    
    Route::get('/{id}','ArticlesController@show');              //詳細
    Route::get('/','ArticlesController@index');                 //一覧
});

※順番注意

6.articlesテーブルを作成するためのmigrationを作成する

$ php artisan make:migration create_articles_table –create=articles

できあがったmigrationファイルのupメソッドを以下のように修正

public function up()
{
    Schema::create('articles', function (Blueprint $table) {
        $table->increments('id');
        $table->timestamps();
        $table->string('title'); //←追加
        $table->text('body'); //←追加
    });
}

7.migrateを実行

$ php artisan migrate
※articlesテーブルが出来上がる。

8.modelを作成

$ php artisan make:model Article

9.tinkerを使ってデータをインサート

$ php artisan tinker
Psy Shell v0.6.1 (PHP 5.5.9-1ubuntu4.13 — cli) by Justin Hileman
>>> $a = new App\Article();
=> App\Article {#632}
>>> $a->title = ‘titleA’
=> “titleA”
>>> $a->body = ‘bodyA’
=> “bodyA”
>>> $a->save()
=> true
>>>

10.インサートレコードを確認

mysql> select * from articles;
+—-+———————+———————+——–+——-+
| id | created_at | updated_at | title | body |
+—-+———————+———————+——–+——-+
| 1 | 2016-02-12 05:26:23 | 2016-02-12 05:26:23 | titleA | bodyA |
| 2 | 2016-02-12 05:35:06 | 2016-02-12 05:35:06 | titleB | bodyB |
| 3 | 2016-02-12 05:35:58 | 2016-02-12 05:35:58 | titleC | bodyC |
+—-+———————+———————+——–+——-+
3 rows in set (0.00 sec)

11.ArticlesControllerを作成する(一覧)

$ php artisan make:controller ArticlesController

※ArticlesControllerを以下のように修正

use App\Article;	//←Modelをuseしておくとメソッドの記述が簡潔に。
class ArticlesController extends Controller
{
    public function index(){
        $articles = Article::all();
        return view('articles.index')->with('articles',$articles);
    }
}

12.Viewを作成する(一覧)

resources/articles/index.blade.php

@foreach($articles as $article)
    <div>
        <p>{{ $article->title }}</p>
        <p>{{ $article->body }}</p>
    </div>
    <hr>
@endforeach

⇒一覧画面が表示されるはず。

13.ArticlesControllerを編集する(詳細)

class ArticlesController extends Controller
{
	~indexメソッド省略~
	
    public function show($id){
        $article = Article::findOrFail($id);
        return view('articles.detail')->with('article',$article);
    }
}

14.Viewを作成する(詳細)

<h1>{{ $article->title }}</h1>
<hr>
<p>{{ $article->body }}</p>

⇒/{id}で詳細画面が表示されるはず。

15.ArticlesControllerを編集する(削除)

class ArticlesController extends Controller
{
    ~indexメソッド省略~
    ~showメソッド省略~
    
    public function destroy($id)
    {
        $article = Article::findOrFail($id);
        $article->delete();
        return redirect('/')->with('flash_message','Article deleted.');
    }
}

16.Viewを編集する(削除)

詳細画面に削除ボタンをつける

<h1>{{ $article->title }}</h1>
<hr>
<p>{{ $article->body }}</p>
<form action="/delete/{{ $article->id }}" method="article">
    {{ csrf_field() }}
    {{ method_field('delete') }}
    <input type="submit" value="Delete"> //←追加
</form>

一覧にフラッシュSessionメッセージ表示箇所(先頭3行)を作成しておく。

@if(Session::get('flash_message'))
        <div>{{ session('flash_message') }}</div>
@endif
@foreach($articles as $article)
    <div>
        <p>{{ $article->title }}</p>
        <p>{{ $article->body }}</p>
    </div>
    <hr>
@endforeach

⇒詳細画面から削除ボタンで削除できるはず。

17.ArticlesControllerを編集する(新規&新規投稿)

class ArticlesController extends Controller
{
    ~indexメソッド省略~
    ~showメソッド省略~
    ~destroyメソッド省略~

    public function create(){
        return view('articles.create');
    }
    public function store(Request $ar){
        $article = new Article();
        $article->title = $ar->title;
        $article->body  = $ar->body;
        $article->save();
        return redirect('/')->with('flash_message','New Article Added !');
    }
}

18.Viewを作成する(新規&新規投稿)

※articles/create.blade.php

<h1>New Article Add Form</h1>
<hr>
<form action="/store" method="article">
    {{ csrf_field() }}
    <input type="text" name="title">
    <textarea name="body"></textarea>
    <input type="submit" value="New Article Add !">
</form>

⇒/createにアクセスすると投稿画面が表示されるはず。

19.ArticlesControllerを編集する(編集)

class ArticlesController extends Controller
{
    ~indexメソッド省略~
    ~showメソッド省略~
    ~destroyメソッド省略~
    ~createメソッド省略~
    ~storeメソッド省略~
    
    public function edit($id){
        $article = Article::findOrFail($id);
        return view('articles.edit')->with('article',$article);
    }
    public function update(Request $pr, $id){
        $article = Article::findOrFail($id);
        $article->title = $pr->title;
        $article->body  = $pr->body;
        $article->save();
        return redirect('/'.$id)->with('flash_message','Article Updated.');
    }
}

20.Viewを作成する(編集)

※articles/edit.blade.php

<h1>Article Edit Form</h1>
<hr>
<form action="/edit/{{ $article->id }}" method="article">
    {{ csrf_field() }}
    {{ method_field('patch') }}
    <input type="text" name="title" value="{{ old('title',$article->title) }}"><br>
    <textarea name="body">{{ old('body',$article->body) }}</textarea>
    <input type="submit" value=" Edit !">
</form>

⇒/edit/{id}でアクセスすると編集画面が表示されるはず。

21.適宜ページ間リンクを設置。

22.適宜HTML,CSS周りを修正。

なるべくシンプルなサンプルにしたのですが、それでも投稿、更新、削除、表示(一覧、詳細)を網羅するとなかなか大変ですね。しかしそれでもやはりLaravel5の開発スピードの速さは尋常ではありません。次回のサンプルは別の機能も備わったものを作成する予定です。

WEBアプリケーション関連 人気連載リンク

基礎からPHPWEBアプリ解発を学ぶなら・・
PHP基礎 連載

より実践的なWEBアプリ開発講座!Bootstrap活用を学ぶなら・・
魁!小野の塾 連載

Recent News

Recent Tips

Tag Search