初めてのLaravel 5.1 : (1) ページの表示フロー

laravel_mvc1

Lavarl は MVCモデルのフレームワークで、処理の流れは基本的には上図のようになります。この記事では上図の Model, Database 部分を除いた、User -> Routing -> Controller -> View の部分をシンプルに追いかけてみます。


プロジェクト作成

まずは新規のプロジェクトを作成します。プロジェクト名を blog とします。

laravel new blog

cd blog
php artisan serve

PHP のビルトインサーバでプロジェクトを起動します。
ブラウザで http://localhost:8000 にアクセスし、”Laravel 5″ のロゴが表示されることを確認します。


ディレクトリ構成

まずはディレクトリ構成を見てみます。たくさんディレクトリやファイルがありますが、ざっと眺めておくだけにしておきます。Laravel を使っていくうちに、段々わかってきます。1歩づつ進みましょう。
まずはこの記事で関連するディレクトリのみ紹介します。

blog
├── app
│   └── Http
│       └── Controllers
└── resources
    └── views

Routing

最初に Routeing 設定を記述する app/Http/routes.php を見てみます。

<?php // app/Http/routes.php

Route::get('/', function () {
    return view('welcome');
});
HTTP メソッド アクション
GET / クロージャー

アクション部分でクロージャー(無名関数)を使っています。
クロージャーの中で、welcomeビューを表示するよう(レスポンスとして返すよう)支持しています。
HTTPメソッドやURIの組合せに応じたアクションを実行するのが、Routing の役割です。


View

次に、上記の ‘welcom’ ビューを見てみます。
ビューファイルは app/resources/views に格納されています。

<!-- app/resouces/view/welcome.blade.php -->

<!DOCTYPE html>
<html>
    <head>
        <title>Laravel</title>

        <link href='//fonts.googleapis.com/css?family=Lato:100' rel='stylesheet' type='text/css'>

        <style>
            ...
        </style>
    </head>
    <body>
        <div class="container">
            <div class="content">
                <div class="title">Laravel 5</div>
                <div class="quote">{{ Inspiring::quote() }}</div>
            </div>
        </div>
    </body>
</html>

これがまさに http://localhost:8000/ にアクセスした時に表示されたHTMLです。

Laravel では bladeというテンプレートエンジンを使って、ビューファイル(HTMLテンプレート)からHTMLを生成しています。その為、ファイルの拡張子は ビュー名.blade.php となります。この例では welcome.blade.php となります。

また、ビューファイルや、ビューファイルからHTMLを生成する機能のことを Viewと呼びます。

View の役割は データをユーザが見やすい形に変換することです。User Interface の出力の部分を担っています。


Controller

先ほどのRoutingでは、アクションにクロージャーを使用していました。
ここでは、簡単なコントローラを作成して、クロージャーと差替えてみます。

artisanコマンドを使って、コントローラを作成します。

$ php artisan make:controller --plain WelcomeController

中身が空のWelcomeController.phpが生成されるので、以下のようにindex()メソッドを追加します。

<?php // app/Http/Controllers/WelcomeController.php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use App\Http\Requests;
use App\Http\Controllers\Controller;

class WelcomeController extends Controller
{
    public function index()
    {
        return view('welcome');
    }
}

indexメソッドは view関数を実行し、その戻り値を返しています。view関数の戻り値がブラウザへのレスポンスになります。

view関数はビューファイルからHTMLを作成するヘルパー関数になります。ここでは ‘welcom’ ビューを使ってHTMLを作成するように指示しています。

コントローラはユーザからの入力データを受け取り、Model に処理を依頼し、実行した結果の表示をViewに依頼します。この例は究極にシンプルで、Viewには何も渡さず、ただHTMLを返してもらっています。

Routing設定のアクションをクロージャーからコントローラに変更します。

<?php // app/Http/routes.php

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

Route::get('/', 'WelcomeController@index');
HTTP メソッド アクション
GET / WelcomeControllerクラスの
indexメソッドを実行する

アクションの部分は “コントローラクラス名@メソッド名”と記述することで、コントローラクラスのメソッドを呼び出すことができます。

ブラウザで http://localhost:8000 にアクセスし、動作確認を行います。
“Laravel 5” のロゴが表示されれば成功です。


まとめ

以下のことが理解できました。

  • Routing -> Controller -> View の一連の流れ
  • Routing, Controller, View のディレクトリ・ファイル構成
  • Routing設定
  • Routing設定のクロージャーからの Viewの呼び出し
  • Controllerからの Viewの呼び出し

Laravel の Routing, Controller, View を駆け足で見てみました。
シンプルな内容でしたが、Webアプリケーションフレームワークの基本フローが学べました。
何事も基本が大切です。

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中