In this Python Django Tutorial, we will learn to Create a Login system in Python Django. And we’ll also examples related to this. These are the following topics that we are going to discuss in this tutorial.
- Login System in Python Django
- How to create Django built-in login system
- How to create Django customize login system
Login System in Python Django
In this section, we’ll learn what does login system means in python Django.
A login system is a security feature that prevents unauthorized users from accessing resources on a website. There are three parts to the login system:
- Signup: Signing up is the process of creating a new account. If you want to use a portal or application for the first time, you must first sign up.
- Login: A login is a collection of credentials that is used to verify a user’s identity. It denotes that the user has been identified and authenticated in order to gain access to the website. The most common combination is a username and password.
- Logout: To log out of a website, you must first log in. When you log out, you’re telling the website that you’d like to discontinue your login session.
Read: Python Django set timezone
How to create django built-in login system
In this section, we’ll learn how to use Django’s built-in feature to develop a login page of the login system. I’ll guide you through it step by step using an example.
1. Create Project
If you’re starting a new project, firstly create a new Django project. The command to create a new project is as follow:
django-admin startproject project_nameExample: Here I create a new project name as LoginSystem.
Command:
django-admin startproject LoginSystem
2. Check Necessary Settings
Before creating a login system, make sure you have django.contrib.auth in your INSTALLED APPS and that your authentication middleware is configured properly in the MIDDLEWARE settings.
3. Make Migration
Migration is a means of applying changes that we have made to a model, into the database schema. To create all tables according to the schema defined in the migration file, we run the following command.
python manage.py migrate4. Define Project URLs
A web address is referred to as a URL. Every time you visit a website, you can see the URL in your browser’s address bar. Every web page must have its own unique URL. As a result, your application will know what to show a user that visits that URL.
Open your’s project’s urls.py file and specify the particular URLs.
from django.contrib import admin
from django.urls import path, include
from django.contrib.auth import views as auth_views
urlpatterns = [
path('admin/', admin.site.urls),
path('login/', auth_views.LoginView.as_view(), name='login'),
path('login/',include('home.urls')),
]
Import the django.contrib.auth.views module and add the URLconf for Login Page and Home Page to your urls.py file.
Read Python list append Django
5. Login Template
Basically, Django Templates are used to generate dynamic HTML web pages that are visible to the end-user. A template in Django is written in HTML, CSS, and Javascript in a .html file.
LoginView will attempt to render registration/login.html by default. Create a registration folder in your templates folder and a login.html page inside it.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LoginSystem</title>
</head>
<body>
<form method="post">
{% csrf_token %}
{{form.as_p}}
<input type="submit" value="Login"/>
</form>
</body>
</html>6. Template Configuration
To configure the template system, we must specify several items in the settings.py file. The name of our template directory is templates. Django Templates searches each of the INSTALLED APPS subdirectories by default for a templates subdirectory.
7. Redirect to Home Page
We need to redirect to the next page, which is the home page, after a successful login. So, let’s learn to create the app first
Command to create an app:
python manage.py startapp app_nameHere I create an app with the name Home.
Now, we to include the app in your project, add your app name to the INSTALLED APPS list in settings.py of the project.
INSTALLED_APPS = [
'home',
]Next, define the URL in the app’s urls.py file.
from django.urls import path, include
from home import views
urlpatterns = [
path('home/', views.home, name='home'),
]After this, define the view of the app.
from django.shortcuts import render, HttpResponse
# Create your views here.
def home(request):
return render(request, 'home.html')
Next, create a home.html file inside the template folder of the Home app.
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<title>PythonGuides!</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="#">PythonGuides</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
</ul>
<form class="d-flex">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</div>
</div>
</nav>
<div class="container my-3">
<h1 style="text-align:center;">Welcome to Python Guides</h1>
</div>
<div class="card">
<div class="card-body">
<h3 style="text-align:center;">Thanks for landing on this page to know more about PythonGuides.com.</h3>
<br>
<h6>I welcome you to the website and hopefully, you got to learn something in Python. I started this website to share my finding and learnings in Python with you.</h6>
<h6>To keep things simple, I am trying to write a lot of articles on Python. Feel free to give your valuable comments and also share the articles if you are liking and hoping it will be helpful to someone.</h6>
<br>
<h2 style="text-align:center;">Also, Subscribe to Our YouTube Channel for FREE Python Video Tutorials.</h2>
</div>
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
-->
</body>
</html>
We now require a redirect to the next page. The following code can be added to settings.py to set the next page:
LOGIN_REDIRECT_URL = next_pageIn my example, I want to redirect to the home page after successful login.
LOGIN_REDIRECT_URL = 'home/'
If no login redirect URL is specified, the default URL of /accounts/profile/ will be used, resulting in a TemplateDoesNotExist problem.
8. Create Super User
Till now, we have not created any users for this. So, we are going to create a user. So see, how we can do that.
To create a superuser run the following command:
python manage.py createsuperuser- Then enter the username of your choice, if you want. Otherwise, it takes the default system name.
- Then enter the email address and press enter. You can leave it blank also.
- Then, in front of the Password field, type the password and hit enter. To keep it safe, enter a strong password.
- Then again enter the same Password for confirmation.
9. Run Server
In this section, we’ll learn how to run the server in Django. To start the server, use the following command in the terminal.
python manage.py runserverThe output is as below:
Now, enter the username and password and click on the login button. After successful login, you will redirect to the home page.
Read: Python Django format date
How to create Django customize login system
In this section, we’ll learn to create a signup page, login page, and logout page without using Django’s in-built feature. I’ll guide you through it step by step using an example.
1. Basic Steps
Before we can create signup, login, or logout page, we must first go through the following procedures.
Create Project: First and foremost, we must create a Django project. The command to create a Django project is:
django-admin startproject project_nameSo, I build a project called CustomLogin.
Create App: After we’ve created the Django project, we’ll need to create a Django app. The command to create a Django app is:
python manage.py startapp app_nameSo, I build an app called accounts.
Install App: After we’ve created the Django app, we’ll need to install a Django app. To do so, go to your project directory and open the settings.py file. Now, in INSTALLED_APPS, type the name of your application.
Templates: You’ll need a template folder to store your HTML files. So, under your app directory, make a templates folder. Go to the settings.py file and define the DIRS path in templates.
2. Define URLs File
According to Django, all resources should be mapped using urls.py files.
Project URLs File: By default, Django includes a urls.py file in the project. This file has a pre-defined path to the admin app. And we define the path of the newly created urls.py file under the app.
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
path('admin/', admin.site.urls),
path('accounts/', include('accounts.urls'))
]App URLs File: Firstly, we have to create a file with the name urls.py in the app directory. Now, we define the path of the different views created under the views.py file of the app.
from django.urls import path
from . import views
urlpatterns = [
path("register", views.register, name="register"),
path("login_user", views.login_user, name="login_user"),
path("logout_user", views.logout_user, name="logout_user"),
path("home", views.home, name="home")
]
3. SIGNUP
Now, we’ll learn to create register views. For this, we have to create a function register in the views.py file of the app directory.
from django.contrib import messages
from django.shortcuts import render, redirect
def register(request):
if request.method == 'POST':
first_name = request.POST['first_name']
last_name = request.POST['last_name']
username = request.POST['username']
email = request.POST['email']
password = request.POST['password']
confirm_password = request.POST['confirm_password']
if password==confirm_password:
if User.objects.filter(username=username).exists():
messages.info(request, 'Username is already taken')
return redirect(register)
elif User.objects.filter(email=email).exists():
messages.info(request, 'Email is already taken')
return redirect(register)
else:
user = User.objects.create_user(username=username, password=password,
email=email, first_name=first_name, last_name=last_name)
user.save()
return redirect('login_user')
else:
messages.info(request, 'Both passwords are not matching')
return redirect(register)
else:
return render(request, 'registeration.html')
- We begin by defining the register function, which makes use of the request object. Django makes an HttpRequest when a page is requested. In this case, we’ll utilize the HTTP method Post to submit data to a server in order to create or update a resource.
- To the server, we send first_name, last_name, username, email, password, and confirm_password.
- Then we use various object filters to check if the password is the same as the confirm password if the email address already exists, and print the message accordingly, as well as redirect the page based on the filter response.
Now, we’ll see the registration.html:
The resgistration.html file specifies the appearance of the signup web page.
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<title>SIGNUP</title>
</head>
<body>
<form action="/accounts/register" method="POST" class="form-horizontal">
{% csrf_token%}
<div class="mx-auto" style="width: 400px;">
<div class="col-xs-8 col-xs-offset-4">
<h2 style="text-align:center;">SIGN UP</h2>
</div>
<hr />
<div class="form-group">
<label for="username">Username</label>
<input type="text" class="form-control" name="username" id="username" placeholder="Enter Username"
Required>
</div>
<div class="form-group">
<label for="fanme">First Name</label>
<input type="text" class="form-control" name="first_name" id="first_name" placeholder="Enter First Name"
Required>
</div>
<div class="form-group">
<label for="lname">Last Name</label>
<input type="text" class="form-control" name="last_name" id="last_name" placeholder="Enter Last Name"
Required>
</div>
<div class="form-group">
<label for="email">Email address</label>
<input type="email" class="form-control" name="email" id="email" placeholder="Enter email" Required>
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" name="password" id="password" placeholder="Enter Password"
Required>
</div>
<div class="form-group">
<label for="confirm_password">Confirm Password</label>
<input type="password" class="form-control" name="confirm_password" id="confirm_password"
placeholder="Confirm Your Password" Required>
</div>
<button type="submit" class="btn btn-primary">SIGNUP</button>
<a class="btn btn-dark" href="login_user" role="button">LOGIN</a>
</div>
</form>
<div class="form-group">
{% for message in messages %}
<div class="alert alert-danger" role="alert">
{{message}}
</div>
{% endfor %}
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
crossorigin="anonymous"></script>
</body>
</html>- Within the form, we use the Django template tag {%csrf_token%}. By using this tag, we can avoid CSRF attacks and assure the security of post requests from a user to the server.
- We also, use the Django template tag {%for%} to display the message notification.
Now, run the server and view the signup web page.
5. LOGIN
Now, we’ll learn to create login_user views. For this, we have to create a function login_user in the views.py file of the app directory.
from django.contrib import messages
from django.shortcuts import render, redirect
from django.contrib.auth.models import User, auth
def login_user(request):
if request.method == 'POST':
username = request.POST['username']
password = request.POST['password']
user = auth.authenticate(username=username, password=password)
if user is not None:
auth.login(request, user)
return redirect('home')
else:
messages.info(request, 'Invalid Username or Password')
return redirect('login_user')
else:
return render(request, 'login.html')
- To begin, we’ll create the login_user function, which uses the POST request object.
- The username and password are then sent to the server.
- The authenticate function is then used to verify the username and password.
- If the user is authenticated, go to the home page; if not, go to the login page and print the message Invalid Username or Password.
Now, we’ll see the login.html:
The login.html file specifies the appearance of the login web page.
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<title>LOGIN</title>
</head>
<body>
<div class="mx-auto" style="width: 500px" ;>
<form action="login_user" method="post" class="form-horizontal">
{% csrf_token%}
<div class="col-xs-8 col-xs-offset-4">
<h2 style="text-align:center;">LOGIN</h2>
</div>
<div class="form-group">
<label for="username">Username</label>
<input type="text" class="form-control" name="username" id="username" placeholder="Enter Username">
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" class="form-control" name="password" id="password" placeholder="Enter Password">
</div>
<button type="submit" class="btn btn-primary">LOGIN</button>
<br />
<div class="form-group">
{% for message in messages %}
<div class="alert alert-danger" role="alert">
{{message}}
</div>
{% endfor %}
</div>
</form>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
crossorigin="anonymous"></script>
</body>
</html>- To display the message notification, we use the Django template tag {%for%}.
We redirect you to the login page after successful signup, or you can move to the login page directly if you are already a user.
5. HOME
Now, we’ll learn to create home views. For this, we have to create a function home in the views.py file of the app directory.
from django.contrib import messages
from django.shortcuts import render, redirect
def home(request):
return render(request, 'home.html')- To begin, we’ll create the home function, with request object.
- The home function redirect to home.html.
Now, we’ll see the home.html:
The home.html file specifies the appearance of the home web page.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<title>Login System</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
crossorigin="anonymous"></script>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="home">Login System</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="home">HOME<span class="sr-only">(current)</span></a>
</li>
{% if user.is_authenticated %}
<li class="nav-item">
<a class="nav-link" href="#">Hi, {{user.first_name}}</a>
</li>
<li class="nav-item">
<a class="nav-link" href="logout_user">LOGOUT</a>
</li>
{% else %}
<li class="nav-item">
<a class="nav-link" href="register">SIGN UP</a>
</li>
<li class="nav-item">
<a class="nav-link" href="login_user">LOGIN</a>
</li>
{% endif %}
</ul>
</div>
</nav>
<div class="container my-3">
<h1 style="text-align:center;">Welcome to Python Guides</h1>
</div>
<div class="card">
<div class="card-body">
<h3 style="text-align:center;">Thanks for landing on this page to know more about PythonGuides.com.</h3>
<br>
<h6>I welcome you to the website and hopefully, you got to learn something in Python. I started this website to
share my finding and learnings in Python with you.</h6>
<h6>To keep things simple, I am trying to write a lot of articles on Python. Feel free to give your valuable
comments and also share the articles if you are liking and hoping it will be helpful to someone.</h6>
<br>
<h2 style="text-align:center;">Also, Subscribe to Our YouTube Channel for FREE Python Video Tutorials.</h2>
</div>
</body>
</html>- Here we, use {%if%} template tag with is_authenticated attribute, to verify whether the user is authorised or not.
- We print the user’s first name on the nav bar if the user is authenticated. We use the tag {{user.first_name}} for this.
- On the navbar, we also add a logout button.
Let’s have a look at home page, when user successfully login.
6. LOGOUT
Now, we’ll learn to create logout_user views. For this, we have to create a function logout_user in the views.py file of the app directory.
from django.contrib import messages
from django.shortcuts import render, redirect
from django.contrib.auth.models import User, auth
def logout_user(request):
auth.logout(request)
return redirect('home')- To begin, we’ll create the logout_user function, with request object.
- To log out the user we use the logout() function of django.contrib.auth.
- The logout_user function redirect to home.
When we click on the logout button, the logout()function is called. And, it completely cleaned out the session data for the current request.
Let’s see how the home page looks when we click on the logout button.
You may also like to read the following Django tutorials.
- Python Change Django Version
- Python filter not in Django
- Python Django vs Pyramid
- Python Django length filter
- Get URL parameters in Django
In this Python Django Tutorial, we discussed the Login System in Python Django. Also, we discuss the following list of topics.
- Login System in Python Django
- How to create Django built-in login system
- How to create Django customize login system
Entrepreneur, Founder, Author, Blogger, Trainer, and more. Check out my profile.