Integrating Tailwind

In order to work with Tailwind, we need to set it up first. Tailwind uses three different dependencies to work correctly:

• tailwindcss: This dependency is Tailwind itself.

• postcss: This package is responsible for transforming styles via JavaScript. For example, it automatically scopes our CSS to avoid global name collision. It also warns us of CSS errors that we would otherwise only notice on the UI in the form of broken styles.

• autoprefixer: This is another peer dependency that is used for adding vendor prefixes for better browser support. For example, we don't have to manually worry about adding support for Firefox or Safari separately— autoprefixer will handle it for us.