nabeo56BLOG

開発とかプログラムとか

WEBアプリ養成読本の実践(2)

Webアプリエンジニア養成読本[しくみ、開発、環境構築・運用…全体像を最新知識で最初から! ] (Software Design plus)

Webアプリエンジニア養成読本[しくみ、開発、環境構築・運用…全体像を最新知識で最初から! ] (Software Design plus)

2-3 Webアプリケーション開発の下準備

概要

簡易な掲示板アプリケーションを作成する

環境

Composer ライブラリ管理ツール Slimフレームワーク 軽量フレームワーク

作業ディレクトリ作成

$ cd /Vagrant
$ mkdir work
$ cd work
$ mkdir app

Composerでライブラリをインストール

composer.pharをダウンロード
$ php -r "eval('?>' . file_get_contents('http://getcomposer.org/installer'));"
#!/usr/bin/env php
All settings correct for using Composer
Downloading...

Composer successfully installed to: /vagrant/work/app/composer.phar
Use it: php composer.phar
composer.json作成
$ vim composer.json
{
  "require":{
    "slim/slim": "2.*",
    "slim/views": "0.1.*",
    "slim/extras": "2.0.*",
    "twig/twig": "1.*",
    "illuminate/database": "4.0.*",
    "Respect/Validation": "0.5.*"
  },
  "autoload": {
    "psr-0": {"": "lib/"}
  }
}
インストール
$ php composer.phar update
Loading composer repositories with package information
Updating dependencies (including require-dev)
  - Installing respect/validation (0.5.0)
    Downloading: 100%

  - Installing slim/slim (2.4.3)
    Downloading: 100%

  - Installing slim/views (0.1.2)
    Downloading: 100%

  - Installing slim/extras (2.0.3)
    Downloading: 100%

  - Installing twig/twig (v1.16.2)
    Downloading: 100%

  - Installing nesbot/carbon (1.13.0)
    Downloading: 100%

  - Installing illuminate/support (v4.0.10)
    Downloading: 100%

  - Installing illuminate/container (v4.0.10)
    Downloading: 100%

  - Installing illuminate/events (v4.0.10)
    Downloading: 100%

  - Installing illuminate/database (v4.0.10)
    Downloading: 100%

respect/validation suggests installing ext-bcmath (*)
slim/slim suggests installing ext-mcrypt (Required for HTTP cookie encryption)
slim/views suggests installing smarty/smarty (Smarty templating system)
Writing lock file
Generating autoload files

vendorディレクトリが作成され、ライブラリがインストールされた。

Hello Worldを表示する

アプリ作成前にDocumentRootを変更しておく
$ less /etc/httpd/conf/httpd.conf
DocumentRoot "/var/www/html"
$ sudo rm -rf /var/www/html
$ cd /vagrant/work/app/
$ mkdir htdocs
$ sudo ln -s /vagrant/work/app/htdocs /var/www/html
index.phpを作成する
$ cd htdocs
$ vim index.php
<?php
// ライブラリ読み込み
require '../vendor/autoload.php';
// Slimの初期化
$app = new \Slim\Slim([]);
// Slimにルートを登録
$app->get('/', function () {
  echo "Hello!, world!";
});
// 実行
$app->run();
ブラウザで表示

http://localhost/ Hello!, world!が表示された

index.phpにルート登録しているが、別に分ける

Slimにルート登録の箇所を書き換え
$ vim index.php
<?php
// ライブラリ読み込み
require '../vendor/autoload.php';
// Slimの初期化
$app = new \Slim\Slim([]);
// Slimにルートを登録
\Tinitter\Route::registration($app);
// 実行
$app->run();
Routeクラス作成
$ cd ..
$ pwd
/vagrant/work/app
$ mkdir lib
$ cd lib
$ mkdir Tinitter
$ cd Tinitter
$ vim Route.php
<?php
namespace Tinitter;
class Route{
  static function registration($app) {
    $app->get('/', '\Tinitter\Controller\TimeLine:show');
  }
}
showメソッド実装
$ mkdir Controller
$ cd Controller
$ pwd
/vagrant/work/app/lib/Tinitter/Controller
$ vim TimeLine.php
<?php
namespace Tinitter\Controller;
class TimeLine
{
  public function show()
  {
    echo "Hello, world!";
  }
}
ブラウザで表示

http://localhost/ Hello, world!が表示された

Twigテンプレートエンジンを利用する

設定ファイル作成
$ cd /vagrant/work/app/
$ vim config.php
<?php
define('TEMPLATES_DIR_PATH', __DIR__ . '/templates');
index.phpを以下のように追加し修正
$ vim htdocs/index.php
// 設定ファイルの読み込み
require '../config.php';

// Slimの初期化
$app = new \Slim\Slim([
  'templates.path' => TEMPLATES_DIR_PATH,
  'view' => new \Slim\Views\Twig()
]);
showメソッドの修正
$ vim lib/Tinitter/Controller/TimeLine.php
  public function show()
  {
    $app = \Slim\Slim::getInstance();
    $app->render(
      'index.twig',
      ['display_text' => "Hello, world!!"]
    );
  }

テンプレートファイル作成

templatesディレクトリ作成
$ cd /vagrant/work/app
$ mkdir templates
index.twigの作成
$ vim templates/index.twig
{% extends "frame.twig" %}
{% block content %}
  {% autoescape true %}
  hello Twig!<br />
  {{display_text}}
  {% endautoescape %}
{% endblock %}
frame.twigの作成
$ vim templates/frame.twig
{% autoescape true %}
<html>
<head>
  <meta charset="UTF-8">
  <title>Tinitter</title>
</head>
<body>
  {% block content %}{% endblock %}
</body>
</html>
{% endautoescape %}

ブラウザで表示

http://localhost/ hello Twig! Hello, world!!