🚀 Boilerplate and Starter for Next.js 13+, Tailwind CSS and TypeScript
- 🔐 Auth structure with Context API
- 🔥 Type checking TypeScript
- 💎 Integrate with Tailwind CSS
- 📏 Linter with ESLint (default NextJS, jsx-a11y, TS Eslint, Tailwind CSS)
- 💖 Code Formatter with Prettier
- 🦊 Husky for Git Hooks
- 💡 Absolute Imports using
@
prefix - 👷 Run tests on pull request with GitHub Actions
- 🔔 Send notification for Discord using webhooks
- Node.js 14+ and npm or yarn
Run the following command on your local environment:
git clone --depth=1 https://github.com/ayhan/nextjs-typescript-boilerplate-template-with-auth.git my-project-name
cd my-project-name
yarn
Then, you can run locally in development mode with live reload:
yarn dev
Open http://localhost:3000 with your favorite browser to see your project.
.
├── README.md # README file
├── .github # GitHub folder
├── .husky # Husky configuration
├── .vscode # VSCode configuration
├── public # Public assets folder
├── src
│ ├── constants # Constants
│ ├── context # Context API
│ ├── models # Types
│ ├── pages # Next JS Pages
│ ├── service # Axios instance and fetcher for SWR
│ ├── styles # Styles folder
├── tailwind.config.js # Tailwind CSS configuration
└── tsconfig.json # TypeScript configuration
You can easily configure Next js Boilerplate by making a search in the whole project with FIXME:
for making quick customization. Here is some of the most important files to customize:
src/styles/global.css
: your CSS file using Tailwind CSSsrc/service/instance.ts
: Must add baseURL in axios instance. If you need other axios instance create in this filesrc/context/auth.ts
: Login and userInfo request url change