Why Next.js?
It’s one of the best React frameworks supported by the huge React community.

Why Tailwind CSS?
Because it’s the simplest and most modern way to structure CSS classes for your components and layouts.

Why PurgeCSS?
Because you will need to keep your compiled Tailwind CSS file light and tiny.

The Setup Process
Let’s start with an empty Next.js project or just open up your already-set-up project:

npx create-next-app

or if you use yarn

yarn create next-app
2. Then we will add Tailwind and PurgeCSS.

“PurgeCSS reduces the file size by scanning your HTML and removing any classes that aren’t used. We only want this in production because if we are developing, we want to be able to use any Tailwind CSS class without running the build process.” — Jake Prins on Medium
npm install tailwindcss
npm install -D @fullhuman/postcss-purgecss

or if you use yarn

yarn add tailwindcss
yarn add -D @fullhuman/postcss-purgecss
3. Launch this command to create a tailwind.config.js in the project:

npx tailwind init

#javascript #react #reactjs #nextjs #tailwind css