Phalcon 謹製テンプレートエンジン Volt - Meet phalcon Volt
Upcoming SlideShare
Loading in...5
×
 

Phalcon 謹製テンプレートエンジン Volt - Meet phalcon Volt

on

  • 4,464 views

こんにちわ、RODEOの大平かづみです。 ...

こんにちわ、RODEOの大平かづみです。

今回は、Phalcon のテンプレートエンジン Volt をご紹介致します。
MVCのビュー周りを作る際に、とても活躍してくれます。
是非ご覧頂ければ幸いです!

それから、本日の「第71回 PHP勉強会@東京」にて発表する資料でもあります。よろしくお願い致します!
(http://atnd.org/events/42528)

RODEO: http://www.rodeo.jp.net/

Statistics

Views

Total Views
4,464
Views on SlideShare
2,803
Embed Views
1,661

Actions

Likes
8
Downloads
7
Comments
0

10 Embeds 1,661

http://doda.jp 752
http://www.rodeo.jp.net 438
http://www.girlande.jp 203
http://qiita.com 141
http://cms.doda.jp 75
https://cms.doda.jp 40
http://localhost 4
http://www.s-arcana.co.jp 4
https://twitter.com 2
https://doda.jp 2
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Phalcon 謹製テンプレートエンジン Volt - Meet phalcon Volt Phalcon 謹製テンプレートエンジン Volt - Meet phalcon Volt Presentation Transcript

    • Meet ♡ Volt 大平かづみ
    • Index  Volt !  ビューの構造  コントローラからビューへ  パーツ化  エディタを使いやすく!
    • Volt ! Phalcon PHP Framework のテンプレートエンジン
    • Volt とは  Phalcon 謹製のテンプレートエンジン  もちろん Phalcon と、とてもよく馴染みます  参考: Volt: Template Engine  参考: Using Views – Template Engines  PHP でよく使われる某エンジンとよく似ています  導入しやすい!
    • Phalcon のビュー ここで、Phalcon のビュー周りについて少し触れてみます
    • Phalcon のビューの仕組み  いわゆる、MVC フレームワークのビューです  参考: Using View  Volt のほかに、plain PHP (phtml) や他のエンジンも使えます  基本的には、コントローラのアクションと対になっています  例えば、  コントローラ : MusicController の indexAction  ビュー : app¥views¥music¥index.volt
    • ビューの構造 階層的にレンダリングされます
    • ビューの階層構造  全体では階層構造になっており、シンプルなビューを構成できます 1. ベースになるビュー 2. コントローラに紐づいた レイアウトの ビュー 3. コントローラのアクションに紐づいた ビュー
    • ビューのレンダリング順 ベース → コントローラのビュー → アクションのビュー
    • ビューのレンダリング順 (1)  まず、レンダリングされるのは、 views¥index.volt app views layouts  music.volt music  index.volt  index.volt
    • ビューのレンダリング順 (2)  次に、コントローラに紐づく、 レイアウトのビュー views¥layouts¥music.volt app views layouts  music.volt music  index.volt  index.volt
    • ビューのレンダリング順 (3)  そして、コントローラのアク ションに紐づくビュー views¥music¥index.volt app views layouts  music.volt music  index.volt  index.volt
    • 実際にはこんな感じです app views layouts  music.volt music  index.volt  index.volt
    • views/index.volt views/layout/music.volt views/music/index.volt
    • コントローラからビューへ コントローラから渡す / ビューで表示する / コントローラとビューの紐づけ
    • コントローラから渡す  コントローラでは、 このように設定します  $this->view->variable = …  配列もOK
    • ビューで表示する  コントローラから渡された変数 は、”$” なしで参照できます  そのまま表示できるものは、  {{ variable }}
    • ビューで表示する (分岐、ループなど)  分岐  {% if variable … %} {% else %} {% endif %}  配列の各要素を  {% for variable in variables %} {% endfor %}  他にもあります → List of Control Structures
    • パーツ化 画面のパーツ化 / partial() を使ってみよう
    • 画面のパーツ化  画面の一部を切り出して、 必要な時、必要な場所で、ロードできます!  参考: Using Views - Using Paritals  Volt では、ビルトイン関数として提供されています  partial()  ロードしたいパーシャル(voltファイル)を指定します  ロードしたパーシャルでも変数を参照できます  引数も渡せます  引数はリネームもできます
    • partial() を使ってみよう  例えば、こんな 曲のリストを作りたいとき
    • partial() を使ってみよう  例えば、こんな 曲のリストを作りたいとき  曲データの部分を パーシャルにしてみましょう
    • partial() : パーシャルを作ってみる  曲データ部分だけを、1つのファイルに書きます  app/views 配下のどこかに置きます  変数をあてるところは、いつも通り  パーシャルで使う変数構造が決まります  例では、以下のデータをもった song という変数を使います  title, artsist, released_on
    • partial() : パーシャルを作ってみる  こんな感じです
    • partial() : ビューですること  パーシャルをロードします  views 以下のディレクトリ階層を含むパスを指定します  例 : “songs/partial_song”  パーシャル内でも、同じ変数を使えます  例 : patial_song.volt 内で、song を参照できます  パーシャルに、変数をリネームして渡せます  例 : favorite_song を、song にリネームして、 patial_song.volt に渡しています
    • partial() :コントローラですること  パーシャルを使うかどうかは、何も意識しません  表示したいデータをビューに渡すだけです  例えば、  $this->view->songs に、 曲データの配列を設定して、view へ渡します  $this->view->favorite_song に、 好きな曲の情報を設定して、view へ渡します
    • コードがすっきり しますね!
    • 使いやすく! Sublime Text / Netbeans でシンタックスハイライト
    • Sublime Text で使いやすく  チュートリアルムービーでも使われている Sublime Text  Sublime Text は、Mac / Linux / Windows どれでも利用可  Emmet や hayaku など、便利なパッケージが多数  公式に、シンタックスハイライトのパッケージがあります  Volt Syntax Highlight  黒基調の Sublime Text によく映えます  TextMate でも使えます
    • Sublime Text with Volt Syntax Highlight  利用方法  Sublime Text の Package Control を利用します Installation に従い、Console にコードを入力し、 Package Control をインストール  Package Control にリポジトリを登録します  リポジトリ: https://github.com/phalcon/volt-sublime- textmate  Package Control の Install Package から “Volt syntax Highlight” をインストール
    • Netbeans で使いやすく  公式のシンタックスハイライトはないのですが…  よく似たシンタックスの Twig ファイルとして扱うと、 シンタックスがきれいに出ます
    • さいごに  Phalcon PHP Framework は、new BSD license に基づきリリースされて います。  尚、本資料における Phalcon からの引用、および画像については、 Creative Commons Attribution 3.0 License に基づき、使用しています。
    • このフレームワークを使って お仕事したい方は! お待ちしております ヾ(・ω・)ノ で 一緒に作りませんか! http://www.rodeo.jp.net
    • See you, again! :)