Boilerplate For Angular 1.X and Django(Powered by Webpack2, Docker, Yarn, DRF)

Simple and clean boilerplate for using django and angular 1.x togather, with basic structure comes built-in.

Tech Stack

  1. Python3
  2. Django 1.11.6, Django Rest Framework
  3. Webpack 2
  4. JavaScript(ES6)/AngularJS 1.x
  5. Yarn


  1. Require Yarn. How to install Yarn:
  2. Require Docker if you want to use this boiler plate with docker. How to install Docker: ** If you don’t want docker, you can still use this boilerplate. Look here for details

Setup Frontend

  1. Run make install-frontend to install frontend dependencies
  2. Run make build-frontend to build frontend.
  3. Run make watch to watch over the file changes

Setup Docker

  1. Run make docker-build to build up docker
  2. Run make docker-up to startup docker apps for first time.
  3. To start again make docker-start, stop make docker-stop, restart make docker-restart
  4. For running the migrations: make docker-migrate *How to use django with docker: *For more commands, go inside docker folder.

Setup Backend

If you are not using docker, then you can go to backend folder and do following steps: 1. Create Virtual Environment using: virtualenv -p python3 /path/to/venv 2. Activate it: source /path/to/venv bin activate(Its different in Windows, see virtual environment documentation) 3. Run pip install -r requirements.txt 4. Put your local settings in and place it in “backend/movie_app/” directory to override current settings. FYI You need to put your DB settings in 5. Now run ./ migrate to migrate Database 6. Now run ./ collectstatic to run collectstatic 7. Run: ./ runserver to run the django application


  1. Create super user and access the adminsite. In there you can create movies instances.
  2. Or use API host:port/api/movies to create Movies
  3. Access host:port to see the movies.

Local Settings Sample

Lets say you want to use sqllite instead of psql. You can try like this:

# Will reside in ./backend/movie_app/
import os
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
     'default': {
         'ENGINE': 'django.db.backends.sqlite3',
         'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),


Front page at: http://localhost:8000/#!/

Front Page

Rest API at: http://localhost:8000/api/movies/


Admin Site at: http://localhost:8000/admin/movies/movie/