withアプリーチLaravelを使って初めてwebサイトを作るときに、構成するHTMLファイルやCSSファイル、画像ファイルをどこに置けば良いか迷いがちです。今回はLaravelでWebサイトを作成する初心者向けに、各種ファイルの設置場所とLaravel内のフォルダの違いをまとめていきます。設置するのはpublicフォルダの中です。CSSファイルに限らず、HTMLファイル、jsファイル、imgファイルなどWebサイトを構成するファイルは全てpublicフォルダ内に設置すればOKです。Laravelアプリを作成した段階ではpublicフォルダの中にはcssフォルダはないので必要であれば自分でフォルダ作成して設置します。public(公開)という名前からも分かるようにLaravel内で外部からアクセスされても良いファイルはここに格納していくのが基本です。作成したHTMLにCSSを読み込ませるには通常通りhead内にlinkでスタイルシートを指定してあげるだけです。ファイル構造とパスの点で注意が必要です。public内に設置したHTMLファイルなら違和感なくパスを記載できますが、resourceフォルダに設置したHTMLファイル(blade.phpなどテンプレート)の場合はどうなるでしょうか?サイトアクセス時にresourceフォルダの中にあるブレードファイルをルートやコントローラーで読みに行かせる場合もlinkのパスはpublic内にあるものとして記述します。どのファイルでも変わらずhead内に以下のように記述すればOKです。>asset関数で記述するasset関数とはpublicフォルダのパスを返してれるヘルパ関数の1つです。これを使うことで先程のような相対パス指定ではなく、絶対パス指定でリンクを読みにいけるようになります。}}で囲むことで中に記述した関数や変数を展開させることができます。↓切り替わるhttps://ドメイン/プロジェクト/public/css/style.cssasset関数はプロトコルがhttpでもhttpsでもどちらでも対応していますがSSL化した通信しか使わない場合はsecure_asset関数を使います。>基本的な使い方は同じで、返すパスがhttpsオンリーになるだけです。詳しくは公式リファレンスをご覧ください。公式リファレンスLaravelでCSSが効かない時CSSが効かない時は以下の原因が考えられます。パスが間違っているブラウザにキャッシュが残っているLaravel内にキャッシュが残っているまずはちゃんとパスが正しいものが反映されていているか確認してみましょう。デベロッパーツール(F12キー)を開き、sourceタブの構造部分から適応されているCSSファイルの中身を確認することができます。ここにちゃんと中身があるのにコードが更新されていなければキャッシュが残っている可能性があります。デベロッパーツールを開いた状態で左上の「」を右クリックし、「キャッシュの消去とハード再読み込み」をクリックします。これでブラウザ側のキャッシュを消去できます。おすすめ記事:【スマホ】ブラウザのキャッシュを削除してCSSが効かない問題を解決!それでもダメならLaravel側のキャッシュも削除してみましょう。コマンドライン(ターミナルやコマンドプロンプト)に以下のコードを打ち込むとキャッシュを削除(ブレードファイルを再コンパイル)することができます。view:clearターミナルの細かい使い方はこちらをご覧ください。おすすめ記事:【まとめ】コマンドプロンプトやターミナルの違い!CUIの種類を解説!publicフォルダとresourceフォルダの違いLaravel内ではresourceフォルダの中にCSSファイルや、jsファイルを格納するためのフォルダが予め用意されています。resourceフォルダとpublicフォルダ内では使い方が異なります。公開範囲まずは公開範囲が異なります。publicフォルダは先ほども言った通り、外部からアクセスすることが可能な公開されているフォルダです。CSSファイルや画像ファイルなど見られても問題ないようなファイルをここに格納します。フォルダの役割2つ目はフォルダの役割です。public:見られても良いファイルの格納場所resource:資源(リソース)となるファイルの格納場所resourceフォルダに入れるべきファイルは「*.blade.php」や「✳*.scss」などそのまま出力されない(コンパイルされてから出力)ファイルを入れます普通のHTMLファイルやCSSファイルも入れることは可能(コントローラーなどでアクセスさせることも可能)ですが手間が増えるだけなのでメリットがないと思います。まとめ最後に今回のまとめです。読み込みコードは通常通りでOKasset関数で絶対パス記載も可能resourceフォルダ内は公開されないまだまだ勉強中ですので間違っている点や至らぬ点がありましたら教えていただけると助かります。ご覧いただきありがとうございました。友達や家族の誕生日を登録しておくと当日に通知が届きお知らせしてくれるiOSアプリです。貸し借り管理アプリお金の貸し借りを管理するためのアプリです。貸借の色が分かれているので識別しやすく、使いやすさを求めてできるだけシンプルなUIにしています。カシホン人に貸すことが多く、誰に貸したか忘れがちな本の貸し借りを記録できるアプリです。