taylorbryant / next-starter-tailwind Goto Github PK

Use husky and lint-staged to automatically run Prettier and ESLint on newly committed files.

Make the starter less barebones and provide the user with some more fleshed out page examples

Hello,
im trying to get the project running but when i run the dev env with npm run dev i get the following error:

error - ./css/index.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-6-1!./node_modules/next/dist/compiled/postcss-loader/cjs.js??ref--5-oneOf-6-2!./css/index.css)
TypeError: Object.entries(...).flatMap is not a function
    at Array.forEach (<anonymous>)

I would like to add a getting startet section to the readme but i cant get it setup myself...

Thank you!

Add a layout HOC with options for:

• No sidebar
• Two sidebars
• Left sidebar
• Right sidebar

I came across this CLI: https://github.com/avencera/rustywind for organizing Tailwind CSS classes. It may be worth exploring using this to sort classes on newly committed code.

Add a netlify.toml file that lists out the build command and output directory required to use this starter

Hey, reader! 👋 I’ve been thinking a lot lately about where I want to go with this starter in the future. I initially created the starter, because I wasn’t satisfied with the example in the Next.js repository. Over the past year, contributions from myself and other people have made the example more or less in line with what I provide in this starter.

So... now I’m working what I can add to this starter that would add value past what’s already in the with-tailwindcss example in the Next.js repo.

Here’s some ideas I have:

• Add fully fleshed-out example pages like:
  • A landing page for a SaaS app
  • A landing page for a brick-and-mortar business
  • An app dashboard
  • A sign-in page for a SaaS app
  • An edit profile page for a SaaS app
  • A sign-up page for a SaaS app
• Add Prettier with the default settings
• Add documentation on how to use the starter with Tailwind UI
• Add ESLint with the following plugins:
  • eslint-plugin-import
  • eslint-plugin-react
  • eslint-plugin-react-hooks
  • eslint-plugin-prettier
• Add husky and lint-staged and do the following on every commit:
  • Fix linting errors
  • Format using Prettier
  • Sort Tailwind CSS classes using rustywind
  • Sort imports using import-sort

Some questions I have for you:

1. Do you think baking in opinions like these would be useful to you when starting a new project that uses Tailwind CSS and Next.js?
2. What ideas seem good to you? Which ones seem bad?
3. What’s something you might find useful in this starter that’s missing?
4. What kind of examples would you like to see added?

Thanks for your time! 👍🏻

Hi Taylor!

Love this starter kit. Would you also consider adding a next+tailwind+emotion starter?

Let me know what you think! :)

Add pages showing examples of UI built with Tailwind.

https://github.com/tailwindcss/tailwindcss/releases/tag/v1.4.0