Deployment in azure virtual machine

For this deployment, we used an Azure virtual machine with the following especifications:

Once the machine was created, we connected to it in order to install docker:

Once we acceded to the machine, we updated the apt repositories from where the machine downloads the packages, libraries, programs.. also we installed docker and gave DEPLOY_USER permissions of execution of the file docker-compose.

Then , we came back to github and created the secrets that are referenced in our .yml

Then , the workflow was adapted to the architecture of or own app.

Problems encountered along the way

I access the ip / domain and it does not connect..

•     Check your docker file is accurate, and has the command ["npm","run","start"] (we had this line commented)!
  

•     HAVE YOU OPENED THE PORTS ON THE VIRTUAL MACHINE? :) Because ours werent open at first :)
  

I managed to host my app, but it seems like it does not log into inrupt? Even if my login data is correct..

This happens because inrupt works with HTTPS only. In order to  have an https connection in your web , you'll need TLS/SSL certificates.

Attempt 1 (failed for me) :

I created a keyvault in azure, and generated a tls certificate. Azure suggest to make this BEFORE creating the machine. There's probably a way to adapt it to an existing machine, but I could not do it.

read the original tutorial by azure here

Attempt2: Telling react to use https.

First, we create the certificates using openssl ( do this inside a designated folder)

openssl req -x509 -newkey rsa:2048 -keyout key.pem -out cert.pem -days 365

two files will be created

now we need our react app to be using those files. For that , we will change the start script on package.json , and insert the following:

“start”: “export HTTPS=true&&SSL_CRT_FILE=cert.pem&&SSL_KEY_FILE=key.pem react-scripts start”,

Stuck here:

I dont see how could i do this without exposing the certificates on git, since the image requires them to be inside the webapp so package.json can access them ?

I tried searching on how to access .env files from the package.json, but still it would not make sense since the image will be created from the repo , and then in the machine we dont have the code...