Friday, September 18, 2020
Home > django > Make Password generator with django | Django 3.0

Make Password generator with django | Django 3.0

password creator

Most of the website when you sign up, they create a random password for you. Every time you click on generate password they make new password . They make password generator for this thing. ever wondered ? how did they do this type of thing? If not worry not, i am going teach you about how to make password generator with django 3.0

In this article i am going to use django 3.0. If you are using older version like django 2, don’t worry it will work fine. There wont be an issue.

In generated password, you would see that, password has small letter, capital letter, numbers and special character. Password comes in random. There is a module called random in python, we are going to use it to make password generator.

Here we go…


Making Password Generator With Django 3.0

First things first,  create a project called password_generator.


django-admin startproject password_generator

After creating project, lets create an app name generator


python manage.py startapp generator

Go to settings.py and install your application, put the name in INSTALLED_APPS.


INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'generator', # add this 
]

Now, go to urls.py of your project.  password_generator/urls.py



from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('generator.urls')), # add this 
]

Now go to urls.py file of your app.  generator/urls.py  

Add this.


from django.urls import path
from . import views
urlpatterns = [
    path('', views.home, name='home'),
    path('password/', views.password, name='password')
]

Making Form for Password Generator

For making a password generator you must make a form. Now think for a moment what type of form do you want to make a password generator? just think.

What do you need?  First thing you need is length, how many lengths your password would be? After thinking about length you must be thinking how can i implement uppercase letters, numbers and special character in form?

For this kind of form you need check box and select form.

Create a folder inside your app generator named templates. Now, inside template folder, create another folder named generator.

Inside generator create 2 files named  home.html and password.html.  You can name it, whatever you like. In home.html form will be there and in password.html your password will be generated.


home.html 

<!DOCTYPE html>
<html lang=”en”>
<head>
<metacharset=”UTF-8″>
<metaname=”viewport”content=”width=device-width, initial-scale=1.0″>
<linkrel=”stylesheet”href=”https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css”integrity=”sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk”crossorigin=”anonymous”>
<style>
input{
font-size: 20px;
}
input[type=submit] {
background-color: #dd062a;
color: white;
padding: 12px20px;
border: none;
border-radius: 4px;
cursor: pointer;
margin-bottom:10px;
}
input[type=submit]:hover {
background-color: #4569a0;
}
</style>
<title>Password Generator</title>
</head>
<body>
<div class=”container text-center”>
<h1>
Password Generator
</h1>
<br>
<br>
<form action = “{% url  ‘password’ %}”>
<label for=”length”>Length:</label>
<select name=”length “id =”length”>
<option value=”6″>6</option>
<option value=”7″>7</option>
<option value=”8″>8</option>
<option value=”9″>9</option>
<option value=”10″>10 </option>
<option value=”11″>11 </option>
<option value=”12″>12 </option>
<option value=”13″>13 </option>
<option value=”14″>14 </option>
</select>
<br>
<input type=”checkbox”name=”uppercase”> Uppercase
<br>
<input type=”checkbox”name=”numbers”>Numbers
<br>
<input type=”checkbox”name=”special”>Special
<br>
<input type=”submit” class=”button” value=”Generate Password”>
</form>
</div>
</body>
</html>

In form, action you must be thinking what is written in action. In action, you put a url of the page, you want to go after submit button is clicked.

After submit button is clicked i want to go to password page. so if you check urls.py of your app, you will see, name of the path is password. That’s why action is {% url ‘password’ %}

In this form, method is not written, because we don’t want to post that form to our database. that’s why we don’t need to write method there.

Image of the form.

 

password generator form


Logic of Password Generator

add these codes.


from django.shortcuts import render
import random

# Create your views here.
def home(request):
    return render(request, 'generator/home.html')


def password(request):

    characters = list('abcdefghijklmnopqrstuvwxyz')
    if request.GET.get('uppercase'):
        characters.extend(list('ABCDEFGHIJKLMNOPQRSTUVWXYZ'))

    if request.GET.get('numbers'):
        characters.extend(list('0123456789'))
    if request.GET.get('special'):
        characters.extend(list('!@#$%^&*()'))
    length = int(request.GET.get('length'))
    password = ''
    for x in range(length):
        password += random.choice(characters)
    return render(request, 'generator/password.html', {'password':password})

 

Explaining Password function :

characters :  i have created a list of all lowercase letters there using list function of python.

request.GET.get : I am not submitting this form to database, i just want to fetch only form data and display in template. It’s django method .  In request.GET.get(‘numbers’), the numbers is the name of that field in our form, so all the names in bracket are the names of that field of the form.

extend : this function extends the list of character.

after collecting all the form data using request.GET.get, i have created a empty string, to store the generated password. Than i used for loop to loop through all the character and i used random.choice() to randomly choose a letter, numbers and all the special characters.

This will generate random password.

Now the final part. password.html


<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport”content=”width=device-width, initial-scale=1.0″>
<link rel=”stylesheet”href=”https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css”integrity=”sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk”crossorigin=”anonymous”>
<title>Generated Password</title>
</head>
<body>
<div class=”container text-center”>
<br>
<br>
<h1>
Your Generated Password is:
</h1>
<br>
<br>
<h2 class=”alert alert-success “>{{ password }} </h2>
</div>
</body>
</html>
Generated Password Page : 
password generated generated password

Leave a Reply

Your email address will not be published. Required fields are marked *