Host a Django website using Heroku

Creating a website using the Django framework is among the most basic skills a web developer or a person interested in web-development has. If you want to get into it check this Django Tutorial

With your website done, you might want to show it to someone. But, it is a Django-based website, not just a few HTML-CSS pages with few static files that can be sent over mail. Of course, you can make it into a GitHub repo and share the URL to it, still, one need to clone the repo and then run the website using the command :

$ python manage.py runserver

A lot of hassle on both ends isn't it. What if you can just make a public URL for the website and use the URL alone to display your project. All this, without requiring any domain names or any paid servers as well.

Heroku is a cloud application platform that enables developers to build, run, and operate applications entirely in the cloud.

Prerequisites:

1. Django Framework
2. Git/Github
3. Python Virtual Environment

Set up the virtual environment and create your project there. If the virtual environment has not been set up initially, you can do so now by creating it and then installing all the project dependencies in it.

Create a Heroku Account

Confirm your email and set the password You should now get the Heroku Dashboard

Install the Heroku CLI

Confirm the installation using the command

(env)$ heroku --version

Get the migrations done:

(env)$ python manage.py makemigrations 
(env)$ python manage.py migrate

Add a Procfile

Heroku apps include a Procfile that specifies the commands that are executed by the app on startup.

Create a new file named "Procfile" (no file extension) in the project root (the folder where manage.py is located) and add the following content to it.

web: gunicorn {your-project-name}.wsgi —-log-file - 

example: 
web: gunicorn samplesite.wsgi —-log-file - 

Ensure you replace samplesite with your project name (name of the folder containing the manage.py file)

The Procfile is a process file that tells the dyno (Lightweight Linux containers to run your application) the process to run for setting up your application.

web: gunicorn : start a web process using gunicorn, a production web server recommended for python applications.

samplesite.wsgi : to look for the wsgi (Web Server Gateway Interface) file inside the samplesite (your-project-name) folder

—-log-file - : log to stdout

Next, install gunicorn and django-heroku

(env)$ pip install gunicorn 
(env)$ pip install django-heroku 

Create the requirements.txt file in the project root.

(env)$ pip freeze > requirements.txt

Create Heroku App

Login to Heroku Using

(env)$ heroku login 

Confirm the Log In in the browser window which opens. You should get the following screen.

and the confirmation for the same in the terminal

Create Heroku App using terminal

You can choose any URL for the project (containing lowercase letters, digits & dashes only). If the heroku app name or the URL is not available you will get an error message.

(env)$ heroku create {project-url} 

Alternative, using just

(env)$ heroku create

heroku will auto-generate a name for your app.

In settings.py
Add your app domain name to ALLOWED_HOSTS

ALLOWED_HOSTS = ['test-django-heroku.herokuapp.com']

Add this to the top of settings.py

import django_heroku 

and this to the bottom of settings.py

 # Activate Django-Heroku. 
 django_heroku.settings(locals()) 

Setting up Heroku remote

We need to initialize a git repository to push the changes from the local machine on to the Heroku server.

(env)$ git init 

add .gitignore

Create a .gitignore file with the following content (to prevent the cache from building up on the remote).

 # Environments 
 .env 
 env/ 
 # Django stuff: 
 __pycache__/ 
 *.log 
 *.pot 
 *.pyc 
 local_settings.py 

Your project repo tree should be similar

env/
projectname/
    appname/     
    projectname/
        .      
        settings.py
        . 
    manage.py  
    Procfile
    requirements.txt
.gitignore`  

Stage and commit the changes

(env)$ git add . 
(env)$ git commit -m "Project Initialized" 

Add the Heroku remote

(env)$ git remote add heroku https://git.heroku.com/test-django-heroku.git 

Make sure to change the git repo url with the one generated for your app. Check for the added remote using :

(env)$ git remote -v 

Push the changes to the Heroku server

(env)$ git push heroku master 

Here you might receive an error saying No default language could be detected for the app. So, use the following command to tell git to look for the project files in the projectname folder instead of the root of the git repo.

(env) git subtree push —-prefix projectname heroku master 

You should get the following output for a successful deployment.

DONE! Your app is deployed and can be explored in the mentioned URL.

You can run the Django shell commands on the heroko app too using

heroku run bash

You will have the run the migrations on the heroku database as well

(env)$ heroku run python manage.py makemigrations 
(env)$ heroku run python manage.py migrate 

Your app should now be listed on Heroku Dashboard

Explore the app and look out for what more can be done.

For serving the static files you will have to configure whitenoise, a static file service for python web-apps. The documentation explains it in a pretty straightforward manner.

Note: If you plan to use this hosted site for production and not just testing/demo purposes, ensure you use the PostgreSQL database as Heroku mentions it here.

Also, make sure to disable the DEBUG flags when in production mode.