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
Vuetifyで管理画面ツクール.pdf
Search
booink
December 17, 2019
Programming
1
830
Vuetifyで管理画面ツクール.pdf
booink
December 17, 2019
Tweet
Share
Other Decks in Programming
See All in Programming
「手軽で便利」に潜む罠。 Popover API を WCAG 2.2の視点で安全に使うには
taitotnk
0
590
速いWebフレームワークを作る
yusukebe
5
1.6k
AIコーディングAgentとの向き合い方
eycjur
0
250
CloudflareのChat Agent Starter Kitで簡単!AIチャットボット構築
syumai
2
380
Kiroで始めるAI-DLC
kaonash
2
520
testingを眺める
matumoto
1
130
プロポーザル駆動学習 / Proposal-Driven Learning
mackey0225
2
570
Zendeskのチケットを Amazon Bedrockで 解析した
ryokosuge
3
260
複雑なドメインに挑む.pdf
yukisakai1225
5
960
奥深くて厄介な「改行」と仲良くなる20分
oguemon
1
380
テストカバレッジ100%を10年続けて得られた学びと品質
mottyzzz
2
450
ECS初心者の仲間 – TUIツール「e1s」の紹介
keidarcy
0
150
Featured
See All Featured
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
800
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
A Modern Web Designer's Workflow
chriscoyier
696
190k
We Have a Design System, Now What?
morganepeng
53
7.8k
How to Ace a Technical Interview
jacobian
279
23k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.6k
Art, The Web, and Tiny UX
lynnandtonic
302
21k
A Tale of Four Properties
chriscoyier
160
23k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
What's in a price? How to price your products and services
michaelherold
246
12k
Transcript
7VFUJGZͰ ཧը໘πΫʔϧ
ࠓճͷςʔϚ 7VFUJGZͰཧը໘πΫʔϧʂ
ཧը໘͓͖Ͱ͔͢ʁ
ཧը໘ͷΠϝʔδ w 443Ͱγϯϓϧͳ)5.-Ͱ͍͍͡ΌΜ w 41"ʹͨ͜͠ͱʹΑͬͯɺ͍Ζ͍Ζ࡞ΓࠐΉͷ͕ΊΜͲ͘ ͘͞ͳ͍ʁ
ཧը໘ͷΠϝʔδ w 443Ͱγϯϓϧͳ)5.-Ͱ͍͍͡ΌΜ w 41"ʹͨ͜͠ͱʹΑͬͯɺ͍Ζ͍Ζ࡞ΓࠐΉͷ͕ΊΜͲ͘ ͘͞ͳ͍ʁ
443ͷମݧΛଛͶͣʹ ͞Βʹ ϦονͰ͍͍͢ ཧը໘ΛπΫʔϧʂ
ͱ͍͏Θ͚Ͱ ຊ
ಈ࡞ڥ w 7VF w /VYUKT w 7VFUJGZ w NPEFbTQB` w
7VFY w 7VFSPVUFS
EFNP༻ͷϦϙδτϦ w IUUQTHJUIVCDPNCPPJOLWVFUJGZEFNP
ಥવͰ͕͢
ཧը໘Λ 41"ʹ͠Α͏ͱࢥ͚ͬͨͲ ҙ֎ͱΔ͜ͱଟͯ͘ πϥͨΜʂʂ
͜Μͳܦݧ ͋Γ·ͤΜ͔ʁ
Կ͕πϥͨΜ͔ w σʔλϕʔεͷσʔλΛҰཡදࣔWEBUBUBCMFͰαΫο ͱͰ͖͚ͨͲɺݕࡧϑΥʔϜͷ֤߲Λ63-ʹϚοϐϯ ά͢Δͷ͕ɺ݁ߏΊΜͲ͍͘͞ɻ w ͱ͍͏͔ͦͦͲ͏Δͷʼʻ
σʔλϕʔεͷσʔλΛҰཡද ࣔWEBUBUBCMFͰαΫοͱ Ͱ͖͚ͨͲɺݕࡧϑΥʔϜͷ ֤߲Λ63-ʹϚοϐϯά͢ Δͷ͕ɺ݁ߏΊΜͲ͍͘͞ɻ
Ͳ͏͍͏͜ͱ͔ ͜͏͍͏ͷ
͜͏͍͏͜ͱ 2VFSZ4USJOHͰҰཡදࣔ͢ΔσʔλΛϑΟϧλϦϯά͍ͨ͠
͜͏͍͏͜ͱ 2VFSZ4USJOHͰҰཡදࣔ͢ΔσʔλΛϑΟϧλϦϯά͍ͨ͠ w ݕࡧ݁Ռͷ63-Λڞ༗Ͱ͖Δͷ࠷ߴ w 443ͩͬͨΒݕࡧલͱݕࡧޙΛϒϥβόοΫͰͬͨΓͰ͖Δ͠
͜͏͍͏͜ͱ 443ʹ͢Ε؆୯͡ΌΜͬʂʂʂ 2VFSZ4USJOHͰҰཡදࣔ͢ΔσʔλΛϑΟϧλϦϯά͍ͨ͠
͜͏͍͏͜ͱ 2VFSZ4USJOHͰҰཡදࣔ͢ΔσʔλΛϑΟϧλϦϯά͍ͨ͠ 443ʹ͢Ε؆୯͡ΌΜͬʂʂʂ 41"ͰΓ·͢ ڧ͍ҙࢤ
%FNP http://localhost:15000/spa-shops
࠷ॳଟ͜Μͳؾ࣋ͪ w WEBUBUBCMFͰҰཡϖʔδͰ͖ͨʂ w WQBHJOBUJPOͰϖʔδϯάΦοέʔʂ w ݕࡧϑΥʔϜՃͯ͠ɺϑΟϧλϦϯάᘳʂʂ
࠷ॳଟ͜Μͳؾ࣋ͪ w WEBUBUBCMFͰҰཡϖʔδͰ͖ͨʂ w WQBHJOBUJPOͰϖʔδϯάΦοέʔʂ w ݕࡧϑΥʔϜՃͯ͠ɺϑΟϧλϦϯάᘳʂʂ w ͋ΕɺͰϖʔδΛϦϩʔυ͢ΔͱݕࡧϑΥʔϜͷ݅ޮ ͍ͯͳ͍ʁ
w ϖʔδϖʔδʹͬͯΔ͠ʝ
7VF3PVUFSͷొ • https://router.vuejs.org/ja/
7VF3PVUFSͷొ • this.$router.push({ query: { id: 1 } }) w
ˢ͜Μͳײ͡ͷॲཧΛೖΕΕ͍͍ײ͡ʹͳΔͷͰ ʝʁ w ݕࡧͷλΠϛϯάʹೖΕͯΈΑ͏
%FNP http://localhost:15000/vr-shops
͓ͬͳΜ͔͍͍ײ͡
ͰͳΜ͔͏·͍͔͘ͳ͍ w ϖʔδϯά͢ΔͱQBHFͱ͔͍ͭͯ΄͍͠ͳ w QBHFͷTFUUFSʹSPVUFSQVTIՃ͢Δ͔ w Ϧϩʔυ͢Δͱɺ63-ͦͷ··ͳͷʹදࣔσʔλ͕શ݅ʹͳΔͳ w ͡ΌDSFBUFEͷGFUDIॲཧʹSPVUFRVFSZͷͰݕࡧͰ͖ΔΑ͏ʹ͠Α͏ w
ϒϥβόοΫͯ͠ɺදࣔσʔλ͕มΘΒͳ͍ͧ w ʜ w ҰମͲ͏͢Ε͍͍Μͩʂʂʂ
φϏήʔγϣϯΨʔυ w IUUQTSPVUFSWVFKTPSHKBHVJEFBEWBODFE OBWJHBUJPOHVBSETIUNM
σόοάϩάͰݟͯΈΑ͏ beforeRouteEnter (to, from, next) { console.log('beforeRouteEnter') next() }, beforeRouteUpdate
(to, from, next) { console.log('beforeRouteUpdate') next() }, beforeRouteLeave (to, from, next) { console.log('beforeRouteLeave') next() },
Ͳ͏Β w 63-ʹϚον͢ΔSPVUFͷίϯϙʔωϯτΛಡΈࠐΜͩ࣌ ʹCFGPSF3PVUF&OUFS͕ݺͼग़͞ΕΔ w ಉ͡ίϯϙʔωϯτͰ63-͕ ݕࡧϑΥʔϜϖʔδϯ άʹΑͬͯ มߋ͞ΕΔ࣌ʹCFGPSF3PVUF6QEBUF͕ݺ ͼग़͞ΕΔ
w 63-͕SPVUFͷίϯϙʔωϯτͰແ͘ͳΔ࣌ʹ CFGPSF3PVUF-FBWF͕ݺͼग़͞ΕΔ
ͳͷͰ w CFGPSF3PVUF&OUFSͰ2VFSZ4USJOHͷΛݩʹGFUDIॲཧΛݺͼग़ͤ ྑͦ͞͏ w TIPQTͷ߹ɺTIPQT JE͕खೖྗ͞Εͨ߹ରԠͰ͖ Δ w CFGPSF3PVUF6QEBUFCFGPSF3PVUF&OUFSͱಉ͡ॲཧͰྑ͛͞
w Γ͍ͨ͜ͱશ͘Ұॹ w CFGPSF3PVUF-FBWFԿ͠ͳ͍͍͔ͯ͘ͳ w ಛʹॳظԽॲཧͱ͔ෆཁͳͣ
%FNP http://localhost:15000/shops
·ͱΊ 7VF3PVUFSͱྑ͘ͳΖ͏
͝ਗ਼ௌ ͋Γ͕ͱ͏ ͍͟͝·ͨ͠