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
Vue.js+AtomicDesign
Search
KeitaroOkamura
June 21, 2018
Technology
2
2.7k
Vue.js+AtomicDesign
Vue.js / Vuex / AtomicDesign / fukuokajs
KeitaroOkamura
June 21, 2018
Tweet
Share
More Decks by KeitaroOkamura
See All by KeitaroOkamura
Suspenseのユースケースを探る
keitarookamura
1
290
ヤギでもわかるソフトウェアテスト
keitarookamura
0
130
ヤギでもわかるオブジェクト指向UIデザイン
keitarookamura
3
300
ヤギでもわかるGit入門
keitarookamura
1
250
ユースケースから考えるユーザビリティ
keitarookamura
1
210
サクッと簡単!お手軽 Scaffold
keitarookamura
1
290
自社サイトをPWA化した話
keitarookamura
0
120
CSS Animations vs WAAPI
keitarookamura
0
510
マイクロインタラクションから考えるアニメーション
keitarookamura
1
270
Other Decks in Technology
See All in Technology
生成AI時代のデータ基盤
shibuiwilliam
3
1.8k
DeNA での思い出 / Memories at DeNA
orgachem
PRO
6
1.9k
『FailNet~やらかし共有SNS~』エレベーターピッチ
yokomachi
1
190
モダンフロントエンド 開発研修
recruitengineers
PRO
9
6.1k
【初心者向け】ローカルLLMの色々な動かし方まとめ
aratako
2
1.6k
ヘブンバーンズレッドのレンダリングパイプライン刷新
gree_tech
PRO
0
430
進捗
ydah
2
230
攻撃と防御で実践するプロダクトセキュリティ演習~導入パート~
recruitengineers
PRO
3
1.7k
クラウドセキュリティを支える技術と運用の最前線 / Cutting-edge Technologies and Operations Supporting Cloud Security
yuj1osm
2
250
エラーとアクセシビリティ
schktjm
0
130
Automating Web Accessibility Testing with AI Agents
maminami373
0
200
ヘブンバーンズレッドにおける、世界観を活かしたミニゲーム企画の作り方
gree_tech
PRO
0
420
Featured
See All Featured
Optimising Largest Contentful Paint
csswizardry
37
3.4k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
The Language of Interfaces
destraynor
160
25k
A Modern Web Designer's Workflow
chriscoyier
696
190k
Designing for Performance
lara
610
69k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
126
53k
Intergalactic Javascript Robots from Outer Space
tanoku
272
27k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
910
Docker and Python
trallard
45
3.5k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Transcript
7VFKT "UPNJD%FTJHO 'VLVPLB+4
,FJUBSP0LBNVSB ΧϥϏφςΫϊϩδʔגࣜձࣾ 'SPOUFOE&OHJOFFS ϑϩϯτΤϯυΤϯδχΞੜ ࣗݾհ @karaagekeitaroo
ɾ"UPNJD%FTJHOʹ͍ͭͯ ɾίϯϙʔωϯτઃܭʢ7VF 7VFYʣʹ͍ͭͯ ɾ࣮ʹ͓͚ΔϧʔϧΛߟ͑ͯΈͨ ࠓ͢Δ
Έͳ͞Μ7VFKT͍ͬͯ·͔͢ʁ
ΧϯϑΝϨϯε͕։࠵͞Ε·͢ʢຊॳʣ
7VFKTͱʁ ɾ7VFKTϢʔβʔΠϯλʔϑΣΠεΛߏங ͢ΔͨΊͷ1SPHSFTTJWF'SBNFXPSL ɾίϯϙʔωϯτࢦʢ8FC$PNQPOFOUͷ ༷ʹԊͬͯઃܭ͞Ε͍ͯΔʣ
ίϯϙʔωϯτͷཻ͕ࣗ༝Ͱॊೈͳɺ ઃܭͰΉ͜ͱͬͯ͋Γ·ͤΜ͔ʁ
ͦ͜Ͱ"UPNJD%FTJHO
ͯ͢ͷཁૉΛʮ"UPNʢݪࢠʣʯ͔Β࢝·Δ ̑ͭͷཁૉʹղͯ͠ɺΈ߹Θ͍ͤͯ͘σβ Πϯख๏ͷ͜ͱ "UPNJD%FTJHOʢΞτϛοΫσβΠϯʣͱʁ
ίϯϙʔωϯτͷཻͷࢦ ⁞"UPNTʢΞτϜɾࢠʣ .PMFDVMFTʢϞϧΩϡʔϧɾࢠʣ 0SHBOJTNTʢΦϧΨχζϜɾੜʣ 5FNQMBUFTʢςϯϓϨʔτʣ 1BHFTʢϖʔδʣ
⁞"UPNTʢΞτϜɾࢠʣ "UPNTͦͷ໊લͷ௨Γɺػೳతʹ͜Ε Ҏ্ׂͰ͖ͳ͍ίϯϙʔωϯτ
⁞"UPNTʢΞτϜɾࢠʣ ྫͱͯ͠ɺϑΥʔϜͰ͍͏ͱ ʮϥϕϧʯʮೖྗ෦ʯʮϘλϯʯͷ֤ཁ ૉ͕"UPNTͱͳΓ·͢
.PMFDVMFTʢϞϧΩϡʔϧɾࢠʣ ͭҎ্ͷ"UPNT͔ΒΈ߹Θͤͯ࡞Β Εͨίϯϙʔωϯτ .PMFDVMFTͷ୯Ґʮͭͷ͜ͱ͕͏·͘ Ͱ͖Δ͜ͱʯ͕ਪ͞Ε͍ͯΔ
.PMFDVMFTʢϞϧΩϡʔϧɾࢠʣ ྫͱͯ͠ɺ ʮςΩετϘοΫεʯ ʮϘλϯʯʮೖ ྗϑΥʔϜʯͳͲ
0SHBOJTNTʢΦϧΨχζϜɾੜʣ .PMFDVMFTͷΈ߹ΘͤͰ࡞ΒΕͨൺֱ తෳࡶͳίϯϙʔωϯτ ࠷ऴతͳΠϯλʔϑΣʔεʹۙ͘ͳΓɺ࠶ ར༻ੑͷߴ͍ίϯϙʔωϯτʹͳΔ
0SHBOJTNTʢΦϧΨχζϜɾੜʣ ྫͱͯ͠ɺʮϔομʔʯʮϦετʯͳ Ͳ
5FNQMBUFTʢςϯϓϨʔτʣ ίϯϙʔωϯτΛϨΠΞτ͠ɺσβΠϯ ͷجຊతͳߏΛ໌֬ʹ͢ΔϖʔδϨϕϧ ͷΦϒδΣΫτ ݴ͍͑ΔͳΒʮϫΠϠʔϑϨʔϜʯ
1BHFTʢϖʔδʣ ϧʔλʔʹඞͣඥͮ͘ίϯϙʔωϯτ 5FNQMBUFTʹ࣮ࡍͷίϯςϯπ͕ೖΓ۩ ମతͳ࢟ͱͳͬͨঢ়ଶ͕1BHFTʹͳΓ· ͢
2ɿʮσʔλͷྲྀΕʯ͔Βݟͨ ίϯϙʔωϯτઃܭʹ͑Δͷʁ
"ɿ"UPNJD%FTJHOίϯϙʔωϯτࢦͷ ߟ͑ํʹϚον͠·͢ ʢ͖ͪΜͱ্࣮ͷϧʔϧΛઃ͚Εʂʣ
ʮσʔλͷྲྀΕʯͱʁ ɾঢ়ଶཧͷ͜ͱ ʢίϯϙʔωϯτؒͰͷσʔλ ड͚͠Πϕϯτୡͷ ΈʣΛࢦ͠·͢ ɾ7VFKTͰ7VFYΛ.PEFM ͱͯ͠ѻ͍·͢
ʮ7VFYʯͱʁ ɾ7VFY7VFKTΞϓϦέʔγϣϯͷͨΊͷ ঢ়ଶཧύλʔϯ ϥΠϒϥϦ ɾ7VFY4UPSFͱ͍͏ΞϓϦέʔγϣϯͷ ঢ়ଶʢ4UBUFʣΛอ࣋͢ΔίϯςφͰ͢
্࣮ͷϧʔϧͱͯ͠ ֤ίϯϙʔωϯτͷׂΛߟ͑ͯΈΔ
্࣮ͷϧʔϧ ⁞"UPNTʢΞτϜɾࢠʣ ɾଞͷίϯϙʔωϯτʹґଘ͠ͳ͍ ɾϩδοΫٴͼ4UBUFΛ࣋ͨͳ͍ʢεςʔτϨεʣ ɾσʔλΛ4UPSF͔Βऔಘ͠ͳ͍ ɾཁૉ͔ΒͷσʔλΛड͚औΓɺඳըཁૉʹ σʔλΛϨϯμϦϯά͢Δ͚ͩ
্࣮ͷϧʔϧ .PMFDVMFTʢϞϧΩϡʔϧɾࢠʣ ɾ"UPNTͷґଘ0,ʂ͚ͩͲ.PMFDVMFTಉ࢜ͷґ ଘͳΔ͘ආ͚Δ ɾঢ়ଶʹԠͯ͡"UPNTͷϓϩύςΟΛมߋͨ͠Γɺ "UPNTͷදࣔΓସ͑Λߦ͏ ɾ"UPNTͷΠϕϯτϋϯυϦϯάΛߦ͏ ɾσʔλΛ4UPSF͔Βऔಘ͠ͳ͍
্࣮ͷϧʔϧ 0SHBOJTNTʢΦϧΨχζϜɾੜʣ ɾཁૉ͔ΒͷσʔλΛड͚औΔʢগͳ͍ใʣ ɾ.PMFDVMFT"UPNTͷґଘ0,ʂ ɾෳͷ1BHFT͔Β࠶ར༻͞Εͯྑ͍Α͏ʹ࡞Δ ɾࢠཁૉͷΠϕϯτϋϯυϦϯάɺΠϕϯτͷൃߦ ɾ4UPSFͷΞΫηε0,ʂ
্࣮ͷϧʔϧ 5FNQMBUFTʢςϯϓϨʔτʣ ɾ5FNQMBUFT্࣮1BHFTͱҙຯ߹͍͕ ಉ͡ʹͳΔͨΊɺ༻͠ͳ͍͜ͱʹ͠·͠ ͨ
্࣮ͷϧʔϧ 1BHFTʢϖʔδʣ ɾॳݟ࣌ʹσʔλͷྲྀΕ͕໌֬ʹͳΔΑ͏ʹ͢Δ ɾίϯϙʔωϯτؒͷΠϕϯτόεʹͳΔ ɾը໘Ͱڞ௨ͷॲཧΛఆٛ͢Δ ɾը໘શମͰඞཁͳ.PEFM4UBUFΛཧ͢Δ ɾ4UPSFͷΞΫηε0,ʂʢඞཁͰ͋Εෳʣ ɾϧʔςΟϯάॲཧΛఆٛ͢Δ
"UPNJD%FTJHOͷ͓͔͛Ͱ ཻ͕దʹࡉ͔͘ͳΓɺ ίϯϙʔωϯτͷׂ͕໌֬ʹ
·ͱΊ ɾ"UPNJD%FTJHOϑϨʔϜϫʔΫʹର͢Δ ઃܭख๏σβΠϯύλʔϯΛըҰతʹͯ͠ ͘ΕΔ ɾͦΕʹ߹Θͤͯίϯϙʔωϯτͷʮׂʯ Λ໌֬ʹ͢Δ্࣮ͷϧʔϧඞཁ
ઃܭͯ͠Έͯࢥͬͨ͜ͱ ɾେ͖͞Λج४ʹ͢Δͱ͍͏ίϯηϓτ͕͔Γ͢ ͔͚ͬͨΕͲɺը໘୯Ґͷઃܭࢥ͔Β٫͢ΔͷͰɺ ࠷ॳ׳Εͳ͍ ɾ࠷্Ͱͦͷը໘ͷͯ͢ͷσʔλΛऔ͖ͬͯͯόέ πϦϨʔ͢ΔΑΓɺͦͷίϯϙʔωϯτ͕ࣗऔͬͯ͘ Δܗ͋Γͳͷ͔ͳɾɾɾΈͲ͜ΖʢQSPQESJMMJOH ʣ ɾ࠷ऴతʹίϯϙʔωϯτϑΝΠϧͱͯ͠Γ͚Δͷ ʮ࠶ར༻ʯͰ͖Δ͔Ͳ͏͔ͰܾΊͨ❗
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ