code-pop / authentication_course

Repo for Vue Mastery's Token-Based Authentication course

authentication_course

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Same as above and start backend server

npm run start

Compiles and minifies for production

npm run build

Run your tests

npm run test

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.

authentication_course's Issues

npm install fails

using node -v v16.6.0

npm install fails many of the packages are deprecated

npm WARN deprecated [email protected]: Critical security vulnerability fixed in v0.21.1. For more information, see axios/axios#3410
npm WARN deprecated @hapi/[email protected]: Switch to 'npm install joi'
npm WARN deprecated [email protected]: core-js@<3.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.

Missing return after next('/')

In ./src/router.js on the branch "lesson5_FINISH"

authentication_course/src/router.js

Lines 38 to 45 in c7337e1

	router.beforeEach((to, from, next) => {
	const loggedIn = localStorage.getItem('user')
	if (to.matched.some(record => record.meta.requiresAuth) && !loggedIn) {
	next('/')
	}
	next()
	})

After next('/') on line 42, there shoud be a return statement.
If not, the script goes on and hits the next() statement.

Differences in server.js to what is shown in video.

I am following along with Lesson 6: Handling Errors.

Since it took a while for this lesson to come up, I decided to get a snapshot of the code form the end of lesson 5 to follow along.

When looking at the code for server.js it does not match with what is shown in the video. Server errors are incorrect, and I am not getting the same console messages you guys are talking about in the video. My next step is to try the completed lesson 6 code and see if it is up to date.

Get rid of eslint

It gets out of date too quickly and presents a huge bunch of warnings.

Way distracts from and obfuscates the learning experience.

Undefined variable

There is one example code in third video lesson:
import axios from 'axios' ... actions: { register ({ commit }, credentials) { return axios .post('//localhost:3000/register', credentials) .then(({ data }) => { console.log('user data is', **userData**) commit('SET_USER_DATA', data) }) } }
but userData is not correct variable name. It is not used anywhere else and is not defined. Trying copy this and run this code generate an error. It's not important, but yet.

Reasoning behind helpers.js

Not a problem but a question -- I was wondering what the reasoning is for having the intermediary helpers.js file in the store. You are importing mapGetters there and then importing specific items from helpers.js into components.

Thanks for all the work you do on these courses -- they are really helpful.

Including dynamic route to variable publicPages

In code we have a const publicPages = ['/authenticate', '/']
I'm gonna add to this variable a dynamic route such as a '/email-confirm/:uid/:token'
Question: how I can implement this? I'm tried like this:
const publicPages = ['/authenticate', '/', '/email-confirm/:uid/:token'], it is not working
and like this: const publicPages = ['/authenticate', '/', {name: 'email-confirm'}], this also not working
P.S here my route:
{
path: '/email-confirm/:uid/:token',
name: 'email-confirm',
component: () => import('../views/Auth/EmailConfirm')
},