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
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
ken3ypa
December 27, 2020
Programming
820
1
Share
[Tama.rb年忘れLT会]レールに乗ったCSSコーディング
ken3ypa
December 27, 2020
More Decks by ken3ypa
See All by ken3ypa
[Rails Girls Tokyo 13th]株式会社万葉 スポンサーLT
ken3ypa
0
830
[tamarubykaigi01]こわくないDSL
ken3ypa
5
3.3k
[tama.rb#13]Hash#to_procについて
ken3ypa
0
110
[正規表現]メタ文字をはじめから丁寧に
ken3ypa
2
340
Other Decks in Programming
See All in Programming
プロパティの順序で型推論が壊れる!? TypeScript6.0の修正からContext-Sensitivityの仕組みを追う
bicstone
2
1.2k
AIチームを指揮するOSS「TAKT」活用術 / How to Use “TAKT,” an OSS Tool for Orchestrating AI Teams
nrslib
6
730
Oxcを導入して開発体験が向上した話
yug1224
4
240
要はバランスからの卒業 #yumemi_grow
kajitack
0
200
不変条件と整合性境界—ビジネスが決める設計判断と実現パターン / Invariants and Consistency Boundaries
nrslib
11
2.9k
TSKaigi 2026 TypeScriptバックエンドのオブザーバビリティ戦略 — Datadog × NestJSの実践
taiseiyamamotoan
1
210
GitHub Copilot CLIのいいところ
htkym
2
1.2k
inferと仲良くなる10分間
ryokatsuse
1
270
AI 時代のソフトウェア設計の学び方
masuda220
PRO
28
11k
Stage 3 Decorators でできること / できないこと / TSKaigi 2026
susisu
1
1.3k
ECR拡張スキャンでSBOMを収集して サプライチェーン攻撃の影響調査を 爆速で終わらせてみた
akihisaikeda
2
210
Oxlintはいかにしてtsgolintのlint ruleを呼び出しているのか
syumai
2
990
Featured
See All Featured
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.6k
Designing Experiences People Love
moore
143
24k
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
290
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
55k
Lightning Talk: Beautiful Slides for Beginners
inesmontani
PRO
2
560
ラッコキーワード サービス紹介資料
rakko
1
3.4M
From Legacy to Launchpad: Building Startup-Ready Communities
dugsong
0
220
Joys of Absence: A Defence of Solitary Play
codingconduct
1
380
Ethics towards AI in product and experience design
skipperchong
2
290
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.5k
Typedesign – Prime Four
hannesfritz
42
3.1k
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
250
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ͳϑϨʔϜϫʔΫͰ͢ ؾʹͳΔํͥͻ͓ࢼ͍ͩ͘͠͞ʂ
͝ਗ਼ௌ ͋Γ͕ͱ͏͍͟͝·ͨ͠