This is a Next JS (Typescript) + Tailwind CSS personalized template. Live demo can be accessed at nexttw-starter.yehezgun.com. Actually, I made this for myself so I don't need to waste my time overthinking about the config and setup and focusing on the development.
But if you also find this template is useful, you also can use it. And of course, I'm open to any feedback. You can fork or clone this repo and make a PR here if you have some idea.
- Toolings for linting, formatting, and conventions configured.
eslint
,prettier
,husky
, &lint-staged.
- The ESLint config is bundled in
eslint-config-yehezgun
- ✨Basic responsive layout configuration (using Chakra UI media query)
- 📜Basic
standard-version
to generate Changelog, you can runnpx standard-version --skip.bump --skip.commit --skip.tag
- SEO Optimization (using next-SEO)
- Now using Next.js 12 with Rust Compiler Minification enabled (you can disable it at next.config.js)
- You can open nexttw-starter.yehezgun.com and click `Use this template button (Don't forget to log in to your Github account).
- Or you can clone this repo using
degit
in your terminal. Don't forget to install the needed dependencies usingnpm install
oryarn
.
npx degit yehezkielgunawan/yehez-nexttailwind-starter <YOUR_APP_NAME>
- Or you also can easily use this template by running:
npx create-next-app --example https://github.com/yehezkielgunawan/yehez-nexttailwind-starter <YOUR_APP_NAME>
-
Then run the local server using
yarn dev
ornpm run dev
-
One important thing to do is to look at unit tests and run it by using
yarn test
and/oryarn test:ci
! This is useful when you want to try looking at the coverage and to understand the integration tests.
- Tailwind CSS Official Docs
- https://github.com/theodorusclarence/ts-nextjs-tailwind-starter - Theodorus Clarence's Next-Tailwind Template as my main reference