Friday, September 18, 2020
Home > django > Django User Registration Form | Django SignUp Form

Django User Registration Form | Django SignUp Form

Django user registration form

One of the most fundamental of web development is user registration form. Every website must have sign up, sign in form. This is the basic thing. In this article i am going to cover about django user registration form.

You must have created django super user using command line, and super user can go to admin dashboard.  but this is different. Not everyone can access admin dashboard and we can’t create 100 or more than 100 user using command line.

This is where sign up form is helpful. People can create an account using this sign up page.

Django User Registration Form :

Assumptions : 

You know

1.  how to create django project.

2. Create super user.

3. Basics of django.

4. creating an app in django.

1.) Create New Application:

First thing you can do is create a new application, inside your project. Create a new app accounts.

Command is : python manage.py startapp accounts

After creating accounts app, we must register this accounts app in INSTALLED_APPS in settings file.

just write ‘accounts’ inside INSTALLED_APPS.

settings.py file


INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'admission',
    'password_generator',
    'demo',
    'crispy_forms',
    'accounts',   
    
]

2. Create a Sign Up page :

First step after creating accounts app and adding accounts app in settings file. First thing we need to do is create a forms.py file inside accounts app.

whenever you are trying to create sign up page, you must have some properties, like Username, First Name, Last Name, Email, Password and confirm password.

Django gives all these things we just need to call them. We don’t have to do any extra work, unless we want to.

Add the following code in forms.py file.


# forms.py 
from django import forms
from django.contrib.auth.forms import UserCreationForm
from django.contrib.auth.models import User

class RegisterForm(UserCreationForm):
    email = forms.EmailField()

    class Meta:
        model = User
        fields = ["username", "first_name", "last_name", "email", "password1", "password2"]

We have modified the django default sign up page and we have added email field in that. If you want to add more things you can always add it.  you just need to write inside ‘fields’ and define them as class variable . you can put anywhere inside fields, it depends upon you, where you want to show.

I am not going to explain each and every detail like what is UserCreationForm, where did it come from. You have to search in google about these things, this good practice.


Now we need to add a function inside our views.py file. Open views.py and add the following code.

 


from django.shortcuts import render, redirect
from .forms import RegisterForm

def register(request):
    if request.method == "POST":
        form = RegisterForm(request.POST)
        if form.is_valid():
            form.save()

        return redirect("/accounts/")

    else:
        form = RegisterForm()

    return render(request, "accounts/register.html", {"form": form}) 

Before going to templates, you must configure, urls.py of your project and your app.

Go to your project’s urls.py and add the code, that redirects to app url.

Main urls.py .


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

urlpatterns = [
    path('admin/', admin.site.urls),
    path('password/', include('password_generator.urls')),
    path('accounts/', include('accounts.urls')), # add this line of code in your file
    
]

Now go to your accounts app and create a file named urls.py and add the following lines.

accounts/urls.py


from django.urls import path, include
from . import views


urlpatterns = [
    path("", views.register, name="register")
]

Now you can go to template thing. You must know how templates are rendered in django. You first create a folder name templates inside your accounts app. After that you create another folder inside templates folder named accounts. Than create register.html .

Structure looks like this :

accounts/templates/accounts/register.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.3.1/css/bootstrap.min.css”integrity=”sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T”crossorigin=”anonymous”>
<title>Register Form</title>
</head>
<body>
<divclass=”container”>
<h1>User Registration form </h1>
<formmethod=”POST”class=”form-group”>
{% csrf_token %}
{{ form }}
<buttontype=”submit”class=”btn btn-success”> Register </button>
</form>
</div>
</body>
</html>

Signup page looks like this, without styling, just bootstrap for sign up button.

go to the address : http://127.0.0.1:8000/accounts/

sign up page without styling


Our Sign up page is done. fill the form and click on Register .  Congrats you successfully created Django Registration Form.

Now to style this django user registration from, we need to install crispy forms.

Install Crispy Forms : 

pip install django-crispy-forms

after installing crispy forms, to settings —> INSTALLED_APPS  and than write ‘crispy_forms’ .


INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'password_generator',
    'crispy_forms', # add this to your file. 
    'accounts', 
    
]

After that add this following text in your settings file, after static url.


CRISPY_TEMPLATE_PACK = "bootstrap4"

Now the final part.

in register.html you wrote {{ form }} . we need to change that to {{ form|crispy }} , and you have to write

{% load crispy_forms_tags %}  on the top of the page.

{% load crispy_forms_tags %}
<!doctype HTML>

And

Inside <form> .


{% csrf_token %}
{{ form|crispy }}

 

Final Product looks like this.

 

django signup form
With Crispy forms

You can always change the design of your sign up form. Next tutorial will be Log in page and log out page.

Conclusion: Django User Registration Form

This is the basic of django user registration form. There is always a more. Next tutorial will be log in form and log out page. If you find any error please feel free to correct. That will be an honour. Thank you for reading this.

 

Also Read : Best Python IDE | You must use. 

Also Read : Python anywhere | Host Python application

 

Leave a Reply

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