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
なるべくJavaScriptを書かないで SymfonyのUIをリッチにする Symfony UX
Search
Ippei Sumida
September 24, 2022
Programming
1
1.5k
なるべくJavaScriptを書かないで SymfonyのUIをリッチにする Symfony UX
PHP Conference Japan 2022でお話しした内容です。
#phpcon #phpcon2022
Ippei Sumida
September 24, 2022
Tweet
Share
More Decks by Ippei Sumida
See All by Ippei Sumida
25分で理解する!Symfonyの魅力とその実践的活用法
ippey
0
5.3k
素早いバリュー提供のための DROBEの新戦略
ippey
0
980
Symfony 6.3のおすすめ新機能まとめ
ippey
1
1.4k
PhpStorm + GitHub Copilotはいいぞ
ippey
0
1.6k
それぞれの特徴から考えるフレームワーク選び
ippey
1
720
はじめてのCI - 実践編 -
ippey
1
200
はじめてのCI - 概要と準備編 -
ippey
0
350
SymfonyとDoctrineで 簡単クリーンアーキテクチャ
ippey
7
21k
小学生中学年向けプログラミング授業
ippey
0
200
Other Decks in Programming
See All in Programming
"config" ってなんだ? / What is "config"?
okashoi
0
210
PHPの次期バージョンはこの時期どうなっているのか - Internalsの開発体制について - PHPカンファレンス小田原
youkidearitai
PRO
1
180
Ruby Function Composition
bkuhlmann
1
330
両面どころかインフラもTSでできるよ ~ 全方位TypeScriptによるプロダクト開発 ~
myfinder
9
3.2k
Rails と人魚の話/rails-and-mermaid
sanfrecce_osaka
0
100
코틀린으로 멀티플랫폼 만들기
pangmoo
0
120
Elm 0.19.0 Changes
bkuhlmann
0
480
Front-end application development, Symfony-style(s)
dunglas
2
1.9k
try!Swift Tokyo 2024 参加報告 LT
akidon0000
1
190
Hanami and htmx
bkuhlmann
0
190
educure_カリキュラム生操作マニュアル.pdf
linew_official
0
450
チーム力を高めるスクラム実践法:カンバン公開と課題攻略について - ニフティのスクラムトーク Vol. 2 - NIFTY Tech Talk #18
niftycorp
PRO
1
110
Featured
See All Featured
Docker and Python
trallard
33
2.7k
Designing on Purpose - Digital PM Summit 2013
jponch
110
6.4k
Typedesign – Prime Four
hannesfritz
36
2k
It's Worth the Effort
3n
180
27k
Optimising Largest Contentful Paint
csswizardry
7
2.3k
Building a Modern Day E-commerce SEO Strategy
aleyda
16
6.3k
Navigating Team Friction
lara
177
13k
Ruby is Unlike a Banana
tanoku
95
10k
Designing for Performance
lara
601
67k
Atom: Resistance is Futile
akmur
258
25k
Gamification - CAS2011
davidbonilla
76
4.6k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
60
14k
Transcript
1)1$POGFSFODF+BQBO ͳΔ͘+BWB4DSJQUΛॻ͔ͳ͍Ͱ 4ZNGPOZͷ6*ΛϦονʹ͢Δ 4ZNGPOZ69
֯ాɹҰฏʢ͢Έ͍͍ͩͬʣ w ౡݝग़ɺେࡕࡏॅ w ϑϦʔϥϯε8FCσϕϩούʔ w 4ZNGPOZ.FFUVQ,BOTBJӡӦ ίϛϡχςΟ׆ಈͬͯ·͢
"(&/%" w 4ZNGPOZ69ͱ w 4ZNGPOZ69Λ͏ͱԿ͕ྑ͍͔ w 4ZNGPOZ69ͷ͓͢͢Ίίϯϙʔωϯτ
4ZNGPOZ69ͱ
όοΫΤϯυͱϑϩϯτΤϯυΛ ͭͳ͙ڮ
ϑϩϯτΤϯυ όοΫΤϯυ
4ZNGPOZ69 ϑϩϯτΤϯυ όοΫΤϯυ ˣͳΔ͘؆୯ʹϑϩϯτΤϯυͷΧελϚΠζΛߦ͑ΔΑ͏ʹ
4ZNGPOZ69 8FCQBDL&ODPSF 4ZNGPOZ 5XJH 4ZNGPOZ69ߏ ˡϑϨʔϜϫʔΫ ˡςϯϓϨʔτΤϯδϯ ˡ8FCQBDL౷߹ϥΠϒϥϦ ˡ69ϥΠϒϥϦ
ओͳػೳ w 69ܥ+BWB4DSJQUϥΠϒϥϦΛར༻ w 69༻ςϯϓϨʔτλάɾΫϥεͰ+BWB4DSJQUͷࣗಈੜ w 1)1ͷΛ+BWB4DSJQUεϜʔζʹ͢ 69ʹؔΘΔػೳ֦ு Λఏڙ
ݟͨܥ ϑΥʔϜܥ 5XJHܥ w5XJH$PNQPOFOU w-JWF$PNQPOFOU w$IBSUKT w-B[Z*NBHF w4XVQ w5VSCP w5ZQFE
w/PUJGZ w"VUPDPNQMFUF w*NBHF$SPQQFS w4UZMJ[FE%SPQ[POF ౷߹ܥ w3FBDU w7VF /FX
1)1ύοέʔδΠϯετʔϧ QBDLBHFKTPOه Πϯετʔϧ
4ZNGPOZ69Λ͏ͱԿ͕ྑ͍͔
ݟͨେࣄͩΑʂ Ξχϝʔγϣϯ͍ͨ͠ ͳΜ͔γϡοͱ͍ͨ͠ ݕࡧΛ͔ͬ͜Αͯ͘͠ ཧը໘͍ͮΒ͍ʂ ʑɺ͍Ζ͍Ζͳཁ͕ͱͲ͖·͢
+BWB4DSJQUʹ ςϯϓϨʔτͷίʔυΛ ॻ͘߹͕͋Δɻ
+BWB4DSJQUͷͨΊͷ"1*Λ ࡞Δඞཁ͕͋Δɻ
69༻ΦϒδΣΫτΛ࡞Δ 69༻ςϯϓϨʔτ ؔλάΛ͏ جຊ͜ͷ̎ύλʔϯ
+BWB4DSJQUͰॻ͍ͨ߹ ྫ͑$IBSUKTΛ
DIBSU#VJMEFSDSFBUF$IBSU \άϥϑछผ^ ˠάϥϑΦϒδΣΫτ࡞ DIBSUTFU%BUB \σʔλ^ ˠάϥϑͷσʔλΛηοτ +BWB4DSJQUͰઃఆ͢ΔσʔλΛ
1)1Ͱهड़ 4ZNGPOZ69ͩͱ
\\SFOEFS@DIBSU ^^Ͱ+BWB4DSJQUੜ
None
w ඞཁҎ্ʹ+BWB4DSJQUΛॻ͔ͳͯ͘Α͘ͳΔ w ඞཁҎ্ʹ"1*Λ࡞Δඞཁ͕ͳ͘ͳΔ w طଘͷϓϩδΣΫτʹ؆୯ʹಋೖͰ͖Δ w ຌϛε͕ݮΔʢྫɿ+4ͷจࣈྻ݁߹Ͱzzͬͯͨʣ 4ZNGPOZ69Λ͏͜ͱͰʜ গͳ͍࿑ྗͰݟͨΛվળʂ
4ZNGPOZ69ͷछྨ
ݟͨܥ ϑΥʔϜܥ 5XJHܥ w5XJH$PNQPOFOU w-JWF$PNQPOFOU w$IBSUKT w-B[Z*NBHF w4XVQ w5VSCP w5ZQFE
w/PUJGZ w"VUPDPNQMFUF w*NBHF$SPQQFS w4UZMJ[FE%SPQ[POF ౷߹ܥ w3FBDU w7VF ࠓճհ͢Δίϯϙʔωϯτ /FX
ϖʔδʹΞΫγϣϯΛ͚ͭΔͷʹศར ϖʔδ ϖʔδ " # ΠϯλϥΫςΟϒͳ ϖʔδ " $
ݟͨܥ ϑΥʔϜܥ 5XJHܥ w5XJH$PNQPOFOU w-JWF$PNQPOFOU w$IBSUKT w-B[Z*NBHF w4XVQ w5VSCP w5ZQFE
w/PUJGZ w"VUPDPNQMFUF w*NBHF$SPQQFS w4UZMJ[FE%SPQ[POF ౷߹ܥ w3FBDU w7VF ࠓճհ͢Δίϯϙʔωϯτ /FX ͦΕͧΕʹಛੑ͋Γ
)PUXJSF5VSCPΛͬͯ41"ʢͬΆ͍ಈ͖ʣʹ͠·͢ 5VSCP TZNGPOZVYUVSCP
5VSCPछྨ 5VSCP w 5VSCP%SJWF ˠϖʔδશମʹ࡞༻ w 5VSCP'SBNF ˠϖʔδͷ̍Օॴʹ࡞༻
w 5VSCP4USFBN ˠϖʔδͷෳՕॴʹ࡞༻
5VSCP%SJWF ೖΕΔ͚ͩͰɺϦϯΫઌͷϖʔδΛ"KBYͰऔಘ͠දࣔΛࠩ͠ସ͑·͢
ϑΥʔϜૹ৴࣌ɺಉҰ63-Λ࠶ඳը͢Δ͜ͱ͕Ͱ͖ͳ͍ʂʂ
5VSCP'SBNF ը໘ͷҰ෦͚ͩΞΫγϣϯઌͷϖʔδΛ"KBYͰऔಘ͠දࣔΛࠩ͠ସ͑·͢
UVSCPGSBNFͰғΉͱ͚ͦͩ͜࠶ඳը͠·͢
TSDࢦఆͰԆಡࠐ͠·͢
ϑΥʔϜૹ৴࣌ɺෳՕॴΛ࠶ඳը͢Δ͜ͱ͕Ͱ͖ͳ͍ʂʂ
5VSCP4USFBN ΞΫγϣϯͰෳՕॴΛ"KBYͰऔಘ͠දࣔΛࠩ͠ସ͑·͢
lUVSCP@TUSFBNz ͱ͍͏ϑΥʔϚοτͰ ಛघͳσʔλΛग़ྗ
UVSCPTUSFBNͰғΉ λʔήοτ*%Λத৺ʹ࠶ඳը
BDUJPOlVQEBUFzɿλʔήοτͰࢦఆͨ͠*%λάΛ࠶ඳը͠·͢
5VSCP4USFBNΞΫγϣϯͷछྨ UVSCPTUSFBNBDUJPOl\͜͜^z w BQQFOE ˠࢦఆ*%λάͷ࠷ޙʹՃ w QSFQFOE ˠࢦఆ*%λάͷ࠷ॳʹՃ
w SFQMBDF ˠࢦఆ*%λάΛॻ͖͑ w VQEBUF ˠࢦఆ*%λάΛॻ͖͑ w SFNPWF ˠࢦఆ*%λάΛআ w CFGPSF ˠࢦఆ*%λάͷલʹՃ w BGUFS ˠࢦఆ*%λάͷޙΖʹՃ
None
.&3$63& "114&37&3 .&3$63&͕44&ʢ4FSWFS4FOU&WFOUTʣͷϋϒͱͯ͠ಈ࡞ 1045 44& 44& 44&
5VSCP4USFBN 5VSCP4USFBN 5VSCPTUSFBN .&3$63& "114&37&3 44&Ͱ5VSCP4USFBNΛૹ৴͢Δ͜ͱ͕Մೳ 1045
IVCQVCMJTI OFX6QEBUF ࢦఆ͞ΕͨτϐοΫͰ44&ૹ৴ τϐοΫ 5VSCP4USFBN
lDIBUz τϐοΫΛϦοεϯ 44&Λड͚औΔͱ࠶ඳը ʢෳ*%Մೳʣ
QVCTVC͕+BWB4DSJQUΛߦॻ͔ͣʹ࣮ݱͰ͖·͢
w ϦΞϧλΠϜੑͷඞཁͳΟδΣοτ w ࠲੮ࢦఆ w ͍͍ͶϘλϯʢ݅ʣ w QVCTVC w ίϝϯτ
w νϟοτ w JEཧ͕͔ͬ͠Γඞཁ w ηΩϡϦςΟͷߟྀ͕ඞཁ ˠᷖᮣʹͭ͘Δͱݸਓใ࿙Ӯ͢Δ 5VSCP )PUXJSF5VSCPΛͬͯ41"ʢͬΆ͍ಈ͖ʣʹ͠·͢ ҙ γʔϯ
˞ల։͞Εͨ)5.-͕࠶ඳը͞Ε·͢
5XJHͱΫϥεΛͬͯίϯϙʔωϯτΛ࡞Γ·͢ 5XJH$PNQPOFOU TZNGPOZVYUXJHDPNQPOFOU
None
None
QVCMJD QSJWBUFʹΑΔΞΫηε੍ޚ Կܧঝ͍ͯ͠ͳ͍Ϋϥε ΦʔτϫΠϠϦϯάʹΑΔ%* 5XJHͰࢦఆ͞ΕΔ͜ͱͰ ɹ࣮ߦ͞ΕΔϝιου
DPNQVUFEΛ͏ͱ࣮ߦ݁ՌΛอ࣋͠ɺ࣍ճҎ࣮߱ߦ݁ՌΛฦ͠·͢
5XJH$PNQPOFOUʹঢ়ଶอ࣋ͱΞΫγϣϯΛՃ͠·͢ -JWF$PNQPOFOU TZNGPOZVYMJWFDPNQPOFOU
<-JWF1SPQT> <-JWF"DUJPO> ˠεςʔτϑϧͳϓϩύςΟ ˠΞΫγϣϯϝιου <"T-JWF$PNQPOFOU> ˠ-JWF$PNQPOFOUએݴ
\\BUUSJCVUF^^ ˠඞཁͳଐੑΛՃ EBUBBDUJPOlMJWFBDUJPOz EBUBBDUJPOOBNFlϝιου໊z ˠࢦఆͨ͠ϝιουΛ࣮ߦ EBUBNPEFMlϓϩύςΟ໊z ˠࢦఆͨ͠ϓϩύςΟΛඥ͚ όΠϯυ
-JWF$PNQPOFOU ϖʔδ ίϯϙʔωϯτͷಈ͖Λࢹͯ͠ɺϦΫΤετɾϨεϙϯε όΠϯυͨ͠ϓϩύςΟͷมߋɾΞΫγϣϯ࣮ߦ ϝιου࣮ߦ BKBY௨৴ Ϩεϙϯε ϨεϙϯεΛ֘෦ʹө
None
ϦΞϧλΠϜʹϑΥʔϜͷόϦσʔγϣϯ͕ՄೳʹͳΓ·͢
w ຊےϢʔεέʔεͱؔͳ͍෦Ͱ w ະಡ݅ w %#֎෦࿈ܞ͕ඞཁͳ෦ w ݕࡧϑΥʔϜ w ͓߹ͤϑΥʔϜ
w ݱࡏͷΧʔτ w ༣ศ൪߸Ͱͷॅॴݕࡧ w एׯಈ͖͕͍͋͠ͱ͖͕͋Δ w ࣮ߦ࣌ؒͪΐͬͱ͔͔Δ -JWF$PNQPOFOU ҙ γʔϯ 5XJH$PNQPOFOUʹঢ়ଶอ࣋ͱΞΫγϣϯΛՃ͠·͢
3FBDUίϯϙʔωϯτΛར༻͠·͢ 3FBDU TZNGPOZVYSFBDU
None
ίϯϙʔωϯτͷωετՄೳ
7VFίϯϙʔωϯτΛར༻͠·͢ 7VF
ҙ γʔϯ w طଘͷ3FBDUίʔυͷҠ২ w ίϯϙʔωϯτͦͷ··ར༻Մ w 3FBDUґଘͳͳ6*Λ࠾༻ w ϑϩϯτΤϯυΤϯδχΞͱۀ
w 3FBDUଆϑϩϯτΤϯυ w ͷҾ͖͠ར༻όοΫΤϯυ w Ϟμϯͳ8FCϑϩϯτΤϯυͷ ਐతͳಋೖ w 3FBDUͰ5XJHͷػೳ͑ͳ͍ w ಈతͳ5XJHଆ͔Β͢ w ͔͜͜Βઌ+4ͷੈք 3FBDU 3FBDUίϯϙʔωϯτΛར༻͠·͢
·ͱΊ
հͨ͠ίϯϙʔωϯτ·ͱΊ 5VSCP -JWF 3FBDU w উखʹ41"Խ w ϦΞϧλΠϜʹ ࠷৽ͷঢ়ଶʹมߋͰ͖Δ
w ෳՕॴͷมߋ͕༰қ w एׯ͕ͤͭ͘Α͍ w ͍׳Εͨ4ZNGPOZͷ ॻ͖ํͰ࡞Ͱ͖Δ w ϑΥʔϜͷόϦσʔγϣϯ w +4΄΅օແ w طଘͷ3FBDUͷҠ২͕ Ͱ͖Δ w ϑϩϯτΤϯυͱۀՄ w ͔͜͜Β͖͞+4
4ZNGPOZ69 w +4ΛͳΔ͘ॻ͔ͣʹϑϩϯτΤϯυΛϦονʹ͢Δ w େ·͔ʹݟͨɺϑΥʔϜɺ5XJHɺ౷߹ͷछྨ w طଘʹ৽نʹಋೖൺֱత༰қʢҰ෦ͰՄʣ w ϊϋͦ͜·Ͱཷ·ͬͯͳ͍ͷͰɺτϥΠˍΤϥʔ͕ඞཁ
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠