Nginx not serving static files in production with whitenoise

Question

Everything looks like it should work, but I get a 404 error in console for all static files including css, js and images. What am I doing wrong? Everything else seems to work just fine.

nginx.conf

server {
    listen 443 ssl;
    server_name www.${NGINX_HOST};
    ssl_certificate /etc/letsencrypt/live/${NGINX_HOST}/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/${NGINX_HOST}/privkey.pem;
    ssl_trusted_certificate /etc/letsencrypt/live/${NGINX_HOST}/chain.pem;

    location / {
        proxy_pass http://api;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $host;
        proxy_redirect off;
    }

    location /static {    
        autoindex on;    
        alias /myapp/collectedstatic/; 
    }

    location /media/ {
        autoindex on;
        alias /myapp/media/;
    }
}

settings.py

STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'
...

MIDDLEWARE = [
...
    'whitenoise.middleware.WhiteNoiseMiddleware',
...
]

STATIC_URL = '/static/'
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
)
STATIC_ROOT = os.path.join(BASE_DIR, 'collectedstatic')
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

Answer 1

I forgot to add a volume for static files to my docker-compose.yml

  nginx:
    ...
    volumes:
      - static-volume:/app/collectedstatic
      - media-volume:/app/media