Join the chat at

Kick-start your Django and AngularJS based web applications in minutes. Your project will be deployed on Heroku so you can focus on building apps and not infrastructure.

The project provides a minimal set of useful libraries to get you started as quickly as possible. Specific topics are covered by recipes.

What you get:


Bootstrap your project

mkdir myproject && cd $_
wget -qO- | bash

Make sure you like what's inside


Watch for changes in your client:

cd client
grunt watch

Run the django development server:

source venv/bin/activate
cd server
python runserver_plus

Developing locally with Foreman

If you want to execute your local development environment in the same manner as the remote environment you can use Foreman (it’s installed automatically by the Heroku Toolbelt) to run your Procfile-backed app.

Build your client:

cd client
grunt build

Set DJANGO_DEBUG=False in server/.env and collect the static files:

cd server
./ collectstatic --noinput

Run foreman:

foreman start -e server/.env

This ensures that incompatibilities and hard to find bugs are caught before deploying to production and treats the application as a holistic unit instead of a series of individual commands working independently.


Add files, commit all your changes and push to heroku:

git add .
git commit -m 'your changes'
git push heroku master

How it works

This section covers the setup project process as done by djng-init, the interaction between the client and the server and the Heroku deployment.


Django server

Virtualenv is used to create an isolated Python environment for the Django server. The requirements are kept in requirements.txt and requirements_dev.txt:

virtualenv venv –no-site-packages
source venv/bin/activate
pip install -r requirements.txt
pip install -r requirements_dev.txt

All environment specific configurations for Django are located in server/.env:

$ cat serve.env

This configuration is then used in the Django

This environment is conveniently loaded by for local development. On Heroku this configuration is managed by config vars. This project uses the handy heroku-config plugin to manage the configuration.

AngularJs Client

All client dependencies are managed by npm and bower:

cd client
npm install
bower install

Serving static assets

All static assets are served by WhiteNoise in production to keep things simple. During local development the files are served by the django.contrib.staticfile app directly from the client directory.

Note: As this is a SPA Django needs to catch all URLs handled by the client and return the index.html. Therefore this URL pattern has to come last in your as it would otherwise override all other url definitions.

Heroku Deployment

This project uses heroku-buildpack-multi to run two buildpacks. One is heroku-buildpack-webapp-client to build the client and the other one is heroku-buildpack-python to run Django defined in .buildpacks:

$ heroku config:add BUILDPACK_URL=
$ cat .buildpacks