My Django dont recognize JS codes

Using Django
1

When I run the HTML code without django, runs normally, but when i put in django template, the JS dont work. how do i fix this?

base.html

<html>

<head>

  <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
  {% load static %}
  <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>

  <link rel="stylesheet" href="style.css">
</head>
<nav class="navbar navbar-expand navbar-dark background-color #070981" style="background-color: #070981;"> <a
    href="#menu-toggle" id="menu-toggle" class="navbar-brand"><span class="navbar-toggler-icon"></span></a> <button
    class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample02"
    aria-controls="navbarsExample02" aria-expanded="false" aria-label="Toggle navigation"> <span
      class="navbar-toggler-icon"></span> </button>
  <div class="collapse navbar-collapse" id="navbarsExample02">
    <ul class="navbar-nav mr-auto">
      <h1 class="nav-titulo" href="#" style="padding-left: 1px; color: #fff;">Esportivo Regional</h1>
      <li class="nav-item active"> <a class="nav-link" href="#"> <img
            src="C:\Users\marco\OneDrive\Documentos\Python\Django\Jornal\jornal\templates\logo.png" alt=""><span
            class="sr-only">(current)</span></a> </li>
    </ul>
    <form class="form-inline my-2 my-md-0"> </form>
  </div>
</nav>
<div id="wrapper" class="toggled">
  <!-- Sidebar -->
  <div id="sidebar-wrapper">
    <ul class="sidebar-nav">
      <li class="sidebar-brand"> Esportivo Regional </li>
      <li> <a href="#">Inicio</a> </li>
      <li> <a href="#">Login</a> </li>

    </ul>
  </div> <!-- /#sidebar-wrapper -->
  <!-- Page Content -->
  <div id="page-content-wrapper">
    <div class="container-fluid">
      <h1>Teste</h1>
    </div>
  </div> <!-- /#page-content-wrapper -->
</div> <!-- /#wrapper -->
<!-- Bootstrap core JavaScript -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.bundle.min.js"></script> <!-- Menu Toggle Script -->
<script>
  $(function () {
    $("#menu-toggle").click(function (e) {
      e.preventDefault();
      $("#wrapper").toggleClass("toggled");
    });

    $(window).resize(function (e) {
      if ($(window).width() <= 768) {
        $("#wrapper").removeClass("toggled");
      } else {
        $("#wrapper").addClass("toggled");
      }
    });
  });

</script>

</html>

Terminal

[20/Oct/2021 13:26:05] "GET /auth/login/ HTTP/1.1" 200 2426
Not Found: /auth/login/style.css
[20/Oct/2021 13:26:05] "GET /auth/login/style.css HTTP/1.1" 404 2740
Not Found: /auth/login/js/jquery.min.js
Not Found: /auth/login/js/bootstrap.bundle.min.js
[20/Oct/2021 13:26:05] "GET /auth/login/js/jquery.min.js HTTP/1.1" 404 2761
[20/Oct/2021 13:26:05] "GET /auth/login/js/bootstrap.bundle.min.js HTTP/1.1" 404 2791

Settings.py static config

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.2/howto/static-files/

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

MEDIA_ROOT = os.path.join(BASE_DIR,'media')
MEDIA_URL = '/media/'
2

Hi oScanner,

It looks like you skipped step 3 of configuring static files. You need to use the {% static ... %} template tag. Give the docs another read and let us know if you still have questions.