Laravelと相性がいいCSSを紹介!

Laravelと相性がいいCSSを紹介!

Laravelを自作するときに、まずLayoutのテンプレートを用意しようと思った。そのときに、「あれっ、CSSってどうしたらいいんだ」ってなったから、調べたやつ。

Tailwindcssを使おう!

結論はTailwindcssというCSSのフレームワークを利用しよう!インストールする方法は以下の記事を参照!

このフレームワークを使えば、短いコードで簡単にCSSを反映させることができる。

Laravel-mixを準備する方法

あまりよく分かってないけど、Laravel-mixっていうLaravelと相性がいいやつがあるみたい。それを準備する方法を教えるよ!

次のコマンドをターミナルで実行します。

recources > css > app.cssに以下のコードを追加する。

同様に、webpack.mix.jsに以下のコードを追加する。

ターミナルで再度、以下のコマンドを入力する。

これを実行すると、public > css > app.cssにTailwindcssが記述されるようになる。

最後にこれをlinkタグでフロントエンドに持ってくる必要がある。Laravelで実行する場合は以下。

これで準備万端!素敵なプログラミングライフをっ!