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
[Tama.rb年忘れLT会]レールに乗ったCSSコーディング
Search
ken3ypa
December 27, 2020
Programming
1
780
[Tama.rb年忘れLT会]レールに乗ったCSSコーディング
ken3ypa
December 27, 2020
Tweet
Share
More Decks by ken3ypa
See All by ken3ypa
[Rails Girls Tokyo 13th]株式会社万葉 スポンサーLT
ken3ypa
0
750
[tamarubykaigi01]こわくないDSL
ken3ypa
5
3k
[tama.rb#13]Hash#to_procについて
ken3ypa
0
70
[正規表現]メタ文字をはじめから丁寧に
ken3ypa
2
290
Other Decks in Programming
See All in Programming
.NET Aspireのクラウド対応検証: Azureと他環境での実践
ymd65536
1
430
Introduce dRuby
ledsun
0
110
Pythonによるイベントソーシングへの挑戦と現状に対する考察 / Challenging Event Sourcing with Python and Reflections on the Current State
nrslib
3
1.3k
2024-10-02 dev2next - Application Observability like you've never heard before
jonatan_ivanov
0
180
自分だけの世界を創るクリエイティブコーディング / Creative Coding: Creating Your Own World
chobishiba
2
1.1k
実践Dash - 手を抜きながら本気で作るデータApplicationの基本と応用 / Dash for Python and Baseball
shinyorke
2
270
"noncopyable types" の使いどころについて考えてみた
andpad
0
150
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
9
1.3k
Memory API: Patterns, Use Cases, and Performance
josepaumard
1
160
ポケモンで考えるコミュニケーション / Communication Lessons from Pokémon
mackey0225
4
170
GrafanaのHTTP API を眺めてみよう
rinchoku
0
110
Jakarta EE as Seen Trough the Lens of the ASF
ivargrimstad
0
110
Featured
See All Featured
Practical Orchestrator
shlominoach
186
10k
Gamification - CAS2011
davidbonilla
80
5k
Six Lessons from altMBA
skipperchong
26
3.4k
What the flash - Photography Introduction
edds
67
11k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
46
4.9k
It's Worth the Effort
3n
183
27k
Happy Clients
brianwarren
97
6.7k
The Invisible Customer
myddelton
119
13k
GitHub's CSS Performance
jonrohan
1030
450k
Writing Fast Ruby
sferik
626
60k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
1
290
Robots, Beer and Maslow
schacon
PRO
157
8.2k
Transcript
Ϩʔϧʹͬͨ$44ίʔσΟϯά !LFOZQB 3BJMTʷ5BJMXJOE$44Ͱ !5BNBSCΕ-5ձ
Έͳ͞ΜɺࠓҰ͓ؒർΕ༷Ͱͨ͠ʂ
ͲΜͳҰؒΛա͝͞Ε·͔ͨ͠ʁ
΅͘͜Μͳײ͡Ͱͨ͠
None
ˢ͜ͷลͰ$44ʹ͑Β͍ۤ࿑ͨ͠ͷͰ ࠓ$44ʹ͍͓͍ͭͯͨ͠ͱࢥ͍·͢
࣍ ͖͔͚ͬ 5BJMXJOE$44ͱ 5BJMXJOEʷ3BJMTͰ
4DBGGPMEΞϓϦΛ࡞ͬͨྫ ࠓ͓͢͠Δ͜ͱ
࣍ 5BJMXJOE$44ΛݱͰ͓ͬͨ ʢ͍͔͍͍ͭͨʣ ֓ཁҎ্ͷ5BJMXJOE$44ͷ͓͠ ܥͷࠩͱ͔ɺ1VSHF$44ͱ͔
ࠓ͓͠͠ͳ͍͜ͱ
ͱ͍͏Θ͚Ͱ͍͖ͬͯ·͠ΐ͏ʂ
͖͔͚ͬ w SBJMTOFX͔Β։࢝ɻϑϩϯτͷॳظઃఆɾ࣮αʔόʔαΠυ͕࣮ࢪ w σβΠφʔͷํ$44ॻ͔ͣɺσβΠϯΧϯϓͷ࡞ͷΈ w $44ʹݟͷ͋Δϝϯόʔɺ΄΅օແ w ͍ΘΏΔʮ#PPUTUSBQषʯΛආ͚ΔͨΊɺ$44ϑϨʔϜϫʔΫར༻ͤͣ w
Α͘͏σβΠϯύʔπελΠϧΨΠυΛ࡞ͯ͠ཧ w ϨεϙϯγϒରԠ ͖͔͚ͬɿ$44͍ͬͺ͍͕ΜͬͨϓϩδΣΫτ֓ཁ
͖͔͚ͬ $44ͷॻ͖ํͳΜΘ͔ΒΜʜ #&.ͬͯͳΜ͡Όʜ ϝσΟΞΫΤϦʜ$44ઃܭʜʁ ͦ͏͍͏ͷ͋Δͷ͔ʜ ʙҊ݅ॳظʙ
͖͔͚ͬ 3BJMTͷίʔυҰߦॻ͍ͯͶ͑ʜ ͳΜͳΒελΠϧΨΠυͯ͠Ͷ͑ʜ ͬͱ͏·͘Εͳ͍ͷ͔ʜ ʙҊ݅ʹೖͬͯϲ݄ޙʙ
ʙ·͋ͦΜͳ͜ΜͳͰ৭ʑʙ
͖͔͚ͬ ఆΑΓσβΠϯ·ΘΓʹ͕ ͔͔ͬͯ͠·ͬͨʜ ख͠Կൃੜͨ͠͠ʜ ͬͱɺ͍͍ײ͡ʹ͔͚Δํ๏ ͳ͍ͷ͔ʜ ʙҊ݅ऴྃޙʙ
͖͔͚ͬ ͓ʜ͜Εʜ ʙҊ݅ऴྃޙʙ
None
5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ 5BJMXJOE$44͝ଘͷํɺ৮ͬͨ͜ͱͷ͋Δํ ͲΕ͙Β͍͍Βͬ͠Ό͍·͔͢ʁ
5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ w ϢʔςΟϦςΟϑΝʔετͷ$44ϑϨʔϜϫʔΫ w #PPUTUSBQͷΑ͏ͳίϯϙʔωϯτܥͷΫϥε༻ҙ͞Ε͓ͯΒͣɺͦΕͧΕͷ$44ϓϩύςΟͱ ʹରԠͨ͠ɺϢʔςΟϦςΟΫϥε͕ఏڙ͞Ε͍ͯΔ 5BJMXJOE$44ͱ
5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ
#PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ #PPUTUSBQͩͱ
#PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ 5BJMXJOE$44ͩͱ
#PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ 5BJMXJOE$44ͩͱ
ͪͳΈʹͦͷଞ༗໊ͳ$44ϑϨʔϜϫʔΫͱ ͷൺֱ #PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ ଞͷओཁ$44ϑϨʔϜϫʔΫͱͷൺֱ
#PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ w #PPUTUSBQ w طʢίϯϙʔωϯτʣ͕ఏڙ͞Ε͍ͯΔ w ϢʔςΟϦςΟఏڙ͞Ε͍ͯΔ͕ɺ5BJMXJOE$44΄Ͳଟ͘ͳ͍ w ηϚϯςΟοΫͳDMBTTΛϕʔεʹࢦఆ͢Δ
w 5BJMXJOE$44 w ίϯϙʔωϯτఏڙ͞Ε͍ͯͳ͍ w ϢʔςΟϦςΟͷΈ͕ఏڙ͞Ε͓ͯΓɺ΄΅શͯͷ$44ͷϓϩύςΟΛཏ w ΠϯϥΠϯελΠϧͷΑ͏ͳܗࣜͰDMBTTʢϢʔςΟϦςΟʣΛ༩͢Δ
#PPUTUSBQͱͷൺֱ 5BJMXJOE$44ͱ w ֦ுੑ͕ߴ͍ w ࣗલͰελΠϧΛߏங͍ͯͨ͘͠Ίɺ͍ΘΏΔʮ#PPUTUSBQषʯͷ͠ͳ͍ύʔπ͕ ࡞Ͱ͖Δ w ෆཁͳελΠϧ͕༩͞Εͳ͍ͨΊɺελΠϧͷ্ॻ͖Λ͢Δඞཁ͕ͳ͘ͳΔ w
Α͘͏ελΠϧίϯϙʔωϯτͱͯ͠Γग़͢ࣄ͕Ͱ͖ɺ࠶ར༻Ͱ͖Δ w ʢͪ͜Βͷػೳ͋ͱͰ࣮ྫ͓ݟͤ͠·͢ʣ ϢʔςΟϦςΟϑΝʔετͰ͋Δར
ΠϯϥΠϯͱͷൺֱ 5BJMXJOE$44ͱ ͋Εɺ͡Ό͋ΠϯϥΠϯελΠϧͱԿ͕ҧ͏ͷʁ ͪͳΈʹʮΠϯϥΠϯελΠϧʯͬΆ͍ͱݴ͍·͕ͨ͠ʜ
ΠϯϥΠϯͱͷൺֱ 5BJMXJOE$44ͱ w IPWFSɺGPDVTͳͲͷΠϕϯτΛઃఆՄೳ w ϝσΟΞΫΤϦΛઃఆՄೳ w TNQYNEQYMHQYYMQY w ϕϯμʔϓϨϑΟΫεͷࢦఆ͕ෆཁ
ΠϯϥΠϯελΠϧͱͷൺֱ
ΠϯϥΠϯͱͷൺֱ 5BJMXJOE$44ͱ w XJEUI QBEEJOH DPMPSͳͲʹ͍ͭͯ 5BJMXJOEଆͰఏڙ͞Ε͍ͯΔϢʔςΟ ϦςΟΛར༻͠ɺ༩͢Δํࣜ ΠϯϥΠϯελΠϧͱͷൺֱ
5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ w 5BJMXJOE$44ͱϢʔςΟϦςΟϑΝʔετͷ$44ϑϨʔϜϫʔΫ w ϢʔςΟϦςΟͷΈΛఏڙ͠ɺ w Ϩγϙϯγϒʹهड़Ͱ͖ w ΠϯϥΠϯελΠϧͰίʔσΟϯά͕Մೳͳ֦ுੑͷߴ͍ϑϨʔϜϫʔΫ
·ͱΊΔͱ
5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ ʜͰɺ͜Ε͕Ͳ͏ศརͳͷʁ ·ͱΊΔͱ
5BJMXJOE$44ུ֓ 5BJMXJOE$44ͱ ࣮ࡍͷίʔυΛݟͯΈ·͠ΐ͏ ࠓճͷλΠτϧ
Ϩʔϧʹͬͨ$44ίʔσΟϯά 3BJMTʷ5BJMXJOE$44Ͱ
ίʔυ࣮ྫ 5BJMXJOEʷ3BJMT ը໘ڞ༗Λͯ͠ίʔυΛ֬ೝ͍͖ͯ͠·͢ IUUQTHJUIVCDPNLFOZQBSBJMT@PO@UBJMXJOE@DTT
ײ 5BJMXJOEʷ3BJMT w $44ϑΝΠϧΛ࡞ΒͣϏϡʔϑΝΠϧͷΈʹूதͰ͖ΔͨΊૣ࣮͘Ͱ͖Δ w طଘελΠϧͷ্ॻ໊͖લۭؒͷিಥΛߟ͑ͳͯ͘ྑ͍ w $44Λ͍ͬͯΕΠϯϓοτʢଞͷ'8ͱൺʣ࠷খݶͰࡁΉ w ެࣜ)1ͷݕࡧϖʔδ͕༏ल
ίʔσΟϯάͨ͠ࡍͷײ
ײ 5BJMXJOEʷ3BJMT ैདྷ $44ઃܭ ࣮ ࠷ॳʹઃܭ͢Δඞཁ͕͋Γɺ࣮ͦͷޙ
ײ 5BJMXJOEʷ3BJMT 5BJMXJOE$44ͩͱ $44ઃܭ ࣮ $44ઃܭɾ໋໊ͷϑΣʔζΛޙʹ࣋ͬͯ͘Δ͜ͱ͕Ͱ͖Δ
ײ 5BJMXJOEʷ3BJMT w ηϚϯςΟοΫͰͳ͍ w )5.-ͱ$44͕ີ݁߹ɻDMBTTΛݟͨͱ͖ʹʮͦΕ͕Կͳͷ͔ʯͷผࠔ w ϐΫηϧύʔϑΣΫτʹͳΒͳ͍ w 5BJMXJOE͕ఏڙ͍ͯ͠ΔϢʔςΟϦςΟͷ੍Λड͚Δ
w ͦͦ$44͕ॻ͚ͳ͍ͱ࣮Ͱ͖ͳ͍ w ίϯϙʔωϯτϕʔεͷ'8ͱҟͳΓɺ$44ͷࣝ.645Ͱඞཁ σϝϦοτ
ײ 5BJMXJOEʷ3BJMT w ಠࣗͷίϯϙʔωϯτελΠϧ͕ඞཁ w '8Λ֦ு͢ΔΑ͏ͳελΠϧͰؒʹ߹Θͳ͍έʔε w $44ઃܭʹݟɾܦݧͷͳ͍։ൃϝϯόʔ͕ຆͲ w ॳΛग़͍ͨ͠ɺ$44ઃܭޙճ͠ʹ͍ͨ͠
͏·͘ϋϚΓͦ͏ͳॴɿྫ͑ԼهͷΑ͏ͳϓϩδΣΫτ
ײ 5BJMXJOEʷ3BJMT w ཧը໘͚ࣾπʔϧͳͲ#PPUTUSBQषͷ͢ΔσβΠϯͰͳ͍ ߹ίϯϙʔωϯτϑΝʔετͷ'8 w ͦΕҎ֎ͷ߹5BJMXJOE$44Λੵۃతʹ͍͖͍ͬͯͨؾ࣋ͪ ݸਓతʹ
͓ΘΓʹ 5BJMXJOEʷ3BJMT Ϩʔϧʹͬͨ։ൃΛ͢Δ͜ͱͰ ྑ͍ϓϥΫςΟεʹԊͬͨ։ൃ͕ग़དྷɺ ૉૣ͘ՁΛಧ͚Δ͜ͱ͕Ͱ͖Δ'8 ͱ͜ΖͰ 3BJMT$P$ $POWFOUJPO0WFS$POGJHVSBUJPO Λॏࢹͨ͠ϑϨʔϜϫʔΫ IUUQTEIIELSBJMTJTPNBLBTFIUNM
͓ΘΓʹ 5BJMXJOEʷ3BJMT 5BJMXJOE·ͨɺنʹPNBLBTF͢Δ͜ͱͰ Ϩʔϧʹͬͨ։ൃ͕ग़དྷΔͰҰॹ IUUQTEIIELSBJMTJTPNBLBTFIUNM
͓ΘΓʹ 5BJMXJOEʷ3BJMT ʮਓྨʹ$44ૣ͗ͨ͢ʯͱΑ͘ݴΘΕ·͕͢ ਓྨ͕$44ʹ͍ͭͨ͘Ίͷ5BJMXJOE ͍෩ Λ ఏڙͯ͘͠ΕΔͷͰͱʜظ͍ͯ͠·͢
͓ΘΓʹ 5BJMXJOEʷ3BJMT IUUQTUBJMXJOEDTTKBFOUBQBQQ ܥͷϝδϟʔόʔδϣϯΞοϓ ެࣜαΠτͷຊޠԽߦΘΕ͓ͯΓ ࠓͱͯ)PUͳϑϨʔϜϫʔΫͰ͢ ؾʹͳΔํͥͻ͓ࢼ͍ͩ͘͠͞ʂ
͝ਗ਼ௌ ͋Γ͕ͱ͏͍͟͝·ͨ͠