rsnext/examples/with-tailwindcss
Jordan Pittman 4d4f309301
Update example for Tailwind v3 (#32339)
# Update example for Tailwind v3

I updated the example used by the [official docs](https://tailwindcss.com/docs/guides/nextjs) to reference Tailwind v3 with the necessary changes. I _did not_ update the emotion example because it's using the xwind package which will likely need to be updated first.

## Documentation / Examples

- [x] Make sure the linting passes by running `yarn lint`
2021-12-09 22:42:42 +00:00
..
pages Update example for Tailwind v3 (#32339) 2021-12-09 22:42:42 +00:00
public Bring Tailwind CSS example in line with official Tailwind docs (#19750) 2021-01-25 14:20:14 +01:00
styles Update example for Tailwind v3 (#32339) 2021-12-09 22:42:42 +00:00
.gitignore Added .gitignore to examples that are deployed to vercel (#15127) 2020-07-16 10:52:23 -04:00
package.json Update example for Tailwind v3 (#32339) 2021-12-09 22:42:42 +00:00
postcss.config.js Update tailwind css to v2.1 with jit support (#23793) 2021-04-08 16:52:15 +00:00
README.md Update example for Tailwind v3 (#32339) 2021-12-09 22:42:42 +00:00
tailwind.config.js Update example for Tailwind v3 (#32339) 2021-12-09 22:42:42 +00:00

Next.js + Tailwind CSS Example

This example shows how to use Tailwind CSS (v3.0) with Next.js. It follows the steps outlined in the official Tailwind docs.

Preview

Preview the example live on StackBlitz:

Open in StackBlitz

Deploy your own

Deploy the example using Vercel:

Deploy with Vercel

How to use

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example with-tailwindcss with-tailwindcss-app
# or
yarn create next-app --example with-tailwindcss with-tailwindcss-app

Deploy it to the cloud with Vercel (Documentation).