Merge pull request #23 from turniere/ticket/TURNIERE-166

Create Dockerfile: Ticket/turniere 166

.dockerignore

@@ -0,0 +1,6 @@
+node_modules/**
+.next/**
+.idea/**
+README.md
+.hound.yml
+.gitignore

Dockerfile

@@ -0,0 +1,19 @@
+### STAGE 1: Build ###
+FROM node:8-alpine as build
+WORKDIR /srv
+COPY js /srv/js
+COPY pages /srv/pages
+COPY static /srv/static
+COPY next.config.js package.json package-lock.json server.js style.css yarn.lock /srv/
+RUN yarn install
+RUN yarn build
+RUN yarn cache clean
+
+### STAGE 2: Productive Container ###
+FROM alpine
+WORKDIR /srv
+COPY --from=build /srv /srv
+RUN apk --no-cache add yarn && rm -rf /var/cache/apk/*
+EXPOSE 80
+ENV TURNIERE_API_URL=https://api.turnie.re
+CMD yarn start

README.md

@@ -1,10 +1,11 @@
 # turniere-frontend
 
-## Prerequisites
+## Development Setup
+### Prerequisites
 
 You'll need Node.js and a package manager for Node.js (like npm or Yarn; We recommend Yarn) installed on your system in order to run this program. You can see how to install Node.js [here](https://nodejs.org/en/).
 
-## Setup the project
+### Setup the Project
 
 First of course you'll need to clone this repository:
 
@@ -18,8 +19,18 @@ Afterwards you'll have to install the used libraries using following command:
 $ yarn install
 ```
 
-Afterwards you may simply run the developer version of the project:
+Then you can run the development server by executing:
+```
+$ TURNIERE_API_URL=https://api.example.com yarn run dev
+```
+The environment variable `TURNIERE_API_URL` must contain an valid url to a [turniere backend server](https://github.com/turniere/turniere-backend).
+ 
+In production environment the server runs on port 80, otherwise on port 3000.
+
+## Production Setup: Build the Docker Container
 
 ```
-$ yarn run dev
+$ docker build -t turniere-frontend .
 ```
+
+The built container exposes port 80.

js/api.js

@@ -8,9 +8,12 @@ import thunkMiddleware         from 'redux-thunk';
 
 import { errorMessages }       from './constants';
 
-const axios = require('axios');
+import getConfig from 'next/config';
+const { publicRuntimeConfig } = getConfig();
 
-const api_url = 'https://api.turnie.re';
+const api_url = publicRuntimeConfig.api_url;
+
+const axios = require('axios');
 
 const actiontypes_userinfo = {
     'REGISTER'                     : 'REGISTER',

next.config.js

@@ -1,3 +1,6 @@
 
 const withCSS = require('@zeit/next-css');
 module.exports = withCSS();
+module.exports.publicRuntimeConfig = {
+    api_url: process.env.TURNIERE_API_URL
+};

server.js

@@ -31,7 +31,7 @@ app.prepare()
             return handle(req, res);
         });
 
-        server.listen(3000, (err) => {
+        server.listen(dev ? 3000 : 80, (err) => {
             if (err) throw err;
         });
     })