Merge pull request #204 from CatalystCode/enhancement/docker-compose

Enhancement/Add Docker-Compose file for development

README.md

@@ -81,9 +81,9 @@ git clone https://github.com/chakki-works/doccano.git
 cd doccano
 ```
 
-To install doccano, there are two options:
+To install doccano, there are three options:
 
-**Option1: Pull the Docker image**
+**Option1: Pull the production Docker image**
 
 ```bash
 docker pull chakkiworks/doccano
@@ -108,37 +108,10 @@ npm run build
 # npm start  # for developers
 ```
 
-Next we need to make migration. Run the following command:
+**Option3: Pull the development Docker-Compose images**
 
 ```bash
-python manage.py migrate
-```
-
-Next we need to create a user who can login to the admin site. Run the following command:
-
-
-```bash
-python manage.py createsuperuser
-```
-
-Enter your desired username and press enter.
-
-```bash
-Username: admin
-```
-
-You will then be prompted for your desired email address:
-
-```bash
-Email address: admin@example.com
-```
-
-The final step is to enter your password. You will be asked to enter your password twice, the second time as a confirmation of the first.
-
-```bash
-Password: **********
-Password (again): *********
-Superuser created successfully.
+docker-compose pull
 ```
 
 ## Usage
@@ -165,10 +138,32 @@ docker exec doccano tools/create-admin.sh "admin" "admin@example.com" "password"
 
 **Option2: Running Django development server**
 
+Before running, we need to make migration. Run the following command:
+
+```bash
+python manage.py migrate
+```
+
+Next we need to create a user who can login to the admin site. Run the following command:
+
+```bash
+python manage.py create_admin --noinput --username "admin" --email "admin@example.com" --password "password"
+```
+
+Finally, to start the server, run the following command:
+
 ```bash
 python manage.py runserver
 ```
 
+**Option3: Running the development Docker-Compose stack**
+
+We can use docker-compose to set up the webpack server, django server, database, etc. all in one command:
+
+```bash
+docker-compose up
+```
+
 Now, open a Web browser and go to <http://127.0.0.1:8000/login/>. You should see the login screen:
 
 <img src="./docs/login_form.png" alt="Login Form" width=400>

app/server/webpack.config.js

@@ -4,6 +4,9 @@ const VueLoaderPlugin = require('vue-loader/lib/plugin')
 
 const devMode = process.env.DEBUG !== 'False';
 const hotReload = process.env.HOT_RELOAD === '1';
+const webpackHost = process.env.WEBPACK_HOST || '127.0.0.1';
+const webpackPort = process.env.WEBPACK_PORT ? parseInt(process.env.WEBPACK_PORT, 10) : 8080;
+const pollMillis = process.env.WEBPACK_POLL_MILLIS ? parseInt(process.env.WEBPACK_POLL_MILLIS, 10) : false;
 
 module.exports = {
     mode: devMode ? 'development' : 'production',
@@ -27,16 +30,21 @@ module.exports = {
         'download_text_classification': './static/js/download_text_classification.js',
     },
     output: {
-        publicPath: hotReload ? 'http://localhost:8080/' : '',
+        publicPath: hotReload ? `http://127.0.0.1:${webpackPort}/` : '',
         path: __dirname + '/static/bundle',
         filename: '[name].js'
     },
     devtool: devMode ? 'cheap-eval-source-map' : 'source-map',
     devServer: {
+        port: webpackPort,
+        host: webpackHost,
         hot: true,
         quiet: false,
         headers: { 'Access-Control-Allow-Origin': '*' }
     },
+    watchOptions: {
+        poll: pollMillis,
+    },
     module: {
         rules: [
             {

docker-compose.yml

@@ -0,0 +1,42 @@
+version: "3"
+services:
+
+  django:
+    image: python:3.6
+    volumes:
+      - .:/src
+      - venv:/src/venv
+    command: ["/src/tools/dev-django.sh", "0.0.0.0:8000"]
+    environment:
+      ADMIN_USERNAME: "admin"
+      ADMIN_PASSWORD: "password"
+      ADMIN_EMAIL: "admin@example.com"
+      DATABASE_URL: "postgres://doccano:doccano@postgres:5432/doccano?sslmode=disable"
+    ports:
+      - 8000:8000
+
+  webpack:
+    image: node:8
+    volumes:
+      - .:/src
+      - node_modules:/src/app/server/node_modules
+    command: ["/src/tools/dev-webpack.sh"]
+    environment:
+      WEBPACK_HOST: "0.0.0.0"
+      WEBPACK_PORT: "8080"
+      WEBPACK_POLL_MILLIS: "1000"
+    ports:
+      - 8080:8080
+
+  postgres:
+    image: postgres:9.6
+    environment:
+      POSTGRES_USER: "doccano"
+      POSTGRES_PASSWORD: "doccano"
+      POSTGRES_DB: "doccano"
+    ports:
+      - 5432:5432
+
+volumes:
+  node_modules:
+  venv:

tools/dev-django.sh

@@ -0,0 +1,33 @@
+#!/usr/bin/env bash
+
+set -o errexit
+
+root="$(dirname "$0")/.."
+app="${root}/app"
+venv="${root}/venv"
+
+if [[ ! -f "${venv}/bin/python" ]]; then
+  echo "Creating virtualenv"
+  mkdir -p "${venv}"
+  python3 -m venv "${venv}"
+  "${venv}/bin/pip" install --upgrade pip setuptools
+fi
+
+echo "Installing dependencies"
+"${venv}/bin/pip" install -r "${root}/requirements.txt"
+
+echo "Initializing database"
+"${venv}/bin/python" "${app}/manage.py" wait_for_db
+"${venv}/bin/python" "${app}/manage.py" migrate
+
+if [[ -n "${ADMIN_USERNAME}" ]] && [[ -n "${ADMIN_PASSWORD}" ]] && [[ -n "${ADMIN_EMAIL}" ]]; then
+  "${venv}/bin/python" "${app}/manage.py" create_admin \
+    --username "${ADMIN_USERNAME}" \
+    --password "${ADMIN_PASSWORD}" \
+    --email "${ADMIN_EMAIL}" \
+    --noinput \
+  || true
+fi
+
+echo "Starting django"
+"${venv}/bin/python" -u "${app}/manage.py" runserver "$@"

tools/dev-webpack.sh

@@ -0,0 +1,18 @@
+#!/usr/bin/env bash
+
+set -o errexit
+
+root="$(dirname "$0")/.."
+server="${root}/app/server"
+
+(
+  cd "${server}"
+
+  if [[ ! -d node_modules/.bin ]]; then
+    echo "Installing dependencies"
+    npm install
+  fi
+
+  echo "Starting webpack"
+  npm start
+)