Login System

Login System

13th June, 2020

Web , UI

JWT BCrypt MongoDB VueJs SCSS Local Storage Vuex

Description

This is a replication of the login system that was made and used in the anime movie database website. Since I have recently designed a new login interface UI interface, I thought that it would be cool to make a copy of my Angular version in VueJS with Vuex.

Use Case

  • This can be used in situations where users would like to protect certain routes between guests and admins (guard routes)
  • For a blogging website that would have many users publishing and the website needs to identify whether current logged in (?) users would have the priviledge to edit

What is implemented?

  • Storing JWT token to LocalStorage to let users stay logged in without needing to relogin every time
  • Using Vuex state management to handle login, logout and registration
  • Using a proper backend (created separately) in which users need to have a backend that connects to MongoDB at the route ${API_URL}/api/users/authenticate and ${API_URL}/api/users/register for logging and registering respectively
Last updated: 13th June, 2020