Vue 3 Router Example

A basic example of how to use Vue Router with Vue 3 using dynamic and static routes 📚☝️

Table of contents

• Vue 3 Router Example
  • Table of contents
  • General info
  • Demo
  • Screenshots
  • Technologies
  • Setup
  • Usage
  • Status
  • Contact

General info

Date: February, 2021
Duration: 2 Days.

It started as part of a @escuelavue course on Vue 2 and Vue Router, but I ended up adapting it to Vue 3 and Vue Router 4.0

Demo

You can try it using the Demo

Screenshots

Index

Dynamic route

Technologies

• Vue 3
• Vue Router 4
• Vuex

Setup

It does not have much complication, the usual flow, download the repository, install dependencies and serve

1. Clone/Download the repository.

git clone https://github.com/udsgit/vue3-router-example

2. You may have to install the packages with NPM.

npm install

3. Serve to local.

npm run serve

Usage

1. Open the link from the Demo or execute the serve with the steps above.
2. You can access 2 static routes (Legal and Contact), and the dynamic route that each user is.

Status

Project is: Completed.

Because it fulfills its mission of serving as an example for the basic parts of Vue Router with Vue 3.

Contact

Created by @Emmanuel, feel free to contact me!