Laravel CSS and Bootstrap doesn't working-CodePudding

I created a new Laravel project and downloaded the bootstrap CSS and JS files and put the CSS file in resources/css and the JS files of bootstrap and popper and jQuery in resources/js and in the welcome.blade.php I linked the CSS file and the JS files like this

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Osama The Coder</title>
    <link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}">
    <link rel="stylesheet" href="{{ asset('css/app.css') }}">
</head>

<body>
    <section class="text-danger">
        Hello World
    </section>

    <script src="{{ asset('js/jquery-3.6.0.min.js') }}"></script>
    <script src="{{ asset('js/popper.min.js') }}"></script>
    <script src="{{ asset('js/bootstrap.min.js') }}"></script>
</body>

</html>

when I opened the project it was just the text without any styles or Bootstrap font-family even when I linked the app.css and applied color red to the section element I doesn't see any changes

CodePudding user response：

Please follow the following steps

Put all your static assets in public directory
Organize your assets in different folders e.g public/js for js related files and public/css for css related files

Then access your files using the helper method like below

<link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}">
/* or js files */
<script src="{{ asset('js/jquery-3.6.0.min.js') }}"></script>