29 – DJANGO LOGIN & LOGOUT – REGISTRATION REDUX – INVOICE MANAGEMENT SYSTEM

Running an application will almost always require users to authenticate before interacting with the data. In this Invoice Management System, we want to configure django the require users to login before having access to any of the menus or data.

The following are the steps we will follow to configure/set up user registrations and log in. We will be using a module called Django Registration Redux.

1. First, install django-registration-redux with the following command

pip install django-registration-redux

2. Django registration redux (registration) should be added to INSTALLED_APPS to let Django know that models in the module should be monitored for migration into the Database.

INSTALLED_APPS = [
    ....
    'registration', #should be immediately above 'django.contrib.auth'
    ....
    ]

3. Django registration redux comes by default with models that need to be migrated to the Database. Now migrate for registration tables to be created in the Database

./manage.py migrate

4. Add the following lines to your settings.py file

ACCOUNT_ACTIVATION_DAYS = 7 # One-week activation window
REGISTRATION_AUTO_LOGIN = True # Automatically log the user in.
SITE_ID = 1
LOGIN_REDIRECT_URL = '/'

5. Add a url to include urls from registration app you just installed

from django.urls import include
path('accounts/', include('registration.backends.default.urls')),

6. In your template folder, make a copy of the home page and name it base.html, paste in the following codes where you want the login field to appear.

{% block title %}
{% endblock %}

{% block content %}
{% endblock %}

7. log in to the app through this URL: localhost:8000/accounts/login
logout URL is: localhost:8000/accounts/logout

8. Add a login / logout button on the navbar

{% if request.user.is_authenticated %}
 <a href="/accounts/logout"><button class="btn btn-danger">{{ user }} | Logout</button></a>
{% else %}
 <a href="/accounts/login"><button class="btn btn-danger">Login</button></a>
{% endif %}

9. To force users to be authenticated first. Import login required decorator and place them above all views that needs login before accessing

from django.contrib.auth.decorators import login_required
@login_required

10. Hide navbar links from unauthenticated users

  {% if request.user.is_authenticated %}
  <a href="/list_invoice"><div class="btn btn-primary mybutton">List Invoices</div></a>
  <br><br>
  <a href="/add_invoice"><div class="btn btn-primary mybutton">New Invoice</div></a>
  <br><br>
    <a href="/accounts/logout"><button class="btn btn-danger">{{ user }} | Logout</button></a>
    {% else %}
    <a href="/accounts/login"><button class="btn btn-danger">Login</button></a>
  {% endif %}

11. Style login page

<div class="jumbotron">
  <div class="row">
	<div class="col-sm-4"></div>
	<div class="col-sm-4">
	  {% block title %}
	  {% endblock %}
	  {% block content %}
	  {% endblock %}
	</div>
	<div class="col-sm-4"></div>
  </div>
</div>

12. Style login form with crispy

{% load crispy_forms_tags %}

    {{ form|crispy }}
    <input class="btn btn-primary" type="submit" value="{% trans 'Log in' %}" />