Django Student Portal
Student Signup Form in Django
Step 1: Install Django
Ensure you have Python installed, then install Django using:
pip install django
Step 2: Create a Django Project
Create a new Django project named student_portal:
django-admin startproject student_portal
cd student_portal
Folder Structure (Initial)
student_portal/
│── manage.py
│── student_portal/
│ ├── settings.py
│ ├── urls.py
│ ├── asgi.py
│ ├── wsgi.py
Step 3: Create a Django App
Create an app named students:
python manage.py startapp students
Updated Folder Structure
student_portal/
│── students/
│ ├── models.py
│ ├── views.py
│ ├── forms.py
│ ├── urls.py
│ ├── templates/
│ │ ├── students/
│ │ │ ├── signup.html
│ ├── static/
│ │ ├── css/
│ │ │ ├── styles.css
Step 4: Register the App
Modify student_portal/settings.py:
INSTALLED_APPS = [
'students',
]
Step 5: Create the Student Model
Modify students/models.py:
from django.db import models
class Student(models.Model):
first_name = models.CharField(max_length=50)
last_name = models.CharField(max_length=50)
email = models.EmailField(unique=True)
phone = models.CharField(max_length=15)
password = models.CharField(max_length=100)
Run migrations:
python manage.py makemigrations
python manage.py migrate
Step 6: Create the Signup Form
Modify students/forms.py:
from django import forms
from .models import Student
class StudentSignupForm(forms.ModelForm):
password = forms.CharField(widget=forms.PasswordInput(attrs={'class': 'form-control', 'placeholder': 'Enter password'}))
class Meta:
model = Student
fields = ['first_name', 'last_name', 'email', 'phone', 'password']
widgets = {
'first_name': forms.TextInput(attrs={'class': 'form-control', 'placeholder': 'Enter first name'}),
'last_name': forms.TextInput(attrs={'class': 'form-control', 'placeholder': 'Enter last name'}),
'email': forms.EmailInput(attrs={'class': 'form-control', 'placeholder': 'Enter email'}),
'phone': forms.TextInput(attrs={'class': 'form-control', 'placeholder': 'Enter phone number'}),
}
Step 7: Create the Signup View
Modify students/views.py:
from django.shortcuts import render, redirect
from .forms import StudentSignupForm
def student_signup(request):
if request.method == "POST":
form = StudentSignupForm(request.POST)
if form.is_valid():
form.save()
return redirect('signup_success')
else:
form = StudentSignupForm()
return render(request, 'students/signup.html', {'form': form})
def signup_success(request):
return render(request, 'students/signup_success.html')
Step 8: Configure URLs
Modify students/urls.py:
from django.urls import path
from .views import student_signup, signup_success
urlpatterns = [
path('signup/', student_signup, name='student_signup'),
path('signup-success/', signup_success, name='signup_success'),
]
Modify student_portal/urls.py:
from django.urls import path, include
urlpatterns = [
path('students/', include('students.urls')),
]
Step 9: Create the Signup Template
Modify students/templates/students/signup.html:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Student Signup</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/css/styles.css">
</head>
<body>
<div class="container d-flex justify-content-center align-items-center min-vh-100">
<div class="card shadow-lg p-4 rounded-4">
<h2 class="text-center mb-4">🎓 Student Signup</h2>
<form method="post">
{% csrf_token %}
<div class="mb-3">
<label class="form-label">First Name</label>
{{ form.first_name }}
</div>
<div class="mb-3">
<label class="form-label">Last Name</label>
{{ form.last_name }}
</div>
<div class="mb-3">
<label class="form-label">Email</label>
{{ form.email }}
</div>
<div class="mb-3">
<label class="form-label">Phone</label>
{{ form.phone }}
</div>
<div class="mb-3">
<label class="form-label">Password</label>
{{ form.password }}
</div>
<button type="submit" class="btn btn-primary w-100">Sign Up</button>
</form>
</div>
</div>
</body>
</html>
Step 10: Improve Styling
Modify students/static/css/styles.css:
body {
background: linear-gradient(to right, #6a11cb, #2575fc);
}
.card {
max-width: 400px;
background: white;
border-radius: 12px;
}
.btn-primary {
background: linear-gradient(90deg, #6a11cb, #2575fc);
border: none;
}
Step 11: Run the Server
Run the Django server:
python manage.py runserver
Visit http://127.0.0.1:8000/students/signup/ to see the signup form.
Git Repo- https://github.com/brahmaputraS/student_portal.git