Having a Docker infrastructure at hand, means it's easy to experiment with different technologies.

The other day, I decided I wanted to try programming something in React. Something revolutionary that would enrichen the very fabric of the Internet: Tic-tac-toe. Okay, the REAL reason for chosing Tic-tac-toe was that I found this really great tutorial that covers introduction to single page React apps.

With my Docker infrastructure at hand, I declared my Tic-tac-toe container, only I made it in Norwegian where we call Tic-tac-toe Bondesjakk (farmer's chess). I added this to my docker-compose.yaml:

  bondesjakk:
    container_name: bondesjakk
    image: node:12
    restart: always
    expose:
      - "3000"
    environment:
      - TZ=${DOCKER_TZ}
      - VIRTUAL_HOST=${BONDESJAKK_DOMAIN}
      - VIRTUAL_PORT=3000
      - VIRTUAL_PROTO=http
      - LETSENCRYPT_HOST=${BONDESJAKK_DOMAIN}
      - LETSENCRYPT_EMAIL=${NOTIFICATION_EMAIL}
      - NODE_ENV=production
    user: "node"
    working_dir: /home/node/app
    command: "npm start"
    networks:
      - frontend
    volumes:
      - ${MY_DOCKER_DATA_DIR}/bondesjakk:/home/node/app
    labels:
      co.elastic.logs/disable: false

Then I registered a CNAME in DNS pointing to my server, added BONDESJAKK_DOMAIN to my .env-file and ran "docker-compose up -d". What happened next was that Docker compose automatically added my "Bondesjakk" container as an upstream server for my Nginx front-end reverse proxy and created a Let's Encrypt Certificate on the fly. Wow! Right?

Now I had a publicly facing, SSL-secured NodeJS server for my React-project up and going in less than 10 minutes after I started researching. Of course, I still had no project, so the bondesjakk-container was stuck in an eternal restart loop as it didn't find any "package.json" definition in the home directory when running "npm start".

Luckily, the tutorial came to the rescue. On my dev-machine I installed nodejs version 12 (to correspond to my server version):

curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
sudo apt-get install nodejs

Then, from the ${MY_DOCKER_DATA_DIR} I ran:

npx create-react-app bondesjakk

After that I followed the tutorial and completed the ncessary steps in index.js and index.css.

Of course, the project isn't production ready as it stands now, but it's a really quick way to getting started and show the result to the world!

I still have a long way to go in regards to React and NodeJS, but the cliché (and possibly a Laozi quote) clearly states that "The journey of a thousand miles begins with one step".