Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
EC-CUBE3デザイナー向け勉強会 #3
Search
amidaike
March 10, 2016
Programming
1
220
EC-CUBE3デザイナー向け勉強会 #3
amidaike
March 10, 2016
Tweet
Share
More Decks by amidaike
See All by amidaike
EC-CUBE3勉強会新しいデザインを作成してみよう
amidaike
0
460
EC-CUBE 3.0勉強会
amidaike
1
940
EC-CUBE3プラグイン勉強会
amidaike
0
460
EC-CUBE3デザイナー向け勉強会 #4
amidaike
0
310
EC-CUBE3コードリーディング #5
amidaike
1
1.5k
EC-CUBE3デザイナー向け勉強会 #1
amidaike
0
290
EC-CUBE3コードリーディング #4
amidaike
0
1.3k
EC-CUBE3デザイナー向け勉強会 #2
amidaike
1
2.8k
EC-CUBE3コードリーディング #3
amidaike
1
960
Other Decks in Programming
See All in Programming
Reading Rails 1.0 Source Code
okuramasafumi
0
110
Processing Gem ベースの、2D レトロゲームエンジンの開発
tokujiros
2
130
Zendeskのチケットを Amazon Bedrockで 解析した
ryokosuge
3
300
RDoc meets YARD
okuramasafumi
4
170
旅行プランAIエージェント開発の裏側
ippo012
2
900
「待たせ上手」なスケルトンスクリーン、 そのUXの裏側
teamlab
PRO
0
510
アプリの "かわいい" を支えるアニメーションツールRiveについて
uetyo
0
260
CloudflareのChat Agent Starter Kitで簡単!AIチャットボット構築
syumai
2
480
Android 16 × Jetpack Composeで縦書きテキストエディタを作ろう / Vertical Text Editor with Compose on Android 16
cc4966
1
200
Kiroの仕様駆動開発から見えてきたAIコーディングとの正しい付き合い方
clshinji
1
210
Amazon RDS 向けに提供されている MCP Server と仕組みを調べてみた/jawsug-okayama-2025-aurora-mcp
takahashiikki
1
110
Kiroで始めるAI-DLC
kaonash
2
580
Featured
See All Featured
Context Engineering - Making Every Token Count
addyosmani
2
41
Building Adaptive Systems
keathley
43
2.7k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
Agile that works and the tools we love
rasmusluckow
330
21k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
139
34k
How to train your dragon (web standard)
notwaldorf
96
6.2k
Thoughts on Productivity
jonyablonski
70
4.8k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Optimising Largest Contentful Paint
csswizardry
37
3.4k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.1k
Rails Girls Zürich Keynote
gr2m
95
14k
Six Lessons from altMBA
skipperchong
28
4k
Transcript
EC-CUBE3σβΠφʔ͚ษڧձ #3 EC-CUBEؔϢʔβάϧʔϓ 2016-03-09
࣍ 1. Twigͷઆ໌ύʔτ2 2. ϒϩοΫΛ׆༻ͨ͠σβΠϯ࡞ 3. ։ൃ࣌ͷখ 4. ࣭ٙԠ
1.Twigͷઆ໌ύʔτ2
ϑΥʔϜը໘ͷ࡞ • TwigͰϑΥʔϜը໘Λ࡞͢Δͱ͖ɺઐ༻ͷग़ྗؔ ͱมΛͬͯ࡞͢Δ͜ͱ͕Ͱ͖·͢ɻ • ؔϑΟʔϧυΛग़ྗ͢ΔͷʹΑ͘ΘΕ·͢ɻҰํɺ มී௨ͦΕ΄Ͳ͍·ͤΜ͕ɺϑΟʔϧυͷϥϕ ϧɾIDଐੑɾΤϥʔɺͦͷଞϑΟʔϧυʹؔ͢Δ͋ΒΏ ΔใΛར༻͢Δ͜ͱ͕Ͱ͖·͢ɻ •
ϑΥʔϜΛ͏߹ɺController͔ΒFormTypeΫϥε Λͯ͠ѻ͍·͢ɻ
Formग़ྗؔ • form(view, variables) ϑΥʔϜશମͷHTMLΛग़ྗ͠·͢ɻ {{ form(form) }} !variablesʹ͋ͨΔformController͔ Β͞Εͨkey໊ͱͳΓ·͢ɻ
Formग़ྗؔ • form_start(view, variables) ϑΥʔϜͷ։࢝λάΛग़ྗ͠·͢ɻϑΥʔϜ͕ϑΝΠϧ ΞοϓϩʔυΛؚΜͰ͍Εɺదͳenctypeग़ྗ͠ ·͢ɻ {{ form_start(form, {'method':
'GET'}) }}
Formग़ྗؔ • form_end(view, variables) ϑΥʔϜͷऴྃλάΛग़ྗ͠·͢ɻ {{ form_end(form) }}
Formग़ྗؔ • form_label(view, label, variables) ࢦఆͨ͠ϑΟʔϧυͷϥϕϧΛग़ྗ͠·͢ɻୈೋҾͱ ͯ͠ɺ͜ͷϑΟʔϧυʹग़ྗ͍ͨ͠ϥϕϧΛ͢͜ͱ Ͱ͖·͢ɻ {{ form_label(form.name)
}} {# Լهͷೋͭͷॻ͖ํಉ͡ҙຯʹͳΓ·͢ #} {{ form_label(form.name, '໊͓લ', {'label_attr': {'class': 'foo'}}) }} {{ form_label(form.name, null, {'label': '໊͓લ', 'label_attr': {'class': 'foo'}}) }}
Formग़ྗؔ • form_errors(view) ࢦఆͨ͠ϑΟʔϧυͷΤϥʔΛग़ྗ͠·͢ɻ {{ form_errors(form.name) }} {{ form_errors(form) }}
Formग़ྗؔ • form_widget(view, variables) ࢦఆͨ͠ϑΟʔϧυͷHTMLΛग़ྗ͠·͢ɻ form_widgetͷୈೋҾมͷྻͰ͢ɻΑ͘ΘΕ ΔͷattrͰɺclassΛՃ͍ͨ࣌͠ͳͲʹΘΕ·͢ɻ {{ form_widget(form.name, {'attr':
{'class': 'foo'}}) }}
Formग़ྗؔ • form_row(view, variables) ࢦఆͨ͠ϑΟʔϧυͷʮߦʯɺϥϕϧɾΤϥʔϝοηʔ δɾΟδΣοτͷΈ߹Θͬͨ͞ͷΛग़ྗ͠·͢ɻ {{ form_row(form.name) }}
Formग़ྗؔ • form_rest(view, variables) ࢦఆͨ͠ϑΥʔϜʹ͍ͭͯ·ͩग़ྗ͞Ε͍ͯͳ͍શͯͷ ϑΟʔϧυΛग़ྗ͠·͢ɻhiddenɺग़ྗ͠Εͨ ϑΟʔϧυΛग़ྗͯ͘͠Ε·͢ɻ {{ form_rest(form) }}
Formม • ࠓ·Ͱग़͖ͯͨ΄ͱΜͲશͯͷTwigؔͰɺ࠷ޙͷ ҾมͷྻͰ͢ɻ ྫ͑ɺ࣍ͷίʔυϑΟʔ ϧυͷΟδΣοτΛग़ྗ͠·͕͢ɺಛผͳΫϥεΛ ؚΊΔΑ͏ʹมߋ͞Ε͍ͯ·͢ɻ {# ΟδΣοτΛग़ྗ͠ɺ "foo"ΫϥεΛ
Ճ͠·͢ #} {{ form_widget(form.name, { 'attr': {'class': 'foo'} }) }}
Formม • ϑΥʔϜͷͲͷ෦Λग़ྗ͢Δͱ͖Ͱɺͦͷ෦Λ ग़ྗ͢ΔϒϩοΫͨ͘͞ΜͷมΛ͍·͢ɻ σ ϑΥϧτͰɺϒϩοΫform_div_layout.html.twig ͷதʹॻ͔Ε͍ͯ·͢ɻ {% block form_label
%} {% if not compound %} {% set label_attr = label_attr|merge({'for': id}) %} {% endif %} {% if required %} {% set label_attr = label_attr|merge({'class': (label_attr.class|default('') ~ ' required')|trim}) %} {% endif %} {% if label is empty %} {% set label = name|humanize %} {% endif %}
Formม • ςϯϓϨʔτʹ form มؚ͕·Ε͍ͯͯnameϑΟʔ ϧυͷมʹΞΫηε͍ͨ͠ͱ͖ɺ FormViewΦϒδΣ ΫτͷvarsϓϩύςΟΛ͏͜ͱʹΑΓΞΫηεͰ͖· ͢ɻ <label
for="{{ form.name.vars.id }}" class="{{ form.name.vars.required ? 'required' : '' }}"> {{ form.name.vars.label }} </label>
Formม • FormมʹҎԼ͕ඪ४Ͱ༻ҙ͞Ε͍ͯ·͢ɻԼͷม શͯͷϑΟʔϧυλΠϓʹڞ௨Ͱ͢ɻϑΟʔϧυλ Πϓͷதʹͬͱଟ͘ͷม͕͋Δͷ͋Γɺಛ ఆͷϑΟʔϧυͷΈʹ༗ޮͳม͋Γ·͢ɻ formɺidɺnameɺfull_nameɺerrorsɺsubmittedɺ validɺvalueɺread_onlyɺdisabledɺrequiredɺ max_lengthɺpatternɺlabelɺmultipartɺattrɺ compoundɺblock_prefixesɺtranslation_domainɺ
cache_keyɺdataɺmethodɺaction
ϑΥʔϜϨΠΞτ • EC-CUBE3ͰϑΥʔϜը໘Λར༻͢Δ߹ɺ ECCUBEROOT/src/Eccube/Resource/template/default/Form/form_layout.twig ECCUBEROOT/src/Eccube/Resource/template/admin/Form/ bootstrap_3_horizontal_layout.html.twig Λݩʹͯ͠ग़ྗ͞Ε͍ͯ·͢ɻ • ͜ͷϑΥʔϜΛར༻͢Δ߹ɺݺͼग़͠ݩͷTwigଆͰ {%
form_theme form 'Form/form_layout.twig' %} {% form_theme form 'Form/bootstrap_3_horizontal_layout.html.twig' %} ͱهड़͢Δ͜ͱͰڞ௨ͱͳΔϑΥʔϜը໘͕࡞͞Ε·͢ɻ ※ݱঢ়ͰϑϩϯτଆͰform_layout.twigར༻͞Ε͓ͯΒͣɺTwigඪ४ͷ form_div_layout.html.twig͕ద༻͞Ε͍ͯ·͢ɻ
TwigΤΫεςϯγϣϯ • TwigʹطʹଟͷΈࠐΈؔɾϑΟϧλɾλάɾ ςετؚ͕·Ε͍ͯ·͕͢(લճͷษڧձͰઆ໌ͨ͠ ͷ)ɺSymfony2ͰTwig ςϯϓϨʔτͰίϯϙʔωϯ τͷػೳΛ͑ΔΑ͏ʹ͢ΔͨΊʹɺ Twigͷ֦ுػೳ ΛՃ͍ͯ͠·͢ɻ •
EccubeͰಠࣗͷؔϑΟϧλΛ࡞͍ͯ͠·͢ɻ (ECCUBROOT/src/Eccube/Twig/Extension/ EccubeExtension.phpΛࢀর)
Twigؔ • render ࢦఆ͞ΕͨίϯτϩʔϥʔຢURLΛग़ྗ͠·͢ɻ {{ render(uri, options = []) }}
Twigؔ • is_granted ςϯϓϨʔτͷதͰݱࡏͷϢʔβ͕ݖݶΛ͍࣋ͬͯΔ ͔ΛௐΔͨΊʹ͍·͢ɻݱࡏͷϢʔβʔ͕ࢦఆ͞Ε ͨϩʔϧΛ͍࣋ͬͯΕtrueΛฦ͠·͢ɻ {{ is_granted(role, object =
null, field = null) }}
Twigؔ • path ࢦఆ͞ΕͨϧʔςΟϯά໊ͷύεΛฦ͠·͢ɻ {{ path(name, parameters = [], relative
= false) }}
Twigؔ • url path(...) ͱಉ͡Ͱ͕͢ɺͪ͜ΒઈରURLΛฦ͠·͢ɻ {{ url(name, parameters = [],
schemeRelative = false) }}
Twigάϩʔόϧม • appଐੑ app มςϯϓϨʔτͷͲ͜Ͱ͏͜ͱ͕Ͱ ͖ɺڞ௨Ͱ༻͢ΔΦϒδΣΫτΛࢀরͰ͖ΔΑ͏ʹ ͳ͍ͬͯ·͢ɻ GlobalVariablesͷΠϯελϯεͰ͢ɻ app.user app.request
app.session app.environment app.debug ※EC-CUBE3ͰଞʹDI͞Ε͍ͯΔɻ
2.ϒϩοΫΛ׆༻ͨ͠σβΠϯ࡞
ϒϩοΫΛ׆༻ͨ͠σβΠϯ࡞ • EC-CUBE3Ͱϑϩϯτը໘Λ࡞͢Δ߹ɺ TwigϑΝΠϧΛ࡞ ཧը໘ͷίϯςϯπཧΑΓը໘Λ࡞ σβΠϯςϯϓϨʔτͱͯ͠ඪ४ͷϑΝΠϧ͔Β࡞͠ Ξοϓϩʔυ ͱ͍͏ํ๏͕͋Γ·͢ɻ • ৽نʹը໘Λ࡞͢ΔҎ֎ʹϒϩοΫΛͬͯը໘ͷ
ϨΠΞτΛมߋ͢Δํ๏͋Γ·͢ɻ
3.։ൃ࣌ͷখ
։ൃ࣌ͷখ • ΤϥʔͷݟํͲ͏͢Δͷ? • TwigͰphp͑ͳ͍ͷ? ࢀߟURL) https://github.com/EC-CUBE/ec-cube/issues/1320 • URLͷ֬ೝͷํͲ͏͢Δͷ? ࢀߟURL)
http://ec-cube.github.io/tips.html • URLΛมߋ͍ͨ͠߹ɺͲ͏͢Δͷ? • ը໘ભҠਤΈ͍ͨͳͷͳ͍ͷ? • URLʹhtmlΛ͚ͭͳ͍ํ๏Ͳ͏͢Δͷ? ࢀߟURL) http://amidaike.hatenablog.com/entry/2016/02/11/054219 • σβΠϯͷมߋͲ͏͢Δͷ?
4.࣭ٙԠ
։ൃ࣌ͷࢀߟϖʔδ • Twigʹ͍ͭͯͬͱΓ͍ͨํͪ͜ΒͷαΠτɺυ ΩϡϝϯτΛ͝ཡ͍ͩ͘͞ɻ http://docs.symfony.gr.jp/symfony2/reference/forms/ twig_reference.html http://docs.symfony.gr.jp/symfony2/reference/ twig_reference.html
։ൃ࣌ͷࢀߟϖʔδ • GitHubWiki https://github.com/EC-CUBE/ec-cube/wiki • GitHubPages http://ec-cube.github.io • Qiitaͷهࣄ http://qiita.com/tags/EC-CUBE3