Template File Not Found in Django

So I have been trying to serve a template file in Django. My main issue is that the index.html page is found , but the static files (js,css,png) files are not found . They are all under the same directory as index.html file. Here are my configurations :

Settings.py

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [
            os.path.join(BASE_DIR, 'templates')
        ],
        'APP_DIRS': True,
    },
]

urls.py (Main)

    path('rest-framework/', include('rest_framework.urls')),
    path('api/', include('accounts.urls')),
    path('admin/', admin.site.urls),
    url(r'^rest-auth/',  views.obtain_auth_token),
]

urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

urls.py (App)

urlpatterns = [
    path('homepage/', views.index, name='index'),
]

views.py

def index(request):
    return render(request, 'index.html')

And here is the exact error I get:

[15/May/2024 08:31:40] "GET /api/homepage/ HTTP/1.1" 200 1837
Not Found: /api/homepage/flutter.js
[15/May/2024 08:31:40] "GET /api/homepage/flutter.js HTTP/1.1" 404 2674
Not Found: /api/homepage/manifest.json
[15/May/2024 08:31:40] "GET /api/homepage/manifest.json HTTP/1.1" 404 2683

My template files directory is like this:

accounts\
-migrations\
-templates\
server\
media\
static\
manage.py
requirements.txt

index.html

  <base href="/">

  <!-- Favicon -->
  <link rel="icon" type="image/png" href="favicon.png"/>

  <title>bilmarkgorevdagilimi</title>
  <link rel="manifest" href="manifest.json">


  <script>
    // The value below is injected by flutter build, do not touch.
    var serviceWorkerVersion = '2027642995';
  </script>
  <!-- This script adds the flutter initialization JS code -->
  <script src="flutter.js" defer></script>

How can I solve this problem?

  1. You must load the static template tag for Django to search for static files. link
{% load static %}
<base href="/">

  <!-- Favicon -->
  <link rel="icon" type="image/png" href="{% static 'favicon.png' %}"/>

  <title>bilmarkgorevdagilimi</title>
  <link rel="manifest" href="{% static 'manifest.json' %}">


  <script>
    // The value below is injected by flutter build, do not touch.
    var serviceWorkerVersion = '2027642995';
  </script>
  <!-- This script adds the flutter initialization JS code -->
  <script src="{% static flutter.js %}" defer></script>
  1. You have to define STATICFILES_DIRS in your settings.py. link
Back to Top