If you are an experienced web software engineer, it's very likely that you have already been involved in a project that requires some sort of user account and access management. I would say that it's a sad story in the software scene. It's sad because it appears that a great fraction of projects require implementing pretty much the same obligatory administrative features all over again. It consists of an administrative panel for adding and removing user accounts, integration with some email service for sending passwort-reset and sign-up confirmation links and so on. Since this is something less innovative standard-stuff that just must be done so there's a danger that the team takes some shortcuts to have this solved so they can concentrate on the beef as soon as they can. And that in turn is a big risk because if there's a mistake in the access control implementantion you will possibly have a security vulnerability in your system.
Luckily, the times are changing! The rise of authentication platforms is making software development more efficient since now you can easily integrate a ready-made, robust, fully tested and fully functional authentication and access control platform with your app.
Now I am going to expand the example app by integrating it with Auth0 platform for login control.
Creating Auth0 Credentials
Now let's add a professional production class authentication logic to the Metamatic Car App. First of all, you need an Auth0 account. Go to Auth0 site web site and sign up.
First thing that you need to know about Auth0 is that you can have multiple tenants. You can understand tenant as a rough equivalent of your clients. If you have three clients they will all need unique auth0 domain. It's a safe choise that you create a standalone tenant for each client to keep their stuff separated from each other.
For this example I will create a tenant "Metamatic" to highlight Auth0 integration using the Metamatic Car App. Tenant's name shall be 'metamatic'. You can also choose the region. In this case, 'Europe' is the natural choise.
When you are done creating a tenant, you can proceed to create a new application. That is the Auth0 entity that will correspond your new shiny web app.
What you want to do here is to add authentication for a ReactJS-based single page app. Just enter the name of your app and choose the application type accordingly.
Auth0 has done great work optimizing tutorials and preconfigurations for many types of frameworks. So you can easily appy Auth0 authentication to your app regardless of whether framework you use. But for the Metamatic Car App example we need to choose the ReactJS flavor.
Once you are done the basic settings, your Auth0 credentials are available and you can proceed to implementing the actual authentication parts in your app's software code.