Deploy an ASGI Django Application

ASGI, which stands for Asynchronous Server Gateway Interface, is a big deal in Django. It basically helps Django handle lots of things at once, like requests from users. Instead of waiting for one thing to finish before starting the next, ASGI lets Django do multiple tasks simultaneously. It’s like being able to juggle multiple balls instead of just one.

ASGI is super important because it makes our Django web apps faster and more efficient, especially when lots of people are using them at the same time. It’s like having a superpower for handling web traffic!

Deploy With ASGI in Django

With ASGI, Django can handle different types of tasks and connections, like regular web requests and even things like real-time chats or streaming services. So, if you’re diving into Django, understanding ASGI is like leveling up your web development skills to tackle the challenges of today’s internet world. In this beginner-friendly guide, we’ll walk through the steps to deploy your Django project using ASGI, from setting up your environment to running your application on a live server.

Setting Up Your Environment

Before diving into deployment, ensure you have Python installed on your computer. You can download Python for free from the official Python website. Once Python is installed, open your command prompt or terminal and install Django using the following command:

pip install django

Creating Your Django Project

Now, let’s create your Django project. Open your command prompt or terminal and navigate to the directory where you want to create your project. Then, run the following commands:

django-admin startproject myproject

This creates a new directory called myproject and sets up the basic structure for your Django project.

Developing Your Application

Inside your project directory, you’ll develop your Django application. You can create new apps, write views, templates, and configure URLs just like you would in a typical Django project. Make sure your application works as expected in your development environment before moving to deployment. Your file structure should look like this :

fig: file structure

Write the following code in your “welcome/views.py” file so that it will create a view of the website.

Python
# views.py
from django.shortcuts import render

def welcome_user(request):
    if request.method == 'POST':
        name = request.POST.get('name')
        return render(request, 'welcome/welcome.html', {'name': name})
    return render(request, 'welcome/welcome_form.html')

Creating GUI

templates/welcome_form.html: HTML document creates a Welcome form. Styled with CSS for layout and appearance, it utilizes JavaScript to handle animation selection dynamically. Upon submission, it sends the name to the server.

HTML
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Welcome Form</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-color: #f0f0f0;
        }

        form {
            width: 300px;
            padding: 20px;
            border-radius: 10px;
            background-color: #fff;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            animation: fadeIn 0.5s ease;
        }

        label, input, button {
            display: block;
            margin-bottom: 15px;
        }

        input[type="text"] {
            width: calc(100% - 20px);
            padding: 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

        button {
            width: 100%;
            padding: 10px;
            border: none;
            border-radius: 5px;
            background-color: #007bff;
            color: #fff;
            cursor: pointer;
        }

        button:hover {
            background-color: #0056b3;
        }

        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(-20px); }
            to { opacity: 1; transform: translateY(0); }
        }
    </style>
</head>
<body>
    <form method="post">
        {% csrf_token %}
        <label for="name">Enter your name:</label>
        <input type="text" id="name" name="name">
        <button type="submit">Submit</button>
    </form>
</body>
</html>

templates/welcome.html: HTML document creates a Welcome form. here it will display the name with a welcome message from the server

HTML
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Welcome</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-color: #f0f0f0;
            margin: 0;
            padding: 0;
            font-family: Arial, sans-serif;
        }

        h1 {
            text-align: center;
            font-size: 36px;
            color: #333;
            animation: fadeIn 2s ease;
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }
    </style>
</head>
<body>
    <h1>Welcome, {{ name }}!</h1>
</body>
</html>

Add the following code snippet into your “settings.py” file:

Python
# settings.py
ALLOWED_HOSTS = ['localhost']

Now update the “urls.py” file according to your template file:

Python
# myproject/urls.py

from django.contrib import admin
from django.urls import path
from welcome import views as welcome_views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', welcome_views.welcome_user, name='welcome'),
]

Configuring ASGI

ASGI allows Django to handle asynchronous HTTP, WebSockets, and other protocols. To configure ASGI in your Django project, create a file named asgi.py in your project directory (myproject) and add the following code:

asgi.py

Python
#This code initializes your Django application with ASGI support.

import os
from django.core.asgi import get_asgi_application

os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'myproject.settings')
application = get_asgi_application()

Installing Daphne

Daphne is an ASGI server that serves your Django application. Install Daphne using pip:

pip install daphne

Running Daphne

Now, you can run Daphne to serve your Django application. Open your command prompt or terminal and navigate to your project directory (myproject). Then, run the following command:

daphne -b 0.0.0.0 -p 8000 myproject.asgi:application

This command starts Daphne, binds it to the specified IP address and port (0.0.0.0:8000), and serves your Django application.

fig: Daphne server

Testing Your Deployment

Once Daphne is running, open your web browser and navigate to http://localhost:8000 to access your deployed Django application. Ensure everything works as expected in the deployment environment.

fig: Sample Project

fig: Sample Output