Javascript is properly not loaded in my django project

Hi ,

my bok_shop web page it was working without django , But when I applied template inheritance and splitting my navbar slider and other components with my project level static directory and template directory the code is not working

Below is my base.html

{% comment %} {% load static %}

{% block title %}PageDrift{% endblock %} {% block extra_head %} {% endblock %} {% include "navbar.html" %} {% include "sliding-window.html" %} {% include "search-overlay.html" %}
<div class="container">
    {% block content %}
    <!-- Page-specific content will be injected here -->
    {% endblock %}
</div>


<script src="{% static 'js/main.js' %}"></script>
<script src="{% static 'js/footer.js' %}"></script>
<script src="{% static 'js/navbar.js' %}"></script>
<script src="{% static 'js/slidng-window.js' %}"></script>
<script src="{% static "js/search-overlay.js" %}"></script>
{% block extra_scripts %}
<!-- Extra scripts can be added here -->
{% endblock %}
{% endcomment %}

{% load static %}

{% block title %}PageDrift{% endblock %} {% block extra_head %}{% endblock %} {% include "navbar.html" %} {% include "sliding-window.html" %} {% include "search-overlay.html" %}
<div class="container">
    {% block content %}{% endblock %}
</div>

<script src="{% static 'js/main.js' %}" defer></script>
<script src="{% static 'js/footer.js' %}" defer></script>
<script src="{% static 'js/navbar.js' %}" defer></script>
<script src="{% static 'js/sliding-window.js' %}" defer></script> <!-- Corrected -->
<script src="{% static 'js/search-overlay.js' %}" defer></script> <!-- Corrected -->
{% block extra_scripts %}{% endblock %}

and below is my folder structure right now I’m in stuck my store app when I adding home.html by extending base.html it doesn’t working

book_shop
|---->cart
|----> orders
|----> store
| |—> templates
| |—> store
| |—> home.html
|-- templates
| |-- base.html
| |-- navbar.html
| |-- footer.html
| |-- search-overlay.html
| |-- sliding-window.html
|-- static
|-- css
| |-- main.css
| |-- navbar.css
| |-- search-overlay.css
| |-- sliding-window.css
|-- js
| |-- main.js
| |-- navbar.js
| |-- footer.js
| |-- sliding-window.js
| |-- search-overlay.js
|-- images
|-- book-stack.png
|-- search.png
|-- wishlist.png
|-- shopping-cart.png
|-- menu.png

I’ve attached my issue with the image

You’ll need to surround your code and directory listing with three backticks on their own line, before and after, to format correctly.

```

Also show your static files related settings from your settings.py file.