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.6k
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
250
ヤギでもわかるソフトウェアテスト
keitarookamura
0
110
ヤギでもわかるオブジェクト指向UIデザイン
keitarookamura
3
270
ヤギでもわかるGit入門
keitarookamura
1
220
ユースケースから考えるユーザビリティ
keitarookamura
1
170
サクッと簡単!お手軽 Scaffold
keitarookamura
1
260
自社サイトをPWA化した話
keitarookamura
0
100
CSS Animations vs WAAPI
keitarookamura
0
460
マイクロインタラクションから考えるアニメーション
keitarookamura
1
240
Other Decks in Technology
See All in Technology
とあるユーザー企業におけるリスクベースで考えるセキュリティ業務のお話し
4su_para
3
330
急成長中のWINTICKETにおける品質と開発スピードと向き合ったQA戦略と今後の展望 / winticket-autify
cyberagentdevelopers
PRO
1
160
Fargateを使った研修の話
takesection
0
120
ガバメントクラウド単独利用方式におけるIaC活用
techniczna
3
270
WINTICKETアプリで実現した高可用性と高速リリースを支えるエコシステム / winticket-eco-system
cyberagentdevelopers
PRO
1
190
国土交通省 データコンペ参加者向け勉強会
takehikohashimoto
0
110
顧客が本当に必要だったもの - パフォーマンス改善編 / Make what is needed
soudai
24
6.8k
生成AIの強みと弱みを理解して、生成AIがもたらすパワーをプロダクトの価値へ繋げるために実践したこと / advance-ai-generating
cyberagentdevelopers
PRO
1
180
Product Engineer Night #6プロダクトエンジニアを育む仕組み・施策
hacomono
PRO
1
470
AWS CDKでデータリストアの運用、どのように設計する?~Aurora・EFSの実践事例を紹介~/aws-cdk-data-restore-aurora-efs
mhrtech
4
650
話題のGraphRAG、その可能性と課題を理解する
hide212131
4
1.5k
Figma Dev Modeで進化するデザインとエンジニアリングの協働 / figma-with-engineering
cyberagentdevelopers
PRO
1
430
Featured
See All Featured
BBQ
matthewcrist
85
9.3k
Facilitating Awesome Meetings
lara
49
6k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
25
1.8k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
14
1.9k
Building a Scalable Design System with Sketch
lauravandoore
459
33k
For a Future-Friendly Web
brad_frost
175
9.4k
How GitHub (no longer) Works
holman
311
140k
Put a Button on it: Removing Barriers to Going Fast.
kastner
59
3.5k
Ruby is Unlike a Banana
tanoku
96
11k
Fireside Chat
paigeccino
32
3k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
250
21k
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 ʣ ɾ࠷ऴతʹίϯϙʔωϯτϑΝΠϧͱͯ͠Γ͚Δͷ ʮ࠶ར༻ʯͰ͖Δ͔Ͳ͏͔ͰܾΊͨ❗
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ