流行りのスタイルのtailwindcssの導入の仕方(Next.js)
npx create-next-app next-jsで導入したファイルに
1.npm install
npx create-next-app . --use-npm
npm i tailwindcss
npx tailwindcss init -p
2.🗂stylesのglobal.cssの中身を書き換える
@tailwind base;
@tailwind components;
@tailwind utilities;
3.🗂pagesにimport文を追加
import '../styles/globals.css';
import 'tailwindcss/tailwind.css';
4.下記のサイトを参考にclassName内に記述
[例です]
<div classnName="flex justify-center items-center flex-col min-h-screen text-gray-600 text-sm font-mono"></div>