title: How to fix error 404 with app.js and app.css in Laravel?
body: <p>I am using Laravel 6 and Bootstrap 4.</p>
  
  <p>I made a little app and I was trying to change the background color of the body in the CSS file but I noticed that it didn' work.</p>
  
  <p>So I checked in the tools for the developers and I saw that there are two errors about <strong>app.js</strong> and <strong>css/app.css</strong></p>
  
  <blockquote>
    <p>"Failed to load resource: the server responded with a status of 404 (Not Found)" </p>
  </blockquote>
  
  <p>I tried adding a <strong>"/"</strong> before the path of the CSS but I failed.</p>
  
  <p><strong>View:</strong></p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html lang="{{ str_replace('_', '-', app()-&gt;getLocale()) }}"&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  
      &lt;!-- CSRF Token --&gt;
      &lt;meta name="csrf-token" content="{{ csrf_token() }}"&gt;
  
      &lt;title&gt;{{ config('app.name', 'Laravel') }}&lt;/title&gt;
  
      &lt;!-- Scripts --&gt;
      &lt;script src="{{ asset('js/app.js') }}" defer&gt;&lt;/script&gt;
  
      &lt;!-- Fonts --&gt;
      &lt;link rel="dns-prefetch" href="//fonts.gstatic.com"&gt;
      &lt;link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet"&gt;
  
      &lt;!-- Styles --&gt;
      &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"&gt;
      &lt;link href="{{ asset('css/app.css') }}" rel="stylesheet" type="text/css"&gt;
  
  
      &lt;script src="https://code.jquery.com/jquery-3.2.1.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"&gt;&lt;/script&gt;
      &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body style="overflow: hidden; "&gt;
      &lt;div id="app"&gt;
          @include('../inc/navbar')
          &lt;main class="py-4"&gt;
              @yield('content')
          &lt;/main&gt;
          &lt;br&gt;
          &lt;br&gt;
          &lt;br&gt;
          @include('../inc/footer')
      &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>CSS:</strong></p>
  
  <pre><code>body {
      background-color: lightblue !important;
  }
  </code></pre>
  
  <p>I would like to see the lightblue body but for some reason it doesn't work. Have you some idea?</p>