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.3k
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
カーナベルにおけるProtobuf二次利用例
andoshin11
0
120
Envoy External AuthZとgRPC Extensionを利用した「頑張らない」Microservices認証認可基盤
andoshin11
0
650
カーナベル株式会社2024年2月 エンジニアイベント資料
andoshin11
0
350
Private Cloudを支える最高のユーザーガイド運用技術
andoshin11
0
300
TS CompilerがVueを喋れても良いじゃないか
andoshin11
0
740
ain't giving up type-safe Express
andoshin11
2
450
Type Safe "Everything"
andoshin11
0
250
GatewayパターンとSchema駆動開発
andoshin11
7
1.5k
Catch up Nuxt.js 2019.02
andoshin11
0
2.1k
Other Decks in Technology
See All in Technology
公開初日に個人環境で試した Gemini CLI 体験記など / Gemini CLI実験レポート
you
PRO
3
300
「手を動かした者だけが世界を変える」ソフトウェア開発だけではない開発者人生
onishi
4
810
SREを知らずに SREマネージャーになった話 / How I Became an SRE Manager Without Knowing What SRE Is
moneyforward
0
290
Recoil脱却の現状と挑戦
kirik
2
300
Shadow DOM & Security - Exploring the boundary between light and shadow
masatokinugawa
0
660
ObsidianをLLM時代のナレッジベースに! クリッピング→Markdown→CLI連携の実践
srvhat09
7
8.9k
An introduction to Claude Code SDK
choplin
3
3.3k
データエンジニアリング 4年前と変わったこと、 4年前と変わらないこと
tanakarian
2
350
P2P通信の標準化 WebRTCを知ろう
faithandbrave
6
2.3k
本当にわかりやすいAIエージェント入門
segavvy
10
5.9k
MCPに潜むセキュリティリスクを考えてみる
milix_m
1
690
BEYOND THE RAG🚀 ~とりあえずRAG?を超えていけ! 本当に使えるAIエージェント&生成AIプロダクトを目指して~ / BEYOND-THE-RAG-Toward Practical-GenerativeAI-Products-AOAI-DevDay-2025
jnymyk
4
230
Featured
See All Featured
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
50
5.5k
How to Ace a Technical Interview
jacobian
278
23k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
47
9.6k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Optimising Largest Contentful Paint
csswizardry
37
3.3k
Producing Creativity
orderedlist
PRO
346
40k
The Pragmatic Product Professional
lauravandoore
35
6.8k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
26k
Thoughts on Productivity
jonyablonski
69
4.7k
Typedesign – Prime Four
hannesfritz
42
2.7k
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!