Symfony勉強会 #6 Silexチュートリアル

2012年7月11日

symfony-logo

先日、Symfony勉強会 #6 Silexワークショップに参加しました。

Silexは全くの初心者だった私ですが、ワークショップでシンプルなCRUDアプリを作成しながらSilexの基本を学ぶことができました。composerの使い方も同時に学ぶことができてよかったです。忘れないうちにワークショップで学んだ内容を整理しておきます。

動作確認環境

  • PHP5.3.12

目次

  1. 開発するアプリの仕様
  2. 事前準備
  3. 会員登録フォームの表示
  4. 会員登録ロジックの作成
  5. テストを書いてリファクタリング

開発するアプリの仕様

仕様

member テーブルに対し、登録・更新・参照を行うアプリケーションを作成する

テーブル定義

CREATE TABLE `member` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `email` varchar(255) NOT NULL,
  `password` varchar(64) NOT NULL,
  `created_at` datetime NOT NULL,
  `updated_at` datetime NOT NULL,
  PRIMARY KEY (`id`),
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

ルーティング

GET     /member/         会員情報表示
GET     /member/register 会員登録フォーム表示
POST    /member/register 会員登録処理
GET     /member/edit     会員編集フォーム表示
POST    /member/edit     会員編集処理

事前準備

HelloWorldを済ませておく

事前にHelloWorldを表示するところまで進めておきます。SilexのインストールからHelloWorldは下記の記事が参考にしてください。

symfony-logo
Silexをcomposerからインストールする

Silexをcomposerからインストールし、HelloWorldの表示までのメモです。 Silexとは、Symfon ...

続きを見る

私は、ドキュメントルート直下にsilexディレクトリを作成し、その中にsilexをインストールしました。ディレクトリは下記の構造になっています。

silex
├── composer.json
├── composer.lock
├── composer.phar
├── web
│  ├── index.php
│  └── .htaccess
│
└── vendor
    ├── autoload.php
    ├── composer
    ├── pimple
    ├── silex
    └── symfony

データベース設定

データベース、テーブル、ユーザーを作成します。この記事では、下記のSQLを実行したことを前提にコーディングしています。

--データベース作成
CREATE DATABASE silex DEFAULT CHARACTER SET utf8;
--テーブル作成
CREATE TABLE `silex`.`member` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `email` varchar(255) NOT NULL,
  `password` varchar(64) NOT NULL,
  `created_at` datetime NOT NULL,
  `updated_at` datetime NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
--ユーザー作成
GRANT ALL PRIVILEGES ON *.* TO 'admin'@'localhost' IDENTIFIED BY 'admin' WITH GRANT OPTION;

会員登録フォームの表示

/member/registerにGETでリクエストした際、会員登録フォームを表示します。

記事の都合上、一気にtwigテンプレートまで書きますが、ルーティング、twigと段階を踏んで少しずつ進めるとよいです。

twigのダウンロード

テンプレートエンジンにtwigを使用します。composer.jsonを下記のように編集します。

{
    "minimum-stability": "dev",
    "require": {
        "silex/silex": "1.0.*",
        "twig/twig": "1.8.*"
    }
}

下記コマンドを実行してtwigをダウンロードします。

php composer.phar upate

index.php

HelloWorldが書かれているindex.phpを下記のように変更します。

silex/web/index.php

require_once __DIR__.'/../vendor/autoload.php';

$app = new Silex\Application();
$app['debug'] = true;

$app->register(new Silex\Provider\TwigServiceProvider(), array(
	'twig.path' => __DIR__ . '/../views',
));

$app->get('/member/register', function() use($app) {
    return $app['twig']->render('member/register.html.twig');
});
$app->run();

twigテンプレートの作成

silexフォルダの直下に、viewディレクトリを作成し、その中にtwigテンプレートを作成します。

{# /silex/view/member/register.html.twig #}
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<title>会員登録</title>
</head>
<body>
<form action="{{ app.request.baseUrl }}/member/register" method="post" class="well">
<div>
メールドレス
<input type="text" name="member[email]" value="" />
</div>
<div>
パスワード
<input type="password" name="member[password]" value="" />
</div>
<button type="submit" class="btn">登録</button>
</form>
</body>
</html>

動作確認

http://localhost/silex/web/member/register にアクセスして動作確認します。

ルーティングでエラーが出る方は、.htaccessを確認してください。HelloWorldを試したばかりの方はハマリどころだと思います。本記事の構造だと、.htaccessは下記のようになります。

<IfModule mod_rewrite.c>
    Options -MultiViews
    RewriteEngine On
    RewriteBase /silex/web
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
</IfModule>

会員登録ロジックの作成

会員の登録フォームができましたので、この画面からPOSTリクエストを送信し、DBに情報を保存するところまで作成します。

記事の都合上、一気に書いていますが、ルーティング、twig、Doctrineのインストールと段階を踏んで少しずつ進めるとよいです。

Doctrineのダウンロード

DBアクセスにDoctrineを使用します。composer.jsonを下記のように編集します。

{
    "minimum-stability": "dev",
    "require": {
        "silex/silex": "1.0.*",
        "twig/twig": "1.8.*",
        "doctrine/dbal": "2.2.*",
        "doctrine/common": "2.2.*"
    }
}

下記コマンドを実行してDoctrineをダウンロードします。

php composer.phar upate

index.php

index.phpを下記のように変更します。

// ...
$app = new Silex\Application();
// ...
$app->register(new Silex\Provider\DoctrineServiceProvider(), array(
    'db.options' => array(
        'driver' => 'pdo_mysql',
        'dbname' => 'silex',
        'host' => 'localhost',
        'user' => '',
        'password' => ''
    )
));

// ...
$app->post('/member/register', function() use($app){
    $request = $app['request'];
    $member = $request->get('member');
    $stmt = $app['db']->prepare("
       INSERT INTO member SET
         email = :email
        ,password = :password
    ");
    $stmt->bindParam(':email', $member['email']);
    $password = md5($member['password']);
    $stmt->bindParam(':password', $password);
    $stmt->execute();
    return $app['twig']->render('member/finish.html.twig', array(
        'member' => $member
    ));
});

twigテンプレートの作成

完了ページのテンプレートを作成します。

{# /silex/view/member/register.html.twig #}
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<title>会員登録完了</title>
</head>
<body>
<div>
メールドレス
{{ member.email }}
</div>
<div>
パスワード
{{ member.password }}
</div>
</body>
</html>

動作確認

http://localhost/silex/web/member/register にアクセスし、登録フォームからPOSTの動作確認を行います。

テストを書いてリファクタリング

このアプリはindex.phpにロジックが集中しており、画面が増えてくるとメンテナンスしづらくなりそうです。ワークショップでは、このあとMVCの形に変更する予定でしたが、変更途中で時間切れとなりました。消化不良だったので、自宅で続きをやってみました。

次回はテストを書きます。

symfony-logo
Symfony勉強会 #6 Silexチュートリアル ファンクショナルテスト

前回はSilexのCRUDアプリを作成しました。 今回はこのアプリをファンクショナルテストでガードします。 PHPUni ...

続きを見る

-技術ブログ
-,