How to build a Django Site Connectivity Web App

Django site connectivity checker site connectivity

In this tutorial, we will be building a site connectivity app that checks the availability of a certain website. You can use it to know if a certain site is accessible or not.

We will be using two libraries for this project, Django and requests. Django is a web development framework used to build websites while requests is a library for making http requests. To know more about requests visit here. To install the above libraries run the following commands.

pip3 install django 
pip3 install requests

After you have installed them, now let’s create our app. Run the below command in the terminal

django-admin startproject siteconnectivity

Now cd into the siteconnectivity directory and run the command below which will create our app.

python3 manage.py startapp connect

Now let’s register our connect app to our siteconnectivity project. To do this add the following lines in the settings.py

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'connect',
]

Now let’s create our view which will handle the logic for site connectivity. In views.py add the following.

import requests
from django.shortcuts import render

The above code imports the requests module and the default django render function. Now proceed to insert the following.

def check_connectivity(request):
    connectivity_status = "unknown"


    if request.method == 'POST':
        url = request.POST['url']

        try:
            response = requests.get(url)
            if response.status_code == 200:
                connectivity_status = "accessible"
            else:
                connectivity_status = f"not accessible (status code: {response.status_code})"
        except requests.ConnectionError:
            connectivity_status = "not accessible (connection error)"

        return render(request, "connect/index.html", {'connectivity_status': connectivity_status})
    else:
        return render(request, "connect/index.html")

The above function receives a url from a html form in the front end and the url is checked for connectivity using the requests module. Http status code 200 signifies that the request was successful, so if the url returns a 200 status response code the website with the url is accessible and running well if otherwise the site has some connectivity issues.

Now let’s create a template for our app. In the connect folder create a folder called templates and inside the templates folder create a folder called connect. Inside the connect folder create a file called index.html Here is the directory structure connect\templates\connect\index.html

Now inside the html file add the following

<!doctype html>
<html>
  <head>
    <title>Connectivity Checker</title>   
  </head>
  <body>
    <form method="post">
      {% csrf_token %}
      <label for="url">URL:</label>
      <input type="text" name="url" id="url" placeholder="http://www.googe.com">
      <br>
      <input type="submit" value="Check Connectivity">
    </form>
    <p>Connectivity Status: {{ connectivity_status }}</p>
  </body>
</html>

The above code asks for a url from the user and returns the response.

Now lets create some routes for our app. In the urls.py file add the following

from django.urls import path
from . import views

urlpatterns = [
    path('', views.check_connectivity, name='check_connectivity'),
]

Now let’s go back to the root directory of our project and add the following routes to urls.py

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


urlpatterns = [
    path('admin/', admin.site.urls),
    path('',include('connect.urls')),
]

Now our app is ready to start. Run the following commands to start the server

python3 manage.py runserver 

That should start the server, now open your browser and enter the following url

http://127.0.0.1:8000

You should now see this as shown below

There you have it now u can see the connectivity of any site you want. Thanks for reading.

Leave a Comment

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