Create your first Django App — ToDo App

Django is a high-level popular web framework that encourages building websites faster and cleaner.

Let’s build a simple ToDo App with Create and Delete functionality with this amazing framework!

First, we need to install Django (you definitely need to have python installed in your system😉) and then start the project —

pip install django
django-admin startproject todo

Since Django deals with small apps within a project, we need to make an app now —

cd todo
django-admin startapp TodoApp

Now run the command below to start your local server — you will find a rocket flying beautifully on this link and yes, you successfully made your Django App.

python manage.py runserver

Your folder structure should look like this (Add the templates folder with index file and urls.py in TodoApp as shown)

Now, since we have added an app, we need the Django admin to know about it as the URLs need to be synced together. So, let’s mention that in the settings.py file.

Let’s include the URLs of the app in our main project by editing the todo/urls.py

Let’s create a Django model in order to save our ToDos in the database. This is our models.py in TodoApp and also register it in admin.py.

Now get back to the terminal and let’s make the migrations and migrate them to apply the changes that you have made to your models.

python manage.py makemigrations
python manage.py migrate

Now let’s make ourselves a superuser to have access to the admin page so that we can manage our tables(models) directly from the database.

python manage.py createsuperuser

Fill in the required credentials and run the server again. Now click this to get on to your admin page. Fill up the credentials that you have used to create the superuser to have access to the database.

Now, let’s make the URL and view for the homepage in urls.py and views.py. Since, we are creating the ToDo, retrieving it and deleting it, we will require writing 3 endpoints.

In case this throws an error, add APPEND_SLASH=False to the settings.py file!

Hurray! we are all set from the backend. Now let’s work on the frontend, that is, index.html.

We are all set now! Get on to the server and start making your ToDos!

User Interface for ToDo App

I hope you will fall in love with Django Framework and make many more apps like this. Feel free to ping me on LinkedIn in case you have any doubts!

Don’t forget to leave some claps if you liked this blog!