テンプレート管理ツール r3

6,585 views

Published on

第25回PHP勉強会
http://d.hatena.ne.jp/i_ogi/20070624/1182704117

Published in: Business
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
6,585
On SlideShare
0
From Embeds
0
Number of Embeds
56
Actions
Shares
0
Downloads
7
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

テンプレート管理ツール r3

  1. 1. テンプレ管理ツール r3 2007/06/24 第25回 PHP勉強会 http://d.hatena.ne.jp/i_ogi/ photo: flickr.com/photos/maxpower/130960194/
  2. 2. 内容 • r3とは • r3のキーワード、dimensionと継承 • インストール • デモプロジェクトの作成 –初期設定 (dimensionの作成と継承設定) –ターゲットの作成 –特殊化 (specialize) –翻訳 (translation) • まとめ
  3. 3. 前置き • まとめてみたら、使えねーという結論 に達しましたが、とりあえずやります –正直、どう使えばいいか分からないツー ルです • PHPで作られてるけど、CLIツールなの でPHPの話出てこない!
  4. 4. r3とは • Yahoo!からオープンソースで公開され たテンプレート管理システム –「テンプレートエンジン」では無い –PHP以外のテンプレやCSS・JS等もOK • 社内で利用されていたRosettaという ツールを元にゼロから書き直し • 今のところアルファ版 http://www.appulsus.com/w/?p=18
  5. 5. Rosetta Stone 英語では、ロゼッタ・ス トーンを隠喩として使う。 解読することや翻訳、難問 などを表す。 出典: フリー百科事典『ウィキペディア (Wikipedia)』 webアプリケーションの 国際化に特化している http://flickr.com/photos/jbarton/466497735/
  6. 6. r3とは? • 複数のサイト(products)と、 • 複数の⾔語・地域(intl) のある、テンプレートを • 「継承」と • 「掛け合わせ」で 効率よく管理、⽣成するCLIツール
  7. 7. テンプレートを生成? • r3形式のテンプレを書いて、任意のテ ンプレを作る。 –テンプレからテンプレを⽣成 • テンプレのプリコンパイラ的な仕組み • 対象とするターゲット –テンプレート (PHP/Smarty etc…) –ヘルパー的関数ファイル (PHP) など • ⽇付をフォーマットして出⼒する関数など、 画⾯表⽰に関わる補助的なPHPスクリプト
  8. 8. r3のテンプレート例 <html> <head></head> <body> <table width=quot;100%quot; border=quot;2quot;> <tr> <th colspan=quot;2quot;><r3:trans>Container</r3:trans></th> </tr> <tr> <td colspan=quot;2quot;><r3:include path=quot;header.rosquot; /></td> </tr> <tr> <td width=quot;30%quot;><r3:include path=quot;navigation.rosquot; /></td> <td width=quot;70%quot;><r3:include path=quot;content.rosquot; /></td> </tr> </table> </body> </html>
  9. 9. なぜそんなことするのか? • Flexibleな国際化のため –細かい調整を可能とする –先に各⾔語用のテンプレートを⽣成して しまうので、gettextより負荷が少ない • 国際化しないなら、必要ないかも。 (´・ω・`)ショボーン
  10. 10. r3のキーワード dimension 継承 (inheritance)
  11. 11. 様々な出力先→dimension • 様々な出⼒の種類をdimensionと呼ぶ • r3で使うdimensionは2つ –プロダクト (product) –国際化 (intl) • 各dimensionを掛け合わせてサイトが ⽣成される –productが3個で、intlが4個なら12サイト
  12. 12. product と intl の掛け合わせ •cookery/us •cookery/ca •cookery/fr intl product •cookery/jp × = •wine/us •us •cookery •wine/ca •ca •wine •wine/fr •fr •car •wine/jp •jp •car/us 12 3 4 •car/ca •car/fr •car/jp
  13. 13. 掛け合わせると言っても… • 掛け合わせるって⾔っても、別々に作 るんじゃ意味がない • そこで継承! • 継承を使って、変更が無いところは親 のモノをそのまま使うことで、⼿間が 減らせる!
  14. 14. 継承 (inheritance) • クラスの継承と同じ考え • 各dimension (productとintl)について、 それぞれ別の継承関係が設定できる • intlについては、さらにdomainという 継承関係の細分があり、別に継承可能 –page (ページ) –template (テンプレ) –translation (翻訳)
  15. 15. プロダクトの継承の例 • ブランディングのため の基本ルールが統⼀ • その中でも遷移上、UI が統⼀されているプロ ダクトもある • 似てるけど少し違う
  16. 16. intlの継承の例 intl (4ヶ国) •us (アメリカ) •ca (カナダ) •fr (フランス) •jp (⽇本) • ⾔語的視点からは、フランス語圏で、 ca(カナダ)は fr(フランス)を継承 • 地域的視点からは、北⽶エリアで、 ca(カナダ)は us(アメリカ)を継承
  17. 17. • 実際に作っていく流れを⾒ていきます • その前にインストール
  18. 18. r3のインストール
  19. 19. 導入 • 動作環境 –PHP5 –PDOで、MySQL or SQLiteが利用可能 • インストール –SourceForgeからr3とsticklebackのアー カイブをダウンロード • sourceforge.net/projects/rthree • sourceforge.net/projects/stickleback –PEARでそれぞれインストール
  20. 20. r3 CLI $ r3 usage:r3 [-c <arg>] [-u] [-x] the r3 command line interface -c override the default configuration, use your own -u display utf8 chars with unicode values -x display utf8 chars with hex values usage general help version r3 version setup administrative commands template template control translation dictionary utilities target target tools generate [-a] [-v... generate targets dimension dimension tools (dimension is one of product,intl) inheritance inheritance tools
  21. 21. ホームディレクトリ設定 • 適当な場所で、r3用のディレクトリを 作成 $ mkdir ~/r3 • セットアップコマンドを叩く $ r3 setup setuphome ~/r3 setting up environment • $R3HOMEを環境変数に設定しておく
  22. 22. DB設定 • デフォルトのSQLite利用なら、そのま まコマンド叩くだけで完了 $ r3 setup installdb installing r3 db creating r3 db connecting to r3 db creating r3 tables • MySQLを使うときは、r3conf.xmlで設 定
  23. 23. 導入まとめ • ⽐較的簡単にセットアップできます
  24. 24. デモプロジェクトの作成 ここからけっこう⻑い
  25. 25. 作成するもの • 3つの独⽴したプロダクト(だけれど、関連 がある)を4つの⾔語で作成します。 • プロダクト – cookery (料理), wine (ワイン), cars (⾞) • 地域 – アメリカ (us) – フランス語圏のカナダ (ca) – フランス (fr) – ⽇本 (jp)
  26. 26. product と intl の掛け合わせ •cookery/us •cookery/ca •cookery/fr intl product •cookery/jp × = •wine/us •us •cookery •wine/ca •ca •wine •wine/fr •fr •cars •wine/jp •jp •car/us 12 3 4 •car/ca •car/fr •car/jp
  27. 27. 初期設定 • productとintlを必要なだけ作成 –基底とする仮想的なproduct/intlも作成 • サイト全体のブランディングに利用 product intl •generic_intl •generic_product •us •cookery •ca •wine •fr •car •jp
  28. 28. productの作成 • まず、productを作成します • 継承関係はこんなの –料理と⾞が基底を継承 –ワインは料理を継承 generic_product-+-cookery--wine | +-cars
  29. 29. productの作成 $ r3 dimension product create generic_product product generic_product created $ r3 dimension product create cookery -p generic_product product cookery created with parent generic_product for page, template and translation domains. $ r3 dimension product create wine -p cookery product wine created with parent cookery for page, template and translation domains. $ r3 dimension product create cars -p generic_product product cars created with parent generic_product for page, template and translation domains.
  30. 30. intlの作成 • 同じようにintlも作成します • 継承関係は、domainで分かれる translation(翻訳) page/template generic_intl generic _intl-+-fr fr-+-ca | us +-us--ca jp | +-jp
  31. 31. intlの作成 $ r3 dimension intl create generic_intl intl generic_intl created $ r3 dimension intl create us -p generic_intl intl us created with parent generic_intl for page, template and translation domains. $ r3 dimension intl create ca -p us ... $ r3 dimension intl create fr -p generic_intl $ r3 dimension intl create jp -p generic_intl
  32. 32. translationの継承設定 • この時点ではintlの継承はこう translation/page/template generic_intl-+-fr | +-us--ca | +-jp • translationドメインで、caはfrを継承 するように設定する
  33. 33. translationの継承設定 $ r3 dimension intl parent ca set fr -d translation parent of intl ca changed to fr in the translation domain # 翻訳ドメインに基底っていらないよなってことで # translationドメインで基底の継承関係を削除 $ r3 dimension intl parent fr unset -f -d translation intl fr set with no parent in the translation domain $ r3 dimension intl parent us unset -d translation intl us set with no parent in the translation domain $ r3 dimension intl parent jp unset -d translation intl jp set with no parent in the translation domain
  34. 34. 設定完了 • これで、productとintlの作成と、継承 関係の設定が完了 • 次にターゲットを作成します • ターゲットとは、最終的に⽣成される ファイルのことです
  35. 35. ターゲットの作成 • target create [location]で作成 $ r3 target create ¥ generic_product/generic_intl/index.html page created (1) • locationとは、product名/intl名/ペー ジ名で構成するUNIXパス的なもの • generic_product/generic_intl な の で 、 最上位のlocationとなる –継承している⼦孫にも適用される
  36. 36. ターゲットの編集 • $R3HOME/templates/generic_prod uct/generic_intl/index.html/index.h tml.ros にターゲットの空テンプレー トが作られる –これを適宜編集していく • ⼀回、全⽣成してみる –$R3HOME/htdocs下に作成されます $ r3 generate -a
  37. 37. いっぱい出来る (4×5で20サイト) $ r3 generate -av generating cars/ca cars/ca/index.html generating cars/fr cars/fr/index.html generating cars/generic_intl cars/generic_intl/index.html generating cars/jp cars/jp/index.html generating cars/us cars/us/index.html generating cookery/ca cookery/ca/index.html
  38. 38. ターゲットの編集 <html> <head></head> <body> <table width=quot;100%quot; border=quot;2quot;> <tr> <th colspan=quot;2quot;><r3:trans>Container</r3:trans></th> </tr> <tr> <td colspan=quot;2quot;><r3:include path=quot;header.rosquot; /></td> </tr> <tr> <td width=quot;30%quot;><r3:include path=quot;navigation.rosquot; /></td> <td width=quot;70%quot;><r3:include path=quot;content.rosquot; /></td> </tr> </table> </body> </html>
  39. 39. テンプレートとターゲット template target index.php.ros index.php include header.ros footer.ros include brand.ros
  40. 40. とりあえずできた • とりあえずファイルが出来たけど、各 サイトの内容は同じ • 継承先で、特殊化(specialize)して内容 を各product/intlで変えていきます
  41. 41. searchpath • ターゲットを⽣成するのに参照するパ ス $ r3 template searchpath cookery/us/index.html 0 cookery/us/index.html 1 cookery/us/generic 2 cookery/generic_intl/index.html 3 cookery/generic_intl/generic 4 generic_product/us/index.html 5 generic_product/us/generic 6 generic_product/generic_intl/index.html index.html.ros 7 generic_product/generic_intl/generic
  42. 42. 特殊化 (specialize) • cookery/us/index.htmlのcontent.ros テンプレートを0レベルで特殊化 $ r3 template specialize ¥ cookery/us/index.html content.ros 0 • これで、cookery/usだけcontent.ros の内容が別になる –$R3HOME/cookery/us/index.html/con tent.rosを適宜編集
  43. 43. 特殊化 (specialize) $ r3 template specialize cookery/us/index.html content.ros 0 Template specialised from generic_product/generic_intl/index.html to cookery/us/index.html 0 cookery/us/index.html content.ros 1 cookery/us/generic 2 cookery/generic_intl/index.html 3 cookery/generic_intl/generic 4 generic_product/us/index.html 5 generic_product/us/generic 6 generic_product/generic_intl/index.html content.ros 7 generic_product/generic_intl/generic
  44. 44. 特殊化 (specialize) • こんな感じで、適切なレベルで特殊化 を繰り返していきます • 端折ってますが、ここが⼀番やること 多い • 次、翻訳していきます
  45. 45. 翻訳 (translation) • テンプレ中で、<r3:trans />で囲んだ 箇所が翻訳するところ • 翻訳も継承関係があるので、親で翻訳 すれば⼦孫にも適用されます • 流れとしては、指定した⾔語について –翻訳用ファイルをエクスポート –翻訳して、そのファイルをインポート をやっていく感じ
  46. 46. 翻訳ファイル • 翻訳用のファイルは、”XLIFF”という OASISで標準化されているローカライ ズのXMLファイルフォーマット • 標準化されているので、GUIツール等 もあり扱いやすい –SunのOLT(open language tools)とか • ⾔語ごとに分けてエクスポートできる ので、翻訳業者さんに投げやすい
  47. 47. 翻訳ファイルの出力 • エクスポート $ r3 translation save inherited ¥ generic_product/fr fr.xml generic_product/fr and inherited dictionary data saved in file 'fr.xml' • マージ $ r3 translation merge fr.xml dictionary data merged from file 'fr.xml'
  48. 48. 翻訳ファイルの中身 <?xml version=quot;1.0quot; encoding=quot;UTF-8quot;?> <xliff version='1.1' …> <file original='generic_product/fr/generic' source-language='en' target-language='fr' datatype='plaintext'> <body> <trans-unit id='1'> <source>Cars Navigation</source> <target>Cars Navigation</target> </trans-unit> <trans-unit id='2'> <source>Cars Site Branding</source> <target>Cars Site Branding</target> </trans-unit> </body> </file> </xliff>
  49. 49. 翻訳終了 • これで終了 • ここで⽣成したファイルをアプリで使 うことになります • なんとなく分かりました?
  50. 50. 使う •ここまでやって再⽣成すれば、各 product×各intlのサイトがhtdocs下に できます • 使うには –アプリ側で、productをマッピング –intlは、ブラウザのAccept-Languageで も⾒て判断
  51. 51. まとめ
  52. 52. 今後の機能追加予定 • Web GUI –画⾯を修正するのに、エンジニアが介さ なくてもOKというのが重要 • CLI及びGUI用のプラグインAPI –例: カスタムのテンプレートタグや、出⼒ ハンドラ
  53. 53. まとめ • まず国際化ありき • かなりニッチなツール –必要とする⼈は限られているかと • 現在はアルファ版。これから? –引き続き様⼦⾒
  54. 54. ありがとうございました! • 詳しいところは、はてダで書いてます –http://d.hatena.ne.jp/i_ogi/archive?w ord=*[r3]

×