Preface

In the previous post, we had implement a password validator system with some proper way to make sure our use a hard password to check in the user point of view. However, many would just reuse their own old password everywhere on the internet.. This poses a huge problem if lets say one say the user password was leaked from another website and open up his/her door to our website too?

A few years back, Dropbox introduce a zxcvbn, Its basically a quantitative way of measuring how strong the user password is. While I was working with Django, I came across this library call django-zxcvbn-password. Just to share, the name of zxcvbn came from.. and its not abbreviation of something with a deeper meaning. Well if you look at your normal keyboard, you could see that the name came from the letter located on the bottom row of your keyboard...

Why is it important for us as the developer to include such package in our library? well to be honest we don't, however why not we give the user a method that will share with the how strong is the password they are using and how hard the password is to be cracked.

Installation of django-zxcvbn-password

The command for installing django-zxcvbn-password are as follows

pipenv install django-zxcvbn-password
pipenv lock -r > requirements.txt

Configure django-zxcvbn-password

in the setting.py file add

INSTALLED_APPS = [
    #.... what ever you had registered 
    # Django-zxcvbn-password
    'zxcvbn_password',
    #.... 
]

AUTH_PASSWORD_VALIDATORS = [
    #... anything that have been registered before
    {
        'NAME': 'zxcvbn_password.ZXCVBNValidator',
        'OPTIONS': {
            'min_score': 3,
            'user_attributes': ('username', 'email', 'first_name', 'last_name')
        }
    },
]

How to use django-zxcvbn-password

The power of using django-zxcvbn-password come into play in 2 forms, one is the registration form and the other is the password change form.

a sample that is provided by django-zxcvbn-password as follows for the forms.py

from django import forms
from zxcvbn_password.fields import PasswordField, PasswordConfirmationField

class RegisterForm(forms.Form):
    password1 = PasswordField()
    password2 = PasswordConfirmationField(confirm_with=’password1’)

and inside the html for the form

<form role="form" action="my_url" method="post">
  {% csrf_token %}
  {{ form }}
</form>

{% block js %}
  {{ block.super }}
  {{ form.media }}
{% endblock %}

the important part is the {{ form.media }}, if using bootstrap4, the progress bar can work out of the box, because the JS for this app is using jQuery.

End

This package help our web app user create a password with some level of complexity that would be hard to crack by any standard. This and using Argon2 hash will make sure if ever our web app got compromise, at the very lease, our user information is not leaked due to fault in the password.