Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Riot.js で Atomic Design しながら AMESTAGE 作った話

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for yuuki79 yuuki79
July 27, 2016
Technology
7
7.6k

Riot.js で Atomic Design しながら AMESTAGE 作った話

Riot.js + Web Components + Atomic Design は優勝！
#Riot.js #AtomicDesign #WebComponents #AMESTAGE

Avatar for yuuki79

yuuki79

July 27, 2016
Tweet

More Decks by yuuki79

See All by yuuki79
暗号屋の稼業 @ AWS Blockchain Webinar
Avatar for yuuki79 79yuuki
0
120
暗号屋の稼業
Avatar for yuuki79 79yuuki
0
520
NFTビジネス活用の可能性
Avatar for yuuki79 79yuuki
1
500
サルでもわかるブロックチェーン講座
Avatar for yuuki79 79yuuki
0
460
仮想通貨これからどうなる？
Avatar for yuuki79 79yuuki
1
370
ビットコインに対する所有権は認められるのか
Avatar for yuuki79 79yuuki
0
5.6k
Blockchain x Startup
Avatar for yuuki79 79yuuki
0
5.6k
Ripple で学ぶ DEX の世界
Avatar for yuuki79 79yuuki
0
6.4k
日本と海外の放送禁止文化の違い
Avatar for yuuki79 79yuuki
0
790

Other Decks in Technology

See All in Technology
OPENLOGI Company Profile for engineer
Avatar for OPENLOGI hr01
1
61k
Laravelで学ぶOAuthとOpenID Connectの基礎と実装
Avatar for Koji Yoshida kyoshidaxx
4
1.9k
「お金で解決」が全てではない！大規模WebアプリのCI高速化 #phperkaigi
Avatar for すてにゃん stefafafan
5
2.4k
脳が溶けた話 / Melted Brain
Avatar for Keisuke69 keisuke69
1
1.1k
私がよく使うMCPサーバー3選と社内で安全に活用する方法
Avatar for KintoTech_Dev kintotechdev
0
130
非同期・イベント駆動処理の分散トレーシングの繋げ方
Avatar for Ken ichikawaken
1
150
サイボウズ 開発本部採用ピッチ / Cybozu Engineer Recruit
Avatar for Cybozu cybozuinsideout
PRO
10
76k
CloudFrontのHost Header転送設定でパケットの中身はどう変わるのか？
Avatar for nagisa_53 nagisa53
1
210
スケールアップ企業でQA組織が機能し続けるための組織設計と仕組み〜ボトムアップとトップダウンを両輪としたアプローチ〜

Avatar for SmartHR 品質保証本部 qa
0
350
MIX AUDIO EN BROADCAST
Avatar for Erick Ralph Kionga ralpherick
0
110
来期の評価で変えようと思っていること 〜AI時代に変わること・変わらないこと〜
Avatar for estie | エスティ estie
0
110
GitHub Copilot CLI で Azure Portal to Bicep
Avatar for Yuta Matsumura tsubakimoto_s
0
270

Featured

See All Featured
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
66
8.4k
Agile Actions for Facilitating Distributed Teams - ADO2019
Avatar for Mark Kilby mkilby
0
160
How to build an LLM SEO readiness audit: a practical framework
Avatar for Nick Samuel nmsamuel
1
700
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
54k
Tell your own story through comics
Avatar for letsgokoyo letsgokoyo
1
870
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9.2k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.6k
Money Talks: Using Revenue to Get Sh*t Done
Avatar for Nikki Halliwell nikkihalliwell
0
190
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
275
41k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
110
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
Avatar for David Carrasco davidcarrasco
3
89
Dealing with People You Can't Stand - Big Design 2015
Avatar for Cassini Nazir cassininazir
367
27k

Transcript

  1. 3JPUKTͰ"UPNJDEFTJHO͠ͳ͕Β ɹɹɹɹɹɹɹɹɹ࡞ͬͨ࿩ αΠόʔΤʔδΣϯτࢵ஛༎ٍ

  2. ࣗݾ঺հ αΠόʔΤʔδΣϯτ৽ଔೖࣾ ܳೳਓϒϩάɺ"OESPJEΞϓϦϚʔέοτɺεϚϗҭ ੒ήʔϜɺιγϟήϓϩσϡʔαʔɺιγϟήΤϯδ χΞ ݩ+"7" 1.ڬΜͰ/PEFKTɺࠓαʔόʔͱϑϩϯ τΤϯυ ݸਓͰσβΠϯͷ࢓ࣄɺ#B1"ҰظੜɺTDIPPͰ /PEFKTͷઌੜɺஶॻʹʮ8FC੍࡞ऀͷͨΊͷ

    (JU)VCͷڭՊॻʯɻ झຯΞχϝɺΞχιϯ%+

  3. ࠓ೔ͷ࿩ 1PXFSFECZ

  4. 8FC J04 "OESPJE൛͕͋Γ·͢ 8FC ࢹௌͷΈ ഑৴։ൃ༧ఆ εϚϗ ഑৴ɾࢹௌ

  5. ίʔφʔػೳ %&.0 ग़དྷͳ͍ͷͰΞΫηεͯ͠ΈͯͶʂ https://amestage.com

  6. "UPNJD%FTJHO Ͳ͏΍ͬͯ࡞͍ͬͯΔ͔

  7. None
  8. None
  9. None
  10. None
  11. None
  12. None
  13. None
  14. None
  15. None
  16. None

  17. *OTUBHSBNͩͱ͜Μͳײ͡

  18. ϝϦοτ w ෼ྨ͢Δ͜ͱͰɺίϯϙʔωϯτ࠶ར༻ͷྑ͍໨҆ ʹͳΔɻ w σβΠϯมߋʹڧ͘ɺ࠶ར༻ੑ͕ߴ·Δɻ

  19. ࠶ར༻ʁ w 8FCDPNQPOFOUTͷ໨ࢦ͍ͯ͠Δͱ͜Ζ w #PPUTUSBQఔ౓Ͱ͸ελΠϧͷ࠶ར༻ʹཹ·Δɻ w ڍಈ·Ͱ࠶ར༻͠ɺػೳ෇͖ͷίϯϙʔωϯτΛ࢖͍ճ͢ɻ ʠςϯϓϨʔτ͸ɺ໰୊Ͱ͸ͳ͘ɺٕज़Λ෼͚Δ͚ͩͩɻʡ

  20. ࠶ར༻Մೳͳίϯϙʔωϯτͷ࡞੒Λγϯϓϧͳମݧʹɻ

  21. 3JPUKTͰ"UPNJD%FTJHO

  22. 4UZMF(VJEFͰͷʠ࠶ར༻ʡ <style-guide-item> (<yield> ̎ͭ࢖ͬͯഎܠ෇͖Ͱ֬ೝͰ͖Δ) ʜ <toledo-badge-exam> <toledo-badge> <toledo-badge-exam> <toledo-badge> <toledo-badge>

    <toledo-badge>

  23. 4UZMF(VJEFͰͷʠ࠶ར༻ʡ 4UZMF(VJEFͰ࢖ΘΕ͍ͯΔίϯϙʔωϯτ͕
 ຊ൪Ͱ΋ͦͷ··࢖ΘΕ͍ͯΔɻ

  24. 4UZMF(VJEFͷ࣮૷ྫ components/atoms/toledo-button/toledo-button.tag (࣮૷͞Εͨίϯϙʔωϯτຊମ) components/atoms/toledo-button/example.tag (ίϯϙʔωϯτຊମΛstyleguideͰදࣔ͢Δ) style guide result

  25. w 3JPUKT 8FC$PNQPOFOUT "UPNJD%FTJHO͸༏উʂ w มߋʹڧ͍ɺ͚ͲಠࡋతɻσβΠφʔʹσβΠϯσʔλͷ໊લͱ͔ଗ ͑ͯ΋ΒͬͨΓɺ֬ೝͯ͠΋ΒͬͨΓͱ͍͏ϑϩʔ΋ؚΊͯ׬੒ɻϚʔ ΫΞοϓΨϦΨϦͰ͖ΔਓͳΒΑΓ˕ w ʮƂŦŢɺ+4ŧŔŪũƄŝſʯΈ͍ͨͳਓʹ਌࿨ੑ͕ߴ͍ɻͱʹ͔͘௚ײతɻγ

    ϯϓϧɻ w śƀśƀ 'MVY΋8FC$PNQPOFOUTͱ૬ੑྑ͍ɻSJPUPCTFSWBCMF  ͕௒ศརɻ3JPU SFEVYͱ͔΋࣍ͳΜ͔Ͱ࢖͏࣌΍ͬͯΈ͍ͨɻ ΍ͬͯΈͨײ૝

  26. 3JPUKTΦεεϝϙΠϯτ w ͜Ε͔ΒϑϩϯτΤϯυ։ൃ͢ΔͳΒ8FCDPNQPOFOUT ͷߟ͑ʹऩଋ͍ͯ͘͠΂͖ɻ w 8FCDPNQPOFOUT͕ඪ४ίϯϙʔωϯτΛଗ͑ͯ͘Δͷ ͸·ͩઌɻ1PMZNFS͸ະདྷ͗͢Δ͠ɺ3FBDU͸օ 8FC੍࡞ ʹؔΘΔશͯͷਓ ͕࢖͏ʹ͸ͱ͖ͬͭʹ͍͘ɻ

    w ίϯϙʔωϯτΛ࡞ΔͳΒ3JPUKT͕Ұ൪γϯϓϧɻίϯϙʔ ωϯτΛ࡞Δࢦඪͱͯ͠"UPNJD%FTJHO͸૬ੑ͕ྑ͍ɻ

  27. ίϯϙʔωϯτͷ࡞Γํ͕ຊ౰ʹ௚ײతɻ ͔͠΋࢖͍·Θ͠΍͍͢ɻ ͜Ε͘Β͍ͷαʔϏεͰ΋ಈ͘ɺૣ͍ɺ؆୯ɻ

  28. BNFTUBHFDPN