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
Hack your Nuxt router!
Search
andoshin11
December 11, 2019
Technology
0
1.2k
Hack your Nuxt router!
Enhance your Nuxt application by extracting the router object and hacking it!
Here's how.
andoshin11
December 11, 2019
Tweet
Share
More Decks by andoshin11
See All by andoshin11
Envoy External AuthZとgRPC Extensionを利用した「頑張らない」Microservices認証認可基盤
andoshin11
0
460
カーナベル株式会社2024年2月 エンジニアイベント資料
andoshin11
0
270
Private Cloudを支える最高のユーザーガイド運用技術
andoshin11
0
280
TS CompilerがVueを喋れても良いじゃないか
andoshin11
0
700
ain't giving up type-safe Express
andoshin11
2
420
Type Safe "Everything"
andoshin11
0
230
GatewayパターンとSchema駆動開発
andoshin11
7
1.3k
Catch up Nuxt.js 2019.02
andoshin11
0
2k
The future of Nuxt.js with TypeScript
andoshin11
0
89
Other Decks in Technology
See All in Technology
完全自律型AIエージェントとAgentic Workflow〜ワークフロー構築という現実解
pharma_x_tech
0
340
20250116_自部署内でAmazon Nova体験会をやってみた話
riz3f7
1
100
あなたの人生も変わるかも?AWS認定2つで始まったウソみたいな話
iwamot
3
850
[IBM TechXchange Dojo]Watson Discoveryとwatsonx.aiでRAGを実現!事例のご紹介+座学②
siyuanzh09
0
110
FODにおけるホーム画面編成のレコメンド
watarukudo
PRO
2
270
あなたの知らないクラフトビールの世界
miura55
0
120
テストを書かないためのテスト/ Tests for not writing tests
sinsoku
1
170
いま現場PMのあなたが、 経営と向き合うPMになるために 必要なこと、腹をくくること
hiro93n
9
7.6k
機械学習を「社会実装」するということ 2025年版 / Social Implementation of Machine Learning 2025 Version
moepy_stats
5
1k
WantedlyでのKotlin Multiplatformの導入と課題 / Kotlin Multiplatform Implementation and Challenges at Wantedly
kubode
0
240
技術に触れたり、顔を出そう
maruto
1
150
GoogleのAIエージェント論 Authors: Julia Wiesinger, Patrick Marlow and Vladimir Vuskovic
customercloud
PRO
0
150
Featured
See All Featured
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
30
2.1k
The Language of Interfaces
destraynor
155
24k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
232
17k
Building Adaptive Systems
keathley
38
2.4k
Building a Scalable Design System with Sketch
lauravandoore
460
33k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
[RailsConf 2023] Rails as a piece of cake
palkan
53
5.1k
How GitHub (no longer) Works
holman
312
140k
RailsConf 2023
tenderlove
29
970
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
33
2.7k
Testing 201, or: Great Expectations
jmmastey
41
7.2k
Transcript
Hack your Nuxt router! @andoshin11 Sample Code :https://github.com/andoshin11/studio-andy/pull/119
Routing in Nuxt.js • Place a file inside the pages
directory • Instantly becomes a new route • Incredibly simple and easy! • However...
By extracting router object • Easier to overlook route-meta •
Easier to type-check • Easier to make a url-builder • Easier to generate breadcrumbs
Using router module @nuxtjs/router
Quick Setup! • Install router-module
Quick Setup! • Install router-module • Register the module
Quick Setup! • Install router-module • Register the module •
Create router file
Tips: migrate from default router Step 1 $ nuxt build
Step 2 router.js will be generated Step 3 Copy and paste contents
Override RouteMeta type def
Making url-builder (preparation) • First we need a route resolver
to retrieve the entire ancestors
Making url-builder
Generate Breadcrumbs
Generate Breadcrumbs
Generate Breadcrumbs
Generate Breadcrumbs
Thank you!