How to build a Django Word Counter

In this tutorial, we will be building a Django website that counts words. You first need to have Django installed on your computer, in my case I’ll be using Linux. Here is a simple command to install Django

pip3 install django

To start off we will run the following command below which will create a Django project.

django-admin startproject wordcounter

Now cd into the project and create an app using the command below

python3 manage.py startapp counter

The above command will create an app called counter. To register the app go to the settings.py file and add the following lines of code

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

Now let’s create a view that will handle the word counting. Go to the views.py file in the counter directory and add the following lines.

from django.shortcuts import render

def word_count(request):
    # set the initial word count to 0
    word_count = 0

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

        # split the text into words and count the number of words
        words = text.split()
        word_count = len(words)
        return render(request, "counter/index.html", {'word_count': word_count})
    else:
        return render(request, "counter/index.html")

The above code receives words from a html template that we will create below and it counts the number of words using the python len() function and then renders the number of words to the html template.

In the counter app create a folder called templates and in the templates folder create a folder called counter. Inside the counter folder create a html file called index.html

Here is the html file

<!doctype html>
<html>
  <head>
    <title>Word Counter</title>
  </head>
  <body>
    <form method="post">
      {% csrf_token %}
      <textarea name="text"></textarea>
      <input type="submit" value="Count Words">
    </form>
    <p>Word Count: {{ word_count }}</p>
  </body>
</html>

The above code creates a form in which we enter the words that want to be counted and then they are submitted to our view in the backend for calculation.

Now let’s create a route for our app. In the counter app, create a file called urls.py and add the following lines of code.

from django.urls import path
from . import views

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

Now let’s go back to our root app[wordcounter] and create some routes. In the urls.py file add the following

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

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

Now our application is almost finished. Open the terminal in the wordcounter directory and run the following command