Symfony2勉強会#4基礎編ワークショップ.1<br />2011.06.04<br />上野裕介<br />
目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュ...
ワークショップの参考URL<br />Creating Pages in Symfony2 (バンドル作成方法)<br />http://symfony.com/doc/current/book/page_creation.html<br />...
目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュ...
ディレクトリ構成<br />web<br />src<br />vendor<br />app<br />(bin)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />5<br />
目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュ...
バンドルの作成と登録<br />バンドル<br />フレームワーク<br />自分のプログラム<br />外部プラグイン<br />バンドルの粒度<br />symfony 1.x と比較<br />frontend application 	...
バンドルの作成と登録<br />app/consoleコマンド<br />init:bundleコマンド<br />作成されたフォルダを見てみよう<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br...
バンドルの作成と登録<br />名前空間の登録(app/autoload.php)<br />AppKernelへの登録(app/AppKernel.php)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークシ...
目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュ...
ルーティングの登録<br />app/config/routing.yml<br />src/My/WorkshopBundle/Resources/config/routing.yml<br />コメントアウトをはずす+名前変更<br />2...
ルーティングの登録<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />12<br />http://localhost/Symfony/web/app_dev.php/workshop/<br...
目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュ...
Twig構文を試す – for文<br />src/My/WorkshopBundle/Resources/views/Default/index.html.twig<br />2011.06.04<br />Symfony2勉強会#4 基礎編...
Twig構文を試す – for文<br />DefaultController::indexAction()<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />15<br />public f...
Twig構文を試す<br />{{ ... }}<br />値や式の結果をテンプレートに出力するための文法<br />{% ... %}<br />テンプレート内でロジックを制御するための文法<br />{# ... #}<br />コメントを...
Twig構文を試す - include<br />src/My/WorkshopBundle/Resources/views/menu.html.twig<br />src/My/WorkshopBundle/Resources/views/D...
Twig構文を試す - raw<br />src/My/WorkshopBundle/Resources/views/Default/index.html.twig<br />にrawフィルタを付ける<br />エスケープされなくなる<br /...
Twig構文を試す - format<br />src/My/WorkshopBundle/Resources/views/Default/index.html.twig<br />をformatフィルタで書き直すと<br />printf()...
Twig構文を試す – その他<br />例だけ紹介<br />date … DateTime::format()のラッパー(書式はdate())<br />default … 空要素の初期値を指定(beta3バグあり)<br />「空」と判定...
目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュ...
Twigテンプレートの継承<br />app/Resources/views/<br />base.html.twig<br />src/My/WorkshopBundle/Resources/views/<br />layout.html.t...
Twigテンプレートの継承<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />23<br />base.html.twig<br />layout.html.twig<br /><!DOCTY...
Twigテンプレートの継承<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />24<br />base.html.twig<br /><!DOCTYPE html><br /><html><b...
Twigテンプレートの継承<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />25<br />layout.html.twig<br />{% extends '::base.html.twi...
Twigテンプレートの継承<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />26<br />index.html.twig<br />{% extends 'MyWorkshopBundle...
目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュ...
Twigのキャッシュを見る<br />app/cache/dev/twig/*<br />Php codeにコンパイルされている<br />意外ときれいなphp-code<br />シンプルだけど、機能を満たす<br />元のコードとの対応関係...
\(^o^)/おわり\(^o^)/<br />Next step…<br />ブログチュートリアル<br />http://doc.symfony.gr.jp/blog-tutorial/<br />Symfony2 Book<br />htt...
Upcoming SlideShare
Loading in...5
×

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

7,934

Published on

第4回Symfony2勉強会 基礎編ワークショップで使用したスライドです。Symfony2のTwigを使うためのステップです。

Published in: Technology
0 Comments
5 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
7,934
On Slideshare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
30
Comments
0
Likes
5
Embeds 0
No embeds

No notes for slide

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

  1. 1. Symfony2勉強会#4基礎編ワークショップ.1<br />2011.06.04<br />上野裕介<br />
  2. 2. 目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュを見る(10分)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />2<br />
  3. 3. ワークショップの参考URL<br />Creating Pages in Symfony2 (バンドル作成方法)<br />http://symfony.com/doc/current/book/page_creation.html<br />Creating and using Templates (Sf2とTwigの連携)<br />http://symfony.com/doc/current/book/templating.html<br />Twig Documentation (Twigの基本構文とか)<br />http://www.twig-project.org/documentation<br />Twigと他のテンプレートエンジンの比較<br />http://fabien.potencier.org/article/34/templating-engines-in-php<br />http://fabien.potencier.org/article/35/templating-engines-in-php-follow-up<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />3<br />
  4. 4. 目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュを見る(10分)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />4<br />
  5. 5. ディレクトリ構成<br />web<br />src<br />vendor<br />app<br />(bin)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />5<br />
  6. 6. 目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュを見る(10分)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />6<br />
  7. 7. バンドルの作成と登録<br />バンドル<br />フレームワーク<br />自分のプログラム<br />外部プラグイン<br />バンドルの粒度<br />symfony 1.x と比較<br />frontend application … FrontendBundle<br />blog module … BlogBundle<br />sfWebBrowserPlugin … WebbrowserBundle<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />7<br />
  8. 8. バンドルの作成と登録<br />app/consoleコマンド<br />init:bundleコマンド<br />作成されたフォルダを見てみよう<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />8<br />$ php app/console init:bundle “MyWorkshopBundle” src<br />
  9. 9. バンドルの作成と登録<br />名前空間の登録(app/autoload.php)<br />AppKernelへの登録(app/AppKernel.php)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />9<br />$loader->registerNamespaces(array(<br />// ...<br />'My' => __DIR__.'/../src',<br />));<br />public function registerBundles()<br />{<br /> $bundles = array(<br />// ...<br />new MyWorkshopBundleMyWorkshopBundle(),<br /> );<br />// ...<br />return $bundles;<br />}<br />
  10. 10. 目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュを見る(10分)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />10<br />
  11. 11. ルーティングの登録<br />app/config/routing.yml<br />src/My/WorkshopBundle/Resources/config/routing.yml<br />コメントアウトをはずす+名前変更<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />11<br />workshop:<br /> prefix: /workshop<br /> resource: “@MyWorkshopBundle/Resources/config/routing.yml”<br />workshop_homepage:<br />pattern:/<br />defaults:{ _controller:MyWorkshopBundle:Default:index }<br />バンドル名:コントローラ名:アクション名<br />
  12. 12. ルーティングの登録<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />12<br />http://localhost/Symfony/web/app_dev.php/workshop/<br />自動生成されたアクションとテンプレートがあるので、<br />Hello!と表示されます<br />
  13. 13. 目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュを見る(10分)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />13<br />
  14. 14. Twig構文を試す – for文<br />src/My/WorkshopBundle/Resources/views/Default/index.html.twig<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />14<br /><ul><br />{% for key, user in users %}<br /><li>No.{{ key }}: {{ user.name}} </li><br /> {% endfor%}<br /></ul><br />
  15. 15. Twig構文を試す – for文<br />DefaultController::indexAction()<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />15<br />public function indexAction()<br />{<br />$users = array(<br />‘1’ => array(‘name’=>‘鹿目まどか', 'age'=>14),<br />‘5’ => array(‘name’=>‘<b>めんま</b>', 'age'=>’?'),<br />);<br />return $this->render('MyWorkshopBundle:Default:index.html.twig',<br />array('users' => $users));<br />}<br />
  16. 16. Twig構文を試す<br />{{ ... }}<br />値や式の結果をテンプレートに出力するための文法<br />{% ... %}<br />テンプレート内でロジックを制御するための文法<br />{# ... #}<br />コメントを表すための文法<br />複数行にわたって使用可能<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />16<br />
  17. 17. Twig構文を試す - include<br />src/My/WorkshopBundle/Resources/views/menu.html.twig<br />src/My/WorkshopBundle/Resources/views/Default/index.html.twig (の冒頭に追加)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />17<br /><ul><br /><li>メニュー1</li><br /><li>メニュー2</li><br /><li>メニュー3</li><br /></ul><br />{% include 'MyWorkshopBundle::menu.html.twig'%}<br />
  18. 18. Twig構文を試す - raw<br />src/My/WorkshopBundle/Resources/views/Default/index.html.twig<br />にrawフィルタを付ける<br />エスケープされなくなる<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />18<br /><li>No.{{ key }}: {{ user.name}}({{ user.age }})</li><br /><li>No.{{ key }}: {{ user.name|raw}}({{ user.age }})</li><br />
  19. 19. Twig構文を試す - format<br />src/My/WorkshopBundle/Resources/views/Default/index.html.twig<br />をformatフィルタで書き直すと<br />printf()関数の様なもの<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />19<br /><li>No.{{ key }}: {{ user.name}}({{ user.age }})</li><br /><li>{{ "No.%d: %s(%s)"|format(key, user.name, user.age) }}</li><br />
  20. 20. Twig構文を試す – その他<br />例だけ紹介<br />date … DateTime::format()のラッパー(書式はdate())<br />default … 空要素の初期値を指定(beta3バグあり)<br />「空」と判定される値は、falseまたは0以外のempty()値<br />if/elseif/else/endif … 条件分岐<br />http://www.twig-project.org/doc/templates.html<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />20<br />{{ “now”|date(‘Y-m-dH:i:s’) }} {{ user.createdAt|date(‘Y/m/d’) }}<br />{{ user.birthday|default(‘----/--/--’) }}<br />{% if users %}<br />…<br />{% endif%}<br />
  21. 21. 目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュを見る(10分)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />21<br />
  22. 22. Twigテンプレートの継承<br />app/Resources/views/<br />base.html.twig<br />src/My/WorkshopBundle/Resources/views/<br />layout.html.twig<br />Default/<br />index.html.twig<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />22<br />元からある<br />継承<br />今から作る<br />さっき弄ってた<br />継承<br />
  23. 23. Twigテンプレートの継承<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />23<br />base.html.twig<br />layout.html.twig<br /><!DOCTYPE html><br /><html><br /><head><br /><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br /><title>{%block title %}Welcome!{%endblock%}</title><br />{%block stylesheets%}{% endblock%}<br /><link rel="shortcut icon" href="{{asset('favicon.ico')}}" /><br /></head><br /><body><br />{%block body %}{%endblock%}<br />{% block javascripts%}{% endblock%}<br /></body><br /></html><br />titleブロック<br />index.html.twig<br />{% extends '::base.html.twig' %}<br />{% block title %}WorkShop{% endblock%}<br />{% block body %}<br />{% include 'MyWorkshopBundle::menu.html.twig' %}<br />{% endblock%}<br />継承<br />継承<br />titleブロック<br />{% extends 'MyWorkshopBundle::layout.html.twig' %}<br />{% block body %}<br />{{ parent() }}<br /><!– ここから--><br />中身<br /><!– ここまで<br />{% endblock%}<br />親のblock呼び出し<br />bodyブロック<br />bodyブロック<br />bodyブロック<br />
  24. 24. Twigテンプレートの継承<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />24<br />base.html.twig<br /><!DOCTYPE html><br /><html><br /><head><br /><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br /><title>{%block title %}Welcome!{%endblock%}</title><br />{%block stylesheets%}{% endblock%}<br /><link rel="shortcut icon" href="{{asset('favicon.ico')}}" /><br /></head><br /><body><br />{%block body %}{%endblock%}<br />{% block javascripts%}{% endblock%}<br /></body><br /></html><br />
  25. 25. Twigテンプレートの継承<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />25<br />layout.html.twig<br />{% extends '::base.html.twig' %}<br />{% block title %}WorkShop{% endblock%}<br />{% block body %}<br />{% include 'MyWorkshopBundle::menu.html.twig' %}<br />{% endblock%}<br />
  26. 26. Twigテンプレートの継承<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />26<br />index.html.twig<br />{% extends 'MyWorkshopBundle::layout.html.twig' %}<br />{% block body %}<br />{{ parent() }}<br /><!– ここから--><br />中身<br /><!– ここまで<br />{% endblock%}<br />
  27. 27. 目次<br />ディレクトリ構成(10分)<br />バンドルの作成と登録(10分)<br />ルーティングの登録(10分)<br />Twig構文を試す(15分)<br />Twigテンプレートの継承(20分)<br />Twigのキャッシュを見る(10分)<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />27<br />
  28. 28. Twigのキャッシュを見る<br />app/cache/dev/twig/*<br />Php codeにコンパイルされている<br />意外ときれいなphp-code<br />シンプルだけど、機能を満たす<br />元のコードとの対応関係がおおよそ分かる<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />28<br />
  29. 29. \(^o^)/おわり\(^o^)/<br />Next step…<br />ブログチュートリアル<br />http://doc.symfony.gr.jp/blog-tutorial/<br />Symfony2 Book<br />http://symfony.com/doc/current/book/index.html<br />2011.06.04<br />Symfony2勉強会#4 基礎編ワークショップ<br />29<br />
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×