Django webpage with Twilio

Recently when I was learning Django, I come across with a problem in my father’s shop. We do repair services for cooker, mixie, fan, grinder, etc.. But the customer who gave service used to visit our shop everytime to check whether the service is completed. It was difficult for my father to update them everytime after they reach our shop. So I just got an idea to modify a TODO website created by zappycode using Django. Come lets explore more about the solution.

Requirements:

pip install django
pip install twilio
pip install git

Clone my Django project:

I have created my entire project by modifying the existing TODO website. I recommend you to clone my git repository by using the below command,

git clone https://github.com/Siddhu2/django-nak-service.git

Then you need to create super user for the cloned Django project using the below command,

python3 manage.py createsuperuser

Give the username and password whichever you prefer. You can use the same username and password to login into your account.

Working flow of my project:

• Using my cloned website, you can create service, update it, delete it and mark service as complete.

Login page

• Once you login, you will be redirected into current page which will have no service in the list which means you can sit and relax.

No service in queue

• To create new service, you need to click on new service button, and enter the details inside:

Create service

• Once you fill in the details, click save button to save the service order and it will be listed in current page like below,

current service

• Click over the listed services in the current page to edit,delete or mark it as complete:

Edit service

My solution for the problem:

There were infinite number of website like above flow which I explained. Moreover, the above flow will be only helpful for my father but I want our customer to get benefited with the above flow. So I thought of adding a SMS API which could trigger a message to customer saying that the service is completed as soon as we click on complete button. I made it possible by using Twilio but you need to pay to avail this service. I have used free service of Twilio, which will trigger SMS to my mobile alone. In order to trigger SMS to customer number, you may need to avail paid service. Let me explain more on how I made this possible.

Explaining my solution:

Setting up twilio account:

Once you install twilio using pip command, you can follow the instruction in below link and setup your free twilio account,

How to Work with your Free Twilio Trial Account

Setting up our local environment:

Now its time to setup our local environment to use Twilio credentials to send SMS. I found below link was very useful to set it up,

Broadcasting SMS Text Messages from Python 3 Django Web Applications

We need to add the following variables in the environment,

• TWILIO_ACCOUNT_SID
• TWILIO_AUTH_TOKEN
• TWILIO_NUMBER

You can either save the values in a .env file and then source it,

# Twilio credentials and phone number
TWILIO_ACCOUNT_SID='<your account sid id>' # obtained from twilio.com/console
TWILIO_AUTH_TOKEN='your auth token' # also obtained from twilio.com/console
TWILIO_NUMBER='your received number' # use the number you received when signing up or buy a new number
source .env

OR

Export it into the OS using following commands incase if your are using Ubuntu,

export TWILIO_ACCOUNT_SID='<your account sid id>'
export TWILIO_AUTH_TOKEN='your auth token'
export TWILIO_NUMBER='your received number'

Additional code explanation:

You might have noticed that the following code I might have added in the view.py of completeservice function, which trigger the Twilio SMS,

view.py containing completeservice function to call API service

Also we need to make sure to import below things,

from twilio.rest import Client
from django.conf import settings

In settings.py also, add the following code,

TWILIO_ACCOUNT_SID = os.getenv("TWILIO_ACCOUNT_SID")
TWILIO_AUTH_TOKEN = os.getenv("TWILIO_AUTH_TOKEN")
TWILIO_NUMBER = os.getenv("TWILIO_NUMBER")

If you click on complete button in the service, you will receive message as below,

That’s it!! It is done and now you can send message to your registered phone number. You will be able to send SMS to customer if you upgrade your account.