Django does not serve static files for ckeditor in docker container

Question

I am deploying an django project with docker-compose and nginx. I can serve the ckeditor with its toolbar showing with python manage.py runserver. However when I try to serve it docker-compose and nginx I cant.

These are the output in the console:

Failed to load resource: the server responded with a status of 404 (Not Found) ckeditor-init.js:1 Failed to load resource: the server responded with a status of 404 (Not Found) ckeditor.js:1

docker-compose.yml

version: '3.8'

services:
  db:
    image: postgres:13
    environment:
      - POSTGRES_DB=db
      - POSTGRES_USER=user
      - POSTGRES_PASSWORD=password
    volumes:
      - db_data:/var/lib/postgresql/data
    networks:
      - app_network

  web:
    build: .
    command: gunicorn okuyorum.wsgi:application --bind 0.0.0.0:8000
    volumes:
      - static_volume:/app/staticfiles
      - media_volume:/app/media
    expose:
      - 8000
    depends_on:
      - db
    networks:
      - app_network

  nginx:
    image: nginx:1.19
    volumes:
      - static_volume:/usr/share/nginx/html/static
      - media_volume:/usr/share/nginx/html/media
      - ./nginx.conf:/etc/nginx/nginx.conf
    ports:
      - 80:80
    depends_on:
      - web
    networks:
      - app_network

volumes:
  db_data:
  static_volume:
  media_volume:

networks:
  app_network:

Dockerfile

# Use an official Python base image
FROM python:3.8

# Set environment variables
ENV PYTHONDONTWRITEBYTECODE 1
ENV PYTHONUNBUFFERED 1

# Create and set the working directory
RUN mkdir /app
WORKDIR /app

# Install system dependencies
RUN apt-get update && apt-get install -y \
    libpq-dev \
    gcc \
    gettext \
    && rm -rf /var/lib/apt/lists/*

# Install project dependencies
COPY requirements.txt /app/
RUN pip install --upgrade pip && \
    pip install -r requirements.txt

# Copy the project files
COPY . /app/

# Collect static files
RUN python manage.py collectstatic --noinput

# Expose the port the app runs on
EXPOSE 8000

nginx.conf

user  nginx;
worker_processes  auto;

error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;

events {
    worker_connections  1024;
}

http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile        on;
    tcp_nopush     on;
    tcp_nodelay    on;
    keepalive_timeout  65;
    types_hash_max_size 2048;
    client_max_body_size 100M;

    include /etc/nginx/conf.d/*.conf;

    server {
        listen 80 default_server;
        server_name example.com www.example.com;

        location / {
            proxy_pass http://web:8000;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;
        }

        location /static/ {
            alias /usr/share/nginx/html/static/;
        }

        location /media/ {
            alias /usr/share/nginx/html/media/;
        }
    }
}