Notes

evergreen

A Journey into Vue-Router

Illustrated notes on how routing works in Vue.js

Planted almost 5 years ago

I haven’t explored the Vue framework much but it’s got a thriving community, and I wanted to see how it compared to React, Svelte, and the 20 other font-end framework options.

A box with green vue roads coming out of it

I got to see inside the Vue-machine a little while working through Laurie Barth ’s egghead course on how to set up routes between Vue pages and components.

I made a few illustrated notes on the main concepts

Journey with Vue Router
To setup, install and import vue router, create an empty array of routes, and pass that array into a new router function
When making new routes, each one needs a path and a component. We can also pass parameters to our routes
The wild card path acts as a cacthall for unknown routes

If you’re a Vue person and want to dive into this more, you can check out Laurie’s course here…

Shareable Custom Hooks in React

Want more illustrated notes on web development?

Take a look at Instachatting with Vue & Socket.io , Immutable Data with Immer and Personal Assistant Bots , or What the Fork is xState?

2 Backlinks

Building Custom React Hooks

Illustrated notes on building custom React hooks

What the Fork is xState?

Illustrated notes on how to build state machines with the xState library