Issues with Serving Static Files on Digital Ocean using Django, React.js, Gunicorn, and Nginx

Using Django Deployment
1

Hi everyone,

I’m facing an issue with my project hosted on a Digital Ocean server. When I run the server directly, everything works fine. However, after activating Gunicorn and connecting it with Nginx, my static files are not showing, and I only see an empty page.

I’m using Django for the backend and React.js for the frontend. Has anyone encountered this problem before? If so, could you share your solutions or any resources that might help?

2

Have you run manage.py collectstatic? That will put all your static files in 1 directory, which you can then serve either using nginx, or directly through Django with something like whitenoise.

In DEBUG, Django helps you by serving static files, however it’s not production-grade. In production, Django doesn’t do this, so you need to handle it yourself.

3

The best resources are the docs themselves.
See the Deployment checklist and the pages it links to.

In addition to the collectstatic command mentioned in the previous reply, you also need to ensure that the STATIC_ROOT setting matches your nginx configuration for the static files, and that nginx has read permissions to that directory tree.

4

Good day, Im facing the same problem, i went through the checklist and static files are still not showing, I even created a folder /var/www/static/, Ran Collectstatic but I stii get the same error and this is mt error log

[root@ip-172-31-42-90 html]# sudo tail -f /var/log/nginx/error.log
2024/07/15 19:40:54 [notice] 144713#144713: nginx/1.24.0
2024/07/15 19:40:54 [notice] 144713#144713: OS: Linux 6.1.79-99.167.amzn2023.x86_64
2024/07/15 19:40:54 [notice] 144713#144713: getrlimit(RLIMIT_NOFILE): 65535:65535
2024/07/15 19:40:54 [notice] 144714#144714: start worker processes
2024/07/15 19:40:54 [notice] 144714#144714: start worker process 144715
2024/07/15 19:40:54 [notice] 144714#144714: start worker process 144716
2024/07/15 19:42:39 [error] 144715#144715: *14 open() "/var/www/html/WebstackPortfolio/static/css/homepage.css" failed (2: No such file or directory), client: 41.145.194.100, server: 16.170.255.237, request: "GET /static/css/homepage.css HTTP/1.1", host: "16.170.255.237", referrer: "http://16.170.255.237/"
2024/07/15 19:42:40 [error] 144715#144715: *19 open() "/var/www/html/WebstackPortfolio/static/images/ppic.png" failed (2: No such file or directory), client: 41.145.194.100, server: 16.170.255.237, request: "GET /static/images/ppic.png HTTP/1.1", host: "16.170.255.237", referrer: "http://16.170.255.237/"
2024/07/15 19:42:40 [error] 144715#144715: *20 open() "/var/www/html/WebstackPortfolio/static/images/Engineering.png" failed (2: No such file or directory), client: 41.145.194.100, server: 16.170.255.237, request: "GET /static/images/Engineering.png HTTP/1.1", host: "16.170.255.237", referrer: "http://16.170.255.237/"
2024/07/15 19:42:40 [error] 144715#144715: *13 open() "/var/www/html/WebstackPortfolio/static/images/programming.png" failed (2: No such file or directory), client: 41.145.194.100, server: 16.170.255.237, request: "GET /static/images/programming.png HTTP/1.1", host: "16.170.255.237", referrer: "http://16.170.255.237/"

and this is my nginx.conf

type or paste code here

location /static/ {
        alias /var/www/html/static/;
        }

        location = /favicon.ico { access_log off; log_not_found off; }

        location / {
            try_files $uri $uri/ =404;
        }
5

Welcome @pasej5 !

To avoid confusion with existing discussions, please open a new topic for your issue. Include all this current information in your post.

Thanks!

1 Like
6

Noted thank you so much