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
Riot.js で Atomic Design しながら AMESTAGE 作った話
Search
yuuki79
July 27, 2016
Technology
7
7.5k
Riot.js で Atomic Design しながら AMESTAGE 作った話
Riot.js + Web Components + Atomic Design は優勝!
#Riot.js #AtomicDesign #WebComponents #AMESTAGE
yuuki79
July 27, 2016
Tweet
Share
More Decks by yuuki79
See All by yuuki79
暗号屋の稼業 @ AWS Blockchain Webinar
79yuuki
0
100
暗号屋の稼業
79yuuki
0
500
NFTビジネス活用の可能性
79yuuki
1
470
サルでもわかるブロックチェーン講座
79yuuki
0
430
仮想通貨これからどうなる?
79yuuki
1
340
ビットコインに対する所有権は認められるのか
79yuuki
0
5.5k
Blockchain x Startup
79yuuki
0
5.6k
Ripple で学ぶ DEX の世界
79yuuki
0
6.3k
日本と海外の放送禁止文化の違い
79yuuki
0
760
Other Decks in Technology
See All in Technology
自作LLM Native GORM Pluginで実現する AI Agentバックテスト基盤構築
po3rin
2
210
What is BigQuery?
aizack_harks
0
120
BtoBプロダクト開発の深層
16bitidol
0
140
生成AIを活用したZennの取り組み事例
ryosukeigarashi
0
180
pprof vs runtime/trace (FlightRecorder)
task4233
0
140
組織観点からIAM Identity CenterとIAMの設計を考える
nrinetcom
PRO
1
130
5年間のFintech × Rails実践に学ぶ - 基本に忠実な運用で築く高信頼性システム / 5 Years Fintech Rails Retrospective
ohbarye
9
3.6k
#普通の文系サラリーマンチャレンジ 自分でアプリ開発と電子工作を続けたら人生が変わった
tatsuya1970
0
840
Pythonによる契約プログラミング入門 / PyCon JP 2025
7pairs
5
2.3k
C# 14 / .NET 10 の新機能 (RC 1 時点)
nenonaninu
1
1.3k
[2025-09-30] Databricks Genie を利用した分析基盤とデータモデリングの IVRy の現在地
wxyzzz
0
410
Windows で省エネ
murachiakira
0
150
Featured
See All Featured
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
114
20k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
30
9.7k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.6k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
6.1k
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
A Tale of Four Properties
chriscoyier
160
23k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
600
The Cult of Friendly URLs
andyhume
79
6.6k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.1k
Making the Leap to Tech Lead
cromwellryan
135
9.5k
Rails Girls Zürich Keynote
gr2m
95
14k
Transcript
3JPUKTͰ"UPNJDEFTJHO͠ͳ͕Β ɹɹɹɹɹɹɹɹɹ࡞ͬͨ αΠόʔΤʔδΣϯτࢵ༎ٍ
ࣗݾհ αΠόʔΤʔδΣϯτ৽ଔೖࣾ ܳೳਓϒϩάɺ"OESPJEΞϓϦϚʔέοτɺεϚϗҭ ήʔϜɺιγϟήϓϩσϡʔαʔɺιγϟήΤϯδ χΞ ݩ+"7" 1.ڬΜͰ/PEFKTɺࠓαʔόʔͱϑϩϯ τΤϯυ ݸਓͰσβΠϯͷࣄɺ#B1"ҰظੜɺTDIPPͰ /PEFKTͷઌੜɺஶॻʹʮ8FC੍࡞ऀͷͨΊͷ
(JU)VCͷڭՊॻʯɻ झຯΞχϝɺΞχιϯ%+
ࠓͷ 1PXFSFECZ
8FC J04 "OESPJE൛͕͋Γ·͢ 8FC ࢹௌͷΈ ৴։ൃ༧ఆ εϚϗ ৴ɾࢹௌ
ίʔφʔػೳ %&.0 ग़དྷͳ͍ͷͰΞΫηεͯ͠ΈͯͶʂ https://amestage.com
"UPNJD%FTJHO Ͳ͏ͬͯ࡞͍ͬͯΔ͔
None
None
None
None
None
None
None
None
None
None
*OTUBHSBNͩͱ͜Μͳײ͡
ϝϦοτ w ྨ͢Δ͜ͱͰɺίϯϙʔωϯτ࠶ར༻ͷྑ͍҆ ʹͳΔɻ w σβΠϯมߋʹڧ͘ɺ࠶ར༻ੑ͕ߴ·Δɻ
࠶ར༻ʁ w 8FCDPNQPOFOUTͷࢦ͍ͯ͠Δͱ͜Ζ w #PPUTUSBQఔͰελΠϧͷ࠶ར༻ʹཹ·Δɻ w ڍಈ·Ͱ࠶ར༻͠ɺػೳ͖ͷίϯϙʔωϯτΛ͍ճ͢ɻ ʠςϯϓϨʔτɺͰͳ͘ɺٕज़Λ͚Δ͚ͩͩɻʡ
࠶ར༻Մೳͳίϯϙʔωϯτͷ࡞Λγϯϓϧͳମݧʹɻ
3JPUKTͰ"UPNJD%FTJHO
4UZMF(VJEFͰͷʠ࠶ར༻ʡ <style-guide-item> (<yield> ̎ͭͬͯഎܠ͖Ͱ֬ೝͰ͖Δ) ʜ <toledo-badge-exam> <toledo-badge> <toledo-badge-exam> <toledo-badge> <toledo-badge>
<toledo-badge>
4UZMF(VJEFͰͷʠ࠶ར༻ʡ 4UZMF(VJEFͰΘΕ͍ͯΔίϯϙʔωϯτ͕ ຊ൪Ͱͦͷ··ΘΕ͍ͯΔɻ
4UZMF(VJEFͷ࣮ྫ components/atoms/toledo-button/toledo-button.tag (࣮͞Εͨίϯϙʔωϯτຊମ) components/atoms/toledo-button/example.tag (ίϯϙʔωϯτຊମΛstyleguideͰදࣔ͢Δ) style guide result
w 3JPUKT 8FC$PNQPOFOUT "UPNJD%FTJHO༏উʂ w มߋʹڧ͍ɺ͚ͲಠࡋతɻσβΠφʔʹσβΠϯσʔλͷ໊લͱ͔ଗ ͑ͯΒͬͨΓɺ֬ೝͯ͠ΒͬͨΓͱ͍͏ϑϩʔؚΊͯɻϚʔ ΫΞοϓΨϦΨϦͰ͖ΔਓͳΒΑΓ˕ w ʮƂŦŢɺ+4ŧŔŪũƄŝſʯΈ͍ͨͳਓʹੑ͕ߴ͍ɻͱʹ͔͘ײతɻγ
ϯϓϧɻ w śƀśƀ 'MVY8FC$PNQPOFOUTͱ૬ੑྑ͍ɻSJPUPCTFSWBCMF ͕ศརɻ3JPU SFEVYͱ͔࣍ͳΜ͔Ͱ͏࣌ͬͯΈ͍ͨɻ ͬͯΈͨײ
3JPUKTΦεεϝϙΠϯτ w ͜Ε͔ΒϑϩϯτΤϯυ։ൃ͢ΔͳΒ8FCDPNQPOFOUT ͷߟ͑ʹऩଋ͍͖ͯ͘͠ɻ w 8FCDPNQPOFOUT͕ඪ४ίϯϙʔωϯτΛଗ͑ͯ͘Δͷ ·ͩઌɻ1PMZNFSະདྷ͗͢Δ͠ɺ3FBDUօ 8FC੍࡞ ʹؔΘΔશͯͷਓ ͕͏ʹͱ͖ͬͭʹ͍͘ɻ
w ίϯϙʔωϯτΛ࡞ΔͳΒ3JPUKT͕Ұ൪γϯϓϧɻίϯϙʔ ωϯτΛ࡞Δࢦඪͱͯ͠"UPNJD%FTJHO૬ੑ͕ྑ͍ɻ
ίϯϙʔωϯτͷ࡞Γํ͕ຊʹײతɻ ͔͍͠·Θ͍͢͠ɻ ͜Ε͘Β͍ͷαʔϏεͰಈ͘ɺૣ͍ɺ؆୯ɻ
BNFTUBHFDPN