Feedback App

Feedback application written in ReactJS

Setup

Docker Compose

---

• Install Docker and Docker Compose
• Create a directory for your compose file. For example, feedback
• Create a docker-compose.yml file:

SSL

This example maps the ssl directory in the home directory. Inside this directory are two files fullchain.pem and privkey.pem which are files generated by Let's Encrypt. Change the TOKEN environment variable to your own generated token

---
version: '3'

services:
  app:
    image: timmo001/feedback-app
    restart: unless-stopped
    ports:
      - 443:443
    volumes:
      - ~/ssl:/ssl
  api:
    image: timmo001/feedback-api
    environment:
      CERTIFICATES_DIR: /ssl
      TOKEN: kZizIjt1fduiVqA68RuvMaJq3gVMhPcQHfft0HLSGVrVDgav9hQgcWp8ynjSFrGw
    ports:
      - 31020:31020
    volumes:
      - ~/ssl:/ssl

Non-SSL

This example shows how to set up the app without ssl. This is useful for testing, but is unsecure, so don't expose the app to the outside world.

---
version: '3'

services:
  app:
    image: timmo001/feedback-app
    restart: unless-stopped
    ports:
      - 80:80
  api:
    image: timmo001/feedback-api
    environment:
      - TOKEN=wvQYEK2JS7PPSUUVPosSkH8k9engHcRBhJmLFxBki614AtJcNHdU56NDEJpV6Yx5
    ports:
      - 31020:31020

Docker

---

• Install Docker
• Run image

SSL

This example maps the ssl directory in the home directory. Inside this directory are two files fullchain.pem and privkey.pem which are files generated by Let's Encrypt. Change the TOKEN environment variable to your own generated token

docker run -d \
  -p 443:443 \
  -v ~/ssl:/ssl \
  timmo001/feedback-app

docker run -d \
  -p 31020:31020 \
  -v ~/ssl:/ssl \
  -e CERTIFICATES_DIR='/ssl' \
  -e TOKEN=kZizIjt1fduiVqA68RuvMaJq3gVMhPcQHfft0HLSGVrVDgav9hQgcWp8ynjSFrGw \
  timmo001/feedback-api

Non-SSL

This example shows how to set up the app without ssl. This is useful for testing, but is unsecure, so don't expose the app to the outside world.

docker run -d \
  -p 80:80 \
  timmo001/feedback-app

docker run -d \
  -p 31020:31020 \
  -e TOKEN=wvQYEK2JS7PPSUUVPosSkH8k9engHcRBhJmLFxBki614AtJcNHdU56NDEJpV6Yx5 \
  timmo001/feedback-api

Node JS

---

API Setup

• First clone the Feedback API repository
• Checkout the version you want via releases
• Change the token inside .env to a secure and random password. I used a generator like this one.
• Install packages

yarn install

• Run

node index.js

Webapp

• Clone this repository
• Checkout the version you want via releases
• Install packages

yarn install

Production - SSL

• Build a production version

yarn build

• Install nginx
• Edit your server config /etc/nginx/conf.d/default.conf

server {
  listen 443 ssl http2 default_server;
  listen [::]:443 ssl http2 default_server;

  root /usr/share/nginx/html;
  index index.html;
  server_name 172.0.0.1;

  ssl_certificate /ssl/fullchain.pem;
  ssl_certificate_key /ssl/privkey.pem;

  location / {
    try_files $uri /index.html;
  }
}

• Copy the files in the build folder into nginx's html directory at /usr/share/nginx/html
• Start your server

nginx -g "daemon off;"

Production - Non-SSL

This option is not secure. Do not open to the outside world!

• Build a production version

yarn build

• Install nginx
• Edit your server config /etc/nginx/conf.d/default.conf

server {
  listen 80 default_server;
  listen [::]:80 default_server;
  root /usr/share/nginx/html;
  index index.html;
  server_name 172.0.0.1;
  location / {
    try_files \$uri /index.html;
  }
}

• Copy the files in the build folder into nginx's html directory at /usr/share/nginx/html
• Start your server

nginx -g "daemon off;"

Development

This option is not secure. Do not open to the outside world!

• Run the app

yarn start

• The app should open in your default browser under http://localhost:3000