Error in Frontend

hy honeyside,
when try yarn dev the showing frontend on my local pc its working fine and when i try to build using yarn build in frontend then i am getting dist name folder and copy this folder in server then i am getting blank like white. mean why build is not working and dev is working fine?

Hi! Can you share your .env file contents?

Also, your production frontend needs to run on HTTPS, if you want meetings to work.

is it possible to deploy backend using docker?

In theory, yes. However, meetings will only work if you deploy docker with network mode set to “host”. This is only compatible with Linux, it will not work in macOS and it will not work in Windows. The network mode configuration will also affect all your Docker instances running on the same machine (they will share the same ports pool).

1 Like

my docker file is this

Use Node.js LTS version

FROM node:18

Install build tools (only if necessary)

RUN apt-get update && apt-get install -y
curl
gcc
g++
make
python3
python3-pip
libssl-dev
libsrtp2-dev
libopus-dev
libvpx-dev
libsqlite3-dev
&& apt-get clean && rm -rf /var/lib/apt/lists/*

Set the working directory

WORKDIR /app

Copy only dependency files first (utilize Docker cache)

COPY package.json yarn.lock ./

Install production dependencies

RUN yarn install --production

Copy the rest of the backend code

COPY . .

Expose the backend port (adjust based on your app)

EXPOSE 4000
EXPOSE 10000-12000/udp

Start the backend server

CMD [“yarn”, “start”]

i am getting this issue

root@vmi2359399:/home/clover/backend# docker run -p 4000:4000 -p 10000-12000:10000-12000/udp backendcl
yarn run v1.22.22
$ node index
Honeyside © 2022
Welcome to Clover
Server listening on port 4000
/app/node_modules/mediasoup/node/lib/Worker.js:144
this.emit(‘@failure’, new Error([pid:${this.#pid}, code:${code}, signal:${signal}]));
^

Error: [pid:40, code:40, signal:null]
at ChildProcess. (/app/node_modules/mediasoup/node/lib/Worker.js:144:43)
at ChildProcess.emit (node:events:517:28)
at ChildProcess._handle.onexit (node:internal/child_process:292:12)

Node.js v18.20.5
error Command failed with exit code 1.
info Visit yarn run | Yarn for documentation about this command.

Try running docker run --net=host -p 4000:4000 -p 10000-12000:10000-12000/udp backendcl

1 Like

I think you are copying the node_modules folder from outside Docker into Docker. To verify this, try adding rm -rf node_modules before RUN yarn install --production

i have question can i run this on ubuntu 24?

As of last year, there was no way to run it on Ubuntu 24 because MongoDB Community did not support Ubuntu 24 yet.

As of today, however, MongoDB 8.0 has Ubuntu 24 support.

Clover has not been tested with MongoDB 8.0 yet.

In theory yes, you can. But the automated installer will not work, because it does not support MongoDB 8.0 yet. You can try manually installing it and report back here any issues that you have with MongoDB 8.0.

yes now i have install MongoDB 8.0 on ubuntu 24 its working. but i have issue in ngnix. like my domain is lms.abc.com is main domain where frontend run for API i am using location /api proxy pass localhost 4000. but i am getting socket.io error lms.abc.com/socket.

can you confirm 2 thinks

1 is i need 2 domains one for frontend and other for backend?
2 if possible both run on same domain please guide me

A single domain is not only sufficient, it’s also the advised configuration.

Your nginx.conf should contain the following:

server {
    server_name your_domain_name.com;
    listen 80;
    listen [::]:80;
    location / {
        proxy_pass http://localhost:4000;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-Host $host;
    }
}

4000 being the port where Clover is running.

Then, run Securing Nginx reverse proxy with Let's Encrypt SSL | Honeyside

this is backend server and where is frontend? is it need to sub domain for frontend?

server {
    server_name your_domain_name.com;
    listen 80;
    listen [::]:80;
    location / {
        proxy_pass http://localhost:4000;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-Host $host;
    }
}

this is my ngnix file is it correct?

server {

        root /var/www/html;

        # Add index.php to the list if you are using PHP
        index index.html index.htm index.nginx-debian.html;

        server_name lms.y2matevideo.com;

        location / {
                proxy_pass http://localhost:4000;             
                proxy_set_header Host $host;
                proxy_set_header X-Forwarded-Host $host;
        }
#       location /api {
#               proxy_pass http://localhost:4002;
#       }


    listen [::]:443 ssl ipv6only=on; # managed by Certbot
    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/lms.y2matevideo.com/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/lms.y2matevideo.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

}


server {
    if ($host = lms.y2matevideo.com) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


        listen 80;
        listen [::]:80;

        server_name lms.y2matevideo.com;
    return 404; # managed by Certbot


}

i am getting bad request but my frontend code in /var/www/html directory

Do not put code in your /var/www/html folder.

Build the frontend, the backend will take care of serving it on the same domain.

If you are getting 502 it means that the backend is not running on 4000. Perhaps on a different port?

1 Like

ok if i am not put code in /var/www/html. where is build the frontend?
now backend is up but i am getting this error… can you tell me where is frontend?
image

this my nginx file

##
server {

        server_name lms.y2matevideo.com;

        location / {
                proxy_pass http://localhost:4002;
                proxy_set_header Host $host;
                proxy_set_header X-Forwarded-Host $host;
        }


    listen [::]:443 ssl ipv6only=on; # managed by Certbot
    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/lms.y2matevideo.com/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/lms.y2matevideo.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

}


server {
    if ($host = lms.y2matevideo.com) {
        return 301 https://$host$request_uri;
    } # managed by Certbot


        listen 80;
        listen [::]:80;

        server_name lms.y2matevideo.com;
    return 404; # managed by Certbot


}

Assuming that you kept the same structure as in the download archive, that is with the two folders named “backend” and “frontend” side by side, you need to cd frontend and run yarn build

thank you its working but when i try to login i am getting this error. can you tell me ho to fixed this?


Can you share your frontend/.env file contents?