Creating and applying authentication middleware

In vue-router, it's possible to create router guards – functions that run each time a router is changed. Those guards are used as middleware in the router management process. It's common to use them as an authentication middleware or session validators.

In this recipe, we will learn how to create authentication middleware, add metadata to our routes to make them restricted, and create a login page.