Continuing from the registration section, I started working on the Login part last week. There were a few more moving parts here as I had to cover both a password login and of course a magic link login. As I was completing it and testing it there were a few edge cases that had to be dealt with also.

A form is born

You start with your normal email form:

Nothing special. I’m not really a fan of having email only first and always prefer when there is a password field also. However, as we have to deal with both passwords and magic links, this was for the best.

Pressing “Go” will check the email to see if it’s valid and that the account is active. Next it will check what type of login you have. That means either magic links or passwords. Here is the magic link screen:

I’ll probably change the wording here. Once you receive the email, you tap/click on it and you’ll be on your way. Magic links are only valid for 15 minutes.

For password logins I will show you the below:

Easy enough to navigate. There is an addition of a “use magic link” button. This will send a magic link your way, just in case you forget your password. This also sets your login method to be magic link only until you change your password.

Once you’re all confirmed with email, password and/or magic link, you will have to enter your one time passcode:

I still don’t have back up codes set up and I’m thinking of doing something else to facilitate that, so for now I just say to email me. I could trigger the two factor set up on the account once again.

To be honest, you shouldn’t be loosing your data - but I appreciate that it can happen - so I will work something out to make that less painful.

Some edge cases

As with everything I tried to think of a few edge cases along with the ones I came across. For example, when you register there are certain steps to take - but perhaps the user didn’t finish all of them. In that case, depending on the registration step you were at, it will ask you for details that you certainly know for example your email and password, but then it will go ahead and redirect you to the correct registration step to continue. As you probably don’t have any data/servers set up, unless you have finished the sign up, I think this is a good compromise.

All new accounts start with a magic link login, so even if you haven’t chosen you will still be able to login and continue where you left off.

I still need to implement failed logins attempts to disable the account. The database already includes the counter column, so it should be easy to add that.

Next steps

That’s it for now on registration and login. I would call it feature complete. The next task is to think about the Dashboard section - I didn’t have too much brain capacity to think about that just yet.

I wanted to write this post last week; kinda weird times at the moment. I’ll try and keep it more regular in the coming weeks.

Thanks for reading, and if you have any input… let me know!