第４回Symfony2勉強会基礎編ワークショップ.1

Symfony2勉強会#4基礎編ワークショップ.1 2011.06.04 上野裕介

目次ディレクトリ構成(10分) バンドルの作成と登録(10分) ルーティングの登録(10分) Twig構文を試す(15分) Twigテンプレートの継承(20分) Twigのキャッシュを見る(10分) 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 2

ワークショップの参考URL Creating Pages in Symfony2 (バンドル作成方法) http://symfony.com/doc/current/book/page_creation.html Creating and using Templates (Sf2とTwigの連携) http://symfony.com/doc/current/book/templating.html Twig Documentation (Twigの基本構文とか) http://www.twig-project.org/documentation Twigと他のテンプレートエンジンの比較 http://fabien.potencier.org/article/34/templating-engines-in-php http://fabien.potencier.org/article/35/templating-engines-in-php-follow-up 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 3

ディレクトリ構成 web src vendor app (bin) 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 5

バンドルの作成と登録バンドルフレームワーク自分のプログラム外部プラグインバンドルの粒度 symfony 1.x と比較 frontend application … FrontendBundle blog module … BlogBundle sfWebBrowserPlugin … WebbrowserBundle 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 7

バンドルの作成と登録 app/consoleコマンド init:bundleコマンド作成されたフォルダを見てみよう 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 8 $ php app/console init:bundle “MyorkshopBundle” src

バンドルの作成と登録名前空間の登録(app/autoload.php) AppKernelへの登録(app/AppKernel.php) 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 9 $loader->registerNamespaces(array( // ... 'My' => __DIR__.'/../src', )); public function registerBundles() { $bundles = array( // ... new MyorkshopBundleyWorkshopBundle(), ); // ... return $bundles; }

ルーティングの登録 app/config/routing.yml src/My/WorkshopBundle/Resources/config/routing.yml コメントアウトをはずす+名前変更 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 11 workshop: prefix: /workshop resource: “@MyWorkshopBundle/Resources/config/routing.yml” workshop_homepage: pattern:/ defaults:{ _controller:MyWorkshopBundle:Default:index } バンドル名:コントローラ名:アクション名

ルーティングの登録 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 12 http://localhost/Symfony/web/app_dev.php/workshop/ 自動生成されたアクションとテンプレートがあるので、 Hello!と表示されます

Twig構文を試す – for文 src/My/WorkshopBundle/Resources/views/Default/index.html.twig 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 14 <ul> {% for key, user in users %} <li>No.{{ key }}: {{ user.name}} </li> {% endfor%} </ul>

Twig構文を試す – for文 DefaultController::indexAction() 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 15 public function indexAction() { $users = array( ‘1’ => array(‘name’=>‘鹿目まどか', 'age'=>14), ‘5’ => array(‘name’=>‘<b>めんま</b>', 'age'=>’?'), ); return $this->render('MyWorkshopBundle:Default:index.html.twig', array('users' => $users)); }

Twig構文を試す {{ ... }} 値や式の結果をテンプレートに出力するための文法 {% ... %} テンプレート内でロジックを制御するための文法 {# ... #} コメントを表すための文法複数行にわたって使用可能 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 16

Twig構文を試す - include src/My/WorkshopBundle/Resources/views/menu.html.twig src/My/WorkshopBundle/Resources/views/Default/index.html.twig (の冒頭に追加) 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 17 <ul> <li>メニュー1</li> <li>メニュー2</li> <li>メニュー3</li> </ul> {% include 'MyWorkshopBundle::menu.html.twig'%}

Twig構文を試す - raw src/My/WorkshopBundle/Resources/views/Default/index.html.twig にrawフィルタを付けるエスケープされなくなる 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 18 <li>No.{{ key }}: {{ user.name}}({{ user.age }})</li> <li>No.{{ key }}: {{ user.name|raw}}({{ user.age }})</li>

Twig構文を試す - format src/My/WorkshopBundle/Resources/views/Default/index.html.twig をformatフィルタで書き直すと printf()関数の様なもの 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 19 <li>No.{{ key }}: {{ user.name}}({{ user.age }})</li> <li>{{ "No.%d: %s(%s)"|format(key, user.name, user.age) }}</li>

Twig構文を試す – その他例だけ紹介 date … DateTime::format()のラッパー(書式はdate()) default … 空要素の初期値を指定(beta3バグあり) 「空」と判定される値は、falseまたは0以外のempty()値 if/elseif/else/endif … 条件分岐 http://www.twig-project.org/doc/templates.html 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 20 {{ “now”|date(‘Y-m-dH:i:s’) }} {{ user.createdAt|date(‘Y/m/d’) }} {{ user.birthday|default(‘----/--/--’) }} {% if users %} … {% endif%}

Twigテンプレートの継承 app/Resources/views/ base.html.twig src/My/WorkshopBundle/Resources/views/ layout.html.twig Default/ index.html.twig 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 22 元からある継承今から作るさっき弄ってた継承

Twigテンプレートの継承 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 23 base.html.twig layout.html.twig <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>{%block title %}Welcome!{%endblock%}</title> {%block stylesheets%}{% endblock%} <link rel="shortcut icon" href="{{asset('favicon.ico')}}" /> </head> <body> {%block body %}{%endblock%} {% block javascripts%}{% endblock%} </body> </html> titleブロック index.html.twig {% extends '::base.html.twig' %} {% block title %}WorkShop{% endblock%} {% block body %} {% include 'MyWorkshopBundle::menu.html.twig' %} {% endblock%} 継承継承 titleブロック {% extends 'MyWorkshopBundle::layout.html.twig' %} {% block body %} {{ parent() }} <!– ここから--> 中身 <!– ここまで {% endblock%} 親のblock呼び出し bodyブロック bodyブロック bodyブロック

Twigテンプレートの継承 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 24 base.html.twig <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>{%block title %}Welcome!{%endblock%}</title> {%block stylesheets%}{% endblock%} <link rel="shortcut icon" href="{{asset('favicon.ico')}}" /> </head> <body> {%block body %}{%endblock%} {% block javascripts%}{% endblock%} </body> </html>

Twigテンプレートの継承 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 25 layout.html.twig {% extends '::base.html.twig' %} {% block title %}WorkShop{% endblock%} {% block body %} {% include 'MyWorkshopBundle::menu.html.twig' %} {% endblock%}

Twigテンプレートの継承 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 26 index.html.twig {% extends 'MyWorkshopBundle::layout.html.twig' %} {% block body %} {{ parent() }} <!– ここから--> 中身 <!– ここまで {% endblock%}

Twigのキャッシュを見る app/cache/dev/twig/* Php codeにコンパイルされている意外ときれいなphp-code シンプルだけど、機能を満たす元のコードとの対応関係がおおよそ分かる 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 28

＼(^o^)／おわり＼(^o^)／ Next step… ブログチュートリアル http://doc.symfony.gr.jp/blog-tutorial/ Symfony2 Book http://symfony.com/doc/current/book/index.html 2011.06.04 Symfony2勉強会#4 基礎編ワークショップ 29

第４回Symfony2勉強会基礎編ワークショップ.1

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (15)

Andere mochten auch

Andere mochten auch (9)

Ähnlich wie 第４回Symfony2勉強会基礎編ワークショップ.1

Ähnlich wie 第４回Symfony2勉強会基礎編ワークショップ.1 (20)

Kürzlich hochgeladen

Kürzlich hochgeladen (10)