Deploy React + NodeJs App

[phenomlab]

@justoverclock Wow. I’ll need to understand a bit more in terms of the topology etc before I can help.

[justoverclock]

@phenomlab if you have some step by step guide to setup the droplet i’ll switch to that…

for now i have a droplet with node installed, i’ve dropped all the file inside, now i’m running npm install and npm run build to install dependencies…after that i do not know how to tell the file to show

[phenomlab]

@justoverclock I don’t have a guide for this I’m afraid.

[justoverclock]

@phenomlab ok…i think i’ve managed all, now it works on a droplet…

i have only one problem running chromium (my app use chromium)

/home/marco/.pm2/logs/app-error.log last 15 lines:
1|app      |     at ExecutionContext.evaluate (/home/marco/node_modules/puppetee                                              r/lib/cjs/puppeteer/common/ExecutionContext.js:110:27)
1|app      |     at DOMWorld.evaluate (/home/marco/node_modules/puppeteer/lib/cj                                              s/puppeteer/common/DOMWorld.js:97:24)
1|app      |     at processTicksAndRejections (node:internal/process/task_queues                                              :96:5)
1|app      | Error: Protocol error (Runtime.callFunctionOn): Session closed. Mos                                              t likely the page has been closed.
1|app      |     at CDPSession.send (/home/marco/node_modules/puppeteer/lib/cjs/                                              puppeteer/common/Connection.js:218:35)
1|app      |     at ExecutionContext._evaluateInternal (/home/marco/node_modules                                              /puppeteer/lib/cjs/puppeteer/common/ExecutionContext.js:204:50)
1|app      |     at ExecutionContext.evaluate (/home/marco/node_modules/puppetee                                              r/lib/cjs/puppeteer/common/ExecutionContext.js:110:27)
1|app      |     at DOMWorld.evaluate (/home/marco/node_modules/puppeteer/lib/cj                                              s/puppeteer/common/DOMWorld.js:97:24)
1|app      |     at processTicksAndRejections (node:internal/process/task_queues                                              :96:5)
1|app      | Error: Protocol error (Runtime.callFunctionOn): Session closed. Mos                                              t likely the page has been closed.
1|app      |     at CDPSession.send (/home/marco/node_modules/puppeteer/lib/cjs/                                              puppeteer/common/Connection.js:218:35)
1|app      |     at ExecutionContext._evaluateInternal (/home/marco/node_modules                                              /puppeteer/lib/cjs/puppeteer/common/ExecutionContext.js:204:50)
1|app      |     at ExecutionContext.evaluate (/home/marco/node_modules/puppetee                                              r/lib/cjs/puppeteer/common/ExecutionContext.js:110:27)
1|app      |     at DOMWorld.evaluate (/home/marco/node_modules/puppeteer/lib/cj                                              s/puppeteer/common/DOMWorld.js:97:24)
1|app      |     at processTicksAndRejections (node:internal/process/task_queues                                              :96:5)

any suggestion?

[phenomlab]

@justoverclock Looks like it fails on unit tests. Have you added a try / catch to see what the exact error is or where it stalls ? Or perhaps you forgot an await so that the browser.close() executes before your command has terminated.

[justoverclock]

@phenomlab yes the logs file suggest me some missing libraries from puppeteer, i’m trying now to install all…

[phenomlab]

@justoverclock Thought so.

[justoverclock]

@phenomlab said in Deploy React + NodeJs App:

Thought so.

ok everything works fine now…

i just need some help on little things!

now i can access my droplet with the ip address. and is only http (no https).

so first of all i do not have nginx or other stuff right now, and i need to:

• secure all with https
• use a name instead of ip (not a real domain, something like appname.digitalocean.idontknow)

is this possible?

[phenomlab]

@justoverclock the security of HTTPS is possible, as is an nginx build, but not the FQDN you have chosen as you don’t own the digitalocean domain name space. If you wanted mytest.nydomain.com for example then this would be possible, but but for a domain you so not own or manage.

[justoverclock]

@phenomlab i understand…

now i’ve installed nginx…but i’m stucked…

i’ve installed nginx and enabled the following ports

sudo apt update
sudo apt install nginx

To                         Action      From
--                         ------      ----
Nginx HTTP                 ALLOW       Anywhere
22/tcp                     ALLOW       Anywhere
22                         ALLOW       Anywhere
2222                       ALLOW       Anywhere
80/tcp                     ALLOW       Anywhere
443                        ALLOW       Anywhere
8080                       ALLOW       Anywhere
3030                       ALLOW       Anywhere
Nginx HTTP (v6)            ALLOW       Anywhere (v6)
22/tcp (v6)                ALLOW       Anywhere (v6)
22 (v6)                    ALLOW       Anywhere (v6)
2222 (v6)                  ALLOW       Anywhere (v6)
80/tcp (v6)                ALLOW       Anywhere (v6)
443 (v6)                   ALLOW       Anywhere (v6)
8080 (v6)                  ALLOW       Anywhere (v6)
3030 (v6)                  ALLOW       Anywhere (v6)

now what i have to do to have my site running on https://21.21.21.21:8080 instead of actual http://21.21.21.21:8080 (p.s. ip is fake, not the real one)

[phenomlab]

@justoverclock you’ll need a basic configuration for the nginx configuration. I expect you need a reverse proxy

[justoverclock]

@phenomlab at moment works fine without anything, i don’t know why :D. no way that i can configure nginx without reading some sources…but i can’t find something simple

[phenomlab]

@justoverclock You just need a basic config block. Which port are you running the NodeJS app on ?

[phenomlab]

@justoverclock Any update ?

Thanks

EDIT - marking as solved based on the below thread
https://sudonix.com/topic/339/digitalocean-step-by-step-guide-to-nginx-configuration