How to Create a Signup Page for a Website with Python in Django

In this article, we show how to create a signup page for a website with Python in Django.

So a signup page is a page where visitors can go to sign up and get an account for the website.

Almost every huge popular website has this, including google, gmail, youtube, amazon, linkedin, facebook, etc.

So if you're looking to follow these sites and go in their footsteps, you have to know how to create a signup page for your website.

In this article, we're going to go pretty in detail and create a signup page just like google. We ask for the user's first name, last name, the user name, password, password again for confirmation, birth date, mobile phone number, email address, and location.

This is a standard signup page.

You don't just ask for the username and password. You also want to have some pertinent information about the individual, including first name, last name, birth date, phone number, email address, and location.

We will also do validation of this information.

For example, we will only allow a username that is at least 3 characters long and no longer than 25 characters. So the username must be between 3 and 25 characters long. The username can only be composed of alphabetical characters and numbers.

We will also be validation with the password. The password must be at least 8 characters in length and must contain at least one number.

The first name and the last name must be greater than 1 character each. So they must be at least 2 characters in length.

And we'll also do validation for the phone number. The phone number must have the correct number of digits in it.

So let's get started.

So assuming you've already created a django project, let's create an app called users.

And we create an app called siteusers with the following line shown below.

py manage.py startapp siteusers

So now this has created an app called siteusers.

As with all apps, you must add this to the INSTALLED_APPS list in the settings.py file.

And since we are creating a templates directory in this app, you want to add this to the TEMPLATES list in the settings.py file.

Okay, so once we have done this, we now will create the template file, which we will call, signup.html

Inside of this page, we will put a h1 header of Signup Page and then we'll include all the text boxes we are looking for from the user, which includes the first name, last name, birth date, phone number, email address, and location.

So this is the following below is the contents of the signup.html page.

<html> <body> <h1>Signup Page </h1> <form action="" method="POST"> {% csrf_token %} {% if error %} {{ error }} {% endif %} {{ form.as_p }} <input type="submit" name="submit" value="Sign up"/> </form> </html> </body>

So in this page, we have our form.

It's a very simple page.

models.py File

So the next thing we need to do is create our models.py file.

Since we want to store the user information in a database, we have to create a database that stores the information that a user enters.

This is what we do now.

The contents of the models.py file is shown below.

from django.db import models from .validators import(validate_firstname_length, validate_lastname_length, validate_username_length, validate_username_alphadigits, validate_password_length, validate_password_digit, validate_password_uppercase, validate_phonenumber) class Siteuser(models.Model): firstname= models.CharField(max_length=100, verbose_name='First name', validators= [validate_firstname_length]) lastname= models.CharField(max_length=100, verbose_name='Last name', validators= [validate_lastname_length]) username= models.CharField(max_length=25, verbose_name= 'User name', validators= [validate_username_length, validate_username_alphadigits]) password1= models.CharField(max_length=30, validators=[validate_password_length, validate_password_digit, validate_password_uppercase]) password2= models.CharField(max_length=30) birth_date= models.DateField(verbose_name='What is your birth date?') gender= models.CharField(max_length=6) email= models.EmailField() phone= models.CharField(max_length= 15, validators= [validate_phonenumber]) location= models.CharField(max_length=100)

So in this models.py file, we import a number of validators, which we create in the validators.py file in order to validate certain fields of the form, such as the first name, last name, username, password, and phone number.

forms.py File

Next, we will go to our forms.py file, which contains our form.

Since we are storing the data that the user enters into a database, it's best in Django to create a ModelForm. A modelForm in Django is a form that is created from fields of a model (database) in the models.py file.

This is shown below.

from django import forms from .models import Siteuser GENDER_CHOICES= [ ('First choice', 'I am...'), ('Male', 'Male'), ('Female', 'Female'), ] COUNTRY_CHOICES= [ ('France', 'France'), ('Germany', 'Germany'), ('Italy', 'Italy'), ('United States', 'United States'), ] YEARS= [x for x in range(1920,2017)] class Signupform(forms.ModelForm): password1 = forms.CharField(label='Password', widget=forms.PasswordInput) password2 = forms.CharField(label='Confirm Password', widget=forms.PasswordInput) birth_date= forms.DateField(widget=forms.SelectDateWidget(years=YEARS)) gender= forms.CharField(widget=forms.Select(choices=GENDER_CHOICES)) location= forms.CharField(widget=forms.Select(choices=COUNTRY_CHOICES)) class Meta: model= Siteuser fields= ["firstname", "lastname", "username", "password1", "password2", "birth_date", "gender", "email", "phone", "location"]

So this ModelForm contains a lot.

We'll break it down now.

First, we must import the model that we are creating this ModelForm from, which is the SiteUser model.

Because the gender field, the country field, and the birth_date field are drop-down lists, we create tuples, GENDER_CHOICES, COUNTRY_CHOICES, and YEARS. These tuples contain key:value pairs. The value is what appears to the user.

We create the form, Signupform, which is a ModelForm.

In order to make the password1 and password2 fields password fields, which means the characters that a user types are not shown, we must add, widget=forms.PasswordInput, to the field.

The first password is the initial password the user enters and the second password is the confirmation password (to make sure they match).

In order to get the date field that we want, with the years from 1920 to 2017, we must add, widget=forms.SelectDateWidget(years=YEARS), to the field.

In order to get a list of countries for the location field, we must add, widget=forms.Select(choices=COUNTRY_CHOICES), to the field. This gives us the list of countries specified in the COUNTRY_CHOICES tuple.

Now in order to finish creating the ModelForm, we need to have class Meta:

Underneath the class Meta: we need have have model= Siteuser

And then underneath this, we need to have the fields we want in the form. We include all fields from the original Siteuser model.

This concludes the form.

validators.py File

Next we create our validators.py file, which allows us to validate certain conditions of the data that the user enters in.

We validate many things.

We make sure that the length of the first name and the last name is at least 2 characters in length.

We make sure that the length of the username is between 3 and 25 characters in length and that the characters are only alphanumeric characters.

We make sure that the length of the password is between 8 and 30 characters in length and that it contains at least one digit and one uppercase character.

Lastly, we check to make sure that the phone number contains the format (###)###-####, ###-###-####, ##########, or ###########.

from django.core.exceptions import ValidationError import re def validate_firstname_length(value): length= len(value) if length < 2: raise ValidationError("The length of the first name must be at least 2 characters in length") else: return value def validate_lastname_length(value): length= len(value) if length < 2: raise ValidationError("The length of the last name must be at least 2 characters in length") else: return value def validate_username_length(value): length= len(value) if length < 3 or length > 25: raise ValidationError("The length of the username must be between 3 and 25 characters") else: return value def validate_username_alphadigits(value): validmatch= re.match('^[\w]+$', value) if not validmatch: raise ValidationError("The username can only contain alphabetical characters and numbers") else: return value def validate_password_length(value): length= len(value) if length < 8 or length > 30: raise ValidationError("The password must be at least 8 characters in length and no greater than 30 characters") else: return value def validate_password_digit(value): if not re.search(r"[\d]+", value): raise ValidationError("The password must contain at least one digit") else: return value def validate_password_uppercase(value): if not re.search(r"[A-Z]+", value): raise ValidationError("The password must contain at least one uppercase character") else: return value def validate_phonenumber(value): regex= r"$\w{3}$\w{3}-\w{4}" regex2= r"\w{3}-\w{3}-\w{4}" regex3= r"\b\w{10,11}\b" if not re.search(regex, value) and not re.search(regex2, value) and not re.search(regex3, value): raise ValidationError("The phone number must be in format (###)###-###, ###-###-###, ##########, or ########### ") else: return value

This concludes the validation needed for our signup form.

views.py File

Lastly, we need our views.py file.

The contents of the views.py file is shown below.

from django.shortcuts import render from .forms import Signupform from django.contrib.auth.models import User from django.contrib.auth import authenticate, login def signup(request): firstname='' lastname='' emailvalue='' uservalue='' passwordvalue1='' passwordvalue2='' form= Signupform(request.POST or None) if form.is_valid(): fs= form.save(commit=False) firstname= form.cleaned_data.get("first_name") lastname= form.cleaned_data.get("last_name") emailvalue= form.cleaned_data.get("email") uservalue= form.cleaned_data.get("username") passwordvalue1= form.cleaned_data.get("password1") passwordvalue2= form.cleaned_data.get("password2") if passwordvalue1 == passwordvalue2: try: user= User.objects.get(username=uservalue) #if able to get, user exists and must try another username context= {'form': form, 'error':'The username you entered has already been taken. Please try another username.'} return render(request, 'siteusers/signup.html', context) except User.DoesNotExist: user= User.objects.create_user(uservalue, password= passwordvalue1, email=emailvalue) user.save() login(request,user) fs.user= request.user fs.save() context= {'form': form} return render(request, 'siteusers/signup.html', context) else: context= {'form': form, 'error':'The passwords that you provided don\'t match'} return render(request, 'siteusers/signup.html', context) else: context= {'form': form} return render(request, 'siteusers/signup.html', context)

We have to import a number of things, including render to render a template page, the Signupform form from the forms.py file, and User from django.contrib.auth.models to create users.

We then create our function-based view, signup.

We then get all the data that the user has entered in from the form and save both the user and form. Remember the user gets saved to Django's User model and the form gets saved to the model that we created, Siteusers.

Learning about Electronics

How to Create a Signup Page for a Website with Python in Django

models.py File

forms.py File

validators.py File

views.py File