Try out Next with Docker#

This tutorial outlines how you can run Next in a docker container.

This is great for trying out the Next platform and will show you the necessary settings so you could use it in production.

Prerequisites#

In order for you to try out Next you need to set up some prerequisites.

Unsplash#

Configure a developer account at unsplash and get an API key. You can do this for free.

Unsplash is used as the source for banner images used to customize studies.

Google OIDC#

Configure a google OIDC connect application in the google cloud console. For the details check the official instructions.

Google OIDC (OpenID Connect) is used to manage user authentication and account sign-ins.

Run Next in a Docker container#

In this step, we will create and run the necessary containers using Docker Compose.

We are going to create a folder with the following structure:

.
├── docker-compose.yaml
└── proxy
    ├── certs
    │   ├── nginx-selfsigned.crt
    │   └── nginx-selfsigned.key
    └── conf
        └── nginx.conf

In the next step we are going to create the files.

Build the Next Docker image#

Clone or fork Next

cd into /core

and build the image with:

docker build  --build-arg VERSION=1.0.0 --build-arg BUNDLE=self . -t self-d3i:latest

Setup certificates for TLS#

Create certificates and put them in proxy/certs

openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout nginx-selfsigned.key -out nginx-selfsigned.crt

Nginx configuration#

We are going to use Nginx as reverse proxy.

Nginx will be used to provide TLS for our HTTP connections.

Paste the following nginx configuration in proxy/conf:

# nginx.conf
events {}
http {
    server {
        listen 80;
        listen [::]:80;
        server_name localhost;
        
        # Redirect all HTTP requests to HTTPS
        return 301 https://$server_name$request_uri;
    }

    server {
        server_name localhost;
        
        if ($scheme != "https") {
            return 301 https://$host$request_uri;
        }
        
        location / {
          allow all;
          proxy_pass                http://app:8000;
          proxy_set_header          X-Forwarded-Proto $scheme;
          proxy_set_header          X-Forwarded-For $remote_addr;
          proxy_set_header          X-Real-IP $remote_addr;
          proxy_set_header          Host $http_host;
          proxy_http_version        1.1;
          proxy_set_header          Upgrade $http_upgrade;
          proxy_set_header          Connection "upgrade";
          proxy_max_temp_file_size  1m;
        }
        
        listen 443 ssl;
        ssl_certificate /etc/nginx/certs/nginx-selfsigned.crt;
        ssl_certificate_key /etc/nginx/certs/nginx-selfsigned.key;
    }
}

This Nginx configuration works with websocket connections which Next (Phoenix web application) uses.

Docker compose yaml#

Now create the docker-compose.yaml:

#docker-compose.yaml
services:
  app:
    image: self-d3i:latest
    container_name: self-d3i
    restart: always
    environment:
      APP_NAME: next
      APP_DOMAIN: localhost
      APP_MAIL_DOMAIN: "@gmail"
      APP_ADMINS: youremail@gmail.com
      DB_USER: user
      DB_PASS: password
      DB_HOST: db
      DB_NAME: test_database
      SECRET_KEY_BASE: "aUMZobj7oJn58XIlMGVcwTYrCsAllwDCGlwDCGlwDCGwDChdhsjahdghaggdgdGt7MoQYJtJbA="
      STATIC_PATH: "/tmp"
      UNSPLASH_ACCESS_KEY: "<your-unsplash-api-key>"
      UNSPLASH_APP_NAME: "<your-unsplash-app-name>"
      GOOGLE_SIGN_IN_CLIENT_ID: "<your-google-oidc-client-id>"
      GOOGLE_SIGN_IN_CLIENT_SECRET: "<your-google-oidc-client-secret>"
      STORAGE_SERVICES: "builtin, yoda, azure"
    volumes:
      - app_data:/tmp
    depends_on:
      - db

  db:
    image: postgres:latest
    container_name: db-next
    restart: always
    environment:
      POSTGRES_USER: user
      POSTGRES_PASSWORD: password
      POSTGRES_DB: test_database
    volumes:
      - postgres_data:/var/lib/postgresql/data

  proxy:
    image: nginx:latest
    container_name: nginx
    ports:
      - 443:443
    volumes:
      - ./proxy/conf/nginx.conf:/etc/nginx/nginx.conf
      - ./proxy/certs:/etc/nginx/certs
    depends_on:
      - app

volumes:
  postgres_data:
  app_data:

and replace the following variables with the values you obtained in the previous steps:

UNSPLASH_ACCESS_KEY: "<your-unsplash-api-key>"
UNSPLASH_APP_NAME: "<your-unsplash-app-name>"
GOOGLE_SIGN_IN_CLIENT_ID: "<your-google-oidc-client-id>"
GOOGLE_SIGN_IN_CLIENT_SECRET: "<your-google-oidc-client-secret>"

If you want to learn more about the variables you can read the documentation.

Now you are ready to start the containers with:

docker compose up

Go to https://localhost:80 and if everything went well you should see Next.

Note: because you self-signed your TLS certificates your browser will complain: accept all the risks and continue.

Next steps in Next#

Now you can play around in Next. If you want to login as admin go to /admin/login.