Saturday, April 1, 2017

Challenge 5: Authentication using Auth0

For this challenge I wanted to learn how to implement an authentication system in Angular 2. I had previous experience with authentication during my co-op where I used passportjs for a token based authentication system. During this challenge I implemented Auth0 and used Twitter Bootstrap for styling. It was surprisingly much easier than I expected. Auth0 handled all of the user storage and signup without me having to worry about it.

I used the quickstart template to get the application up and running quickly and created a service to do the basic interaction with auth0. I also had to install Angular2jwt which is a helper library for autho0 and the lock widget.

One challenge I had was ensuring I included the extension when I added angular2 jwt component to the map object in systemjs.config.js. The component needed to be added to packages as well. Another challenge with the lock widget was that even though it was installed I still needed to add a script tag to index to html:
     <script src="http://cdn.auth0.com/js/lock/10.2/lock.min.js"></script>

Other than those package issues I found the application to be very straight-forward. Below you can see a video of my working challenge.



Here are my quiz results from the tutorial on Auth0:


No comments:

Post a Comment