Django Templates: Registration & Login with HTML

Django, a high-level Python web framework, provides a powerful templating engine for rendering dynamic web pages. Among its many features, Django's user authentication system allows for seamless user registration and login functionality. In this guide, we'll delve into the process of creating registration and login pages using Django templates and HTML.

Before we dive into the specifics, ensure you have a basic understanding of Django's project structure and have Django installed. If not, you can install it using pip: `pip install Django`.

Setting Up User Authentication

To begin, we need to set up Django's user authentication system in our project. In your project's `settings.py` file, add 'django.contrib.auth' and 'django.contrib.contenttypes' to the `INSTALLED_APPS` list:

```python INSTALLED_APPS = [ # ... 'django.contrib.auth', 'django.contrib.contenttypes', ] ```

Creating a User Model

Django comes with a built-in User model, but you can create a custom one if needed. To do this, create a new file `models.py` in your app and define your custom User model by inheriting from `AbstractUser` or `AbstractBaseUser`:

```python from django.contrib.auth.models import AbstractUser class CustomUser(AbstractUser): # Add custom fields here pass ```

Configuring URLs for Authentication

In your app's `urls.py`, include the authentication URLs provided by Django's auth app:

```python from django.contrib.auth import views as auth_views urlpatterns = [ # ... path('login/', auth_views.LoginView.as_view(), name='login'), path('logout/', auth_views.LogoutView.as_view(), name='logout'), path('password_reset/', auth_views.PasswordResetView.as_view(), name='password_reset'), path('password_reset/done/', auth_views.PasswordResetDoneView.as_view(), name='password_reset_done'), path('reset///', auth_views.PasswordResetConfirmView.as_view(), name='password_reset_confirm'), path('reset/done/', auth_views.PasswordResetCompleteView.as_view(), name='password_reset_complete'), path('signup/', views.signup, name='signup'), ] ```

Creating Registration Form

a login screen with mountains and trees in the background at night, under a full moon

Django provides a built-in registration form that we can use. In your app's `forms.py`, create a `UserCreationForm`:

```python from django import forms from django.contrib.auth.forms import UserCreationForm from django.contrib.auth.models import User class SignUpForm(UserCreationForm): email = forms.EmailField(max_length=254, required=True) class Meta: model = User fields = ('username', 'email', 'password1', 'password2') ```

How To Make A Website With Login And Register | HTML CSS & Javascript

Html CSS Responsive Form Design With Full Code Free Template

two business cards with an image of a programming program on the front and back side

Animated Login and Registration Form in HTML CSS & Javascript

Animated Login Page Template Free Download (HTML CSS)

How to Implement Login, Logout, and Registration with Django’s User Model.

Login and Registration Form in HTML & CSS

a green and white web page with the words welcome on it's front cover

Creating Signup View

Create a `signup` view in your app's `views.py` to handle user registration:

```python from django.urls import reverse_lazy from django.views import generic from .forms import SignUpForm class SignUp(generic.CreateView): form_class = SignUpForm success_url = reverse_lazy('login') template_name = 'signup.html' ```

Creating Signup Template

Create a `signup.html` template in your app's `templates` directory to render the registration form:

```html {% extends "base.html" %} {% block content %}

Sign Up

{% endblock %} ```

Creating Login Template

Django provides a default login template, but you can create a custom one. Create a `login.html` template in your app's `templates` directory:

```html {% extends "base.html" %} {% block content %}

Log In

{% endblock %} ```

With these steps, you now have registration and login functionality using Django templates and HTML. You can further customize the templates and views to fit your project's needs. Happy coding!