https://github.com/NikSchaefer/nextjs-boilerplate
☂️ NextJS Boilerplate with TailwindCSS, Typescript, shadcn/ui, and Mixpanel. For CI/CD with Vercel
https://github.com/NikSchaefer/nextjs-boilerplate
eslint google-analytics jest nextjs nextjs-typescript template
Last synced: 7 months ago
JSON representation
☂️ NextJS Boilerplate with TailwindCSS, Typescript, shadcn/ui, and Mixpanel. For CI/CD with Vercel
- Host: GitHub
- URL: https://github.com/NikSchaefer/nextjs-boilerplate
- Owner: NikSchaefer
- Created: 2021-01-05T18:45:53.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2024-04-29T00:52:59.000Z (almost 2 years ago)
- Last Synced: 2024-05-28T17:01:53.887Z (almost 2 years ago)
- Topics: eslint, google-analytics, jest, nextjs, nextjs-typescript, template
- Language: TypeScript
- Homepage: https://nextjs.nikschaefer.com
- Size: 3.59 MB
- Stars: 12
- Watchers: 3
- Forks: 7
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-shadcnui - Github
README
# ☂️ NextJS Boilerplate
This is a NextJS boilerplate that comes with TailwindCSS, Typescript, Prettier,
and Mixpanel, making it easy for you to kickstart your Next.js projects with
modern web development tools and best practices. It also includes Vercel
integration for easy CI/CD setup and uses the shadcn/ui design system.
## Features 🔥
- 🚀 Next.js: A popular React framework for building server-rendered React
applications.
- 🎨 Comprehensive Design System: Built with
[shadcn/ui](https://ui.shadcn.com/), a high quality design system for
building modern web applications.
- 📦 SWR: A React Hooks library for remote data fetching.
- 📂 Lucide: A comprehensive & beautiful icon set with over 1,400 icons.
[lucide](https://lucide.dev)
- 💅 TailwindCSS: A highly customizable CSS framework for building modern user
interfaces.
- 🔍 Typescript: A statically typed superset of JavaScript that provides
better code quality and error checking.
- 🔧 Prettier: An opinionated code formatter that enforces consistent code
style for better code readability.
- 📊 Mixpanel Tracking: Integrated tracking of user interactions and events
for monitoring and analyzing traffic.
- 🌍 Vercel: CI/CD integration with Vercel for seamless deployment and hosting
of Next.js applications.
## Quickstart 🚀
💾 Clone the repository
`git clone https://github.com/NikSchaefer/nextjs-boilerplate.git`
📂 Change directory to the cloned repository
`cd nextjs-boilerplate`
📦 Install dependencies
`npm install`
🏗️ Start the development server:
`npm run dev or yarn dev`
🌐 Open your browser and go to `http://localhost:3000` to see the Next.js app
running locally.
## Deployment 🛠️
This boilerplate is configured to be easily deployed to Vercel. You can deploy
the app to Vercel by following these steps:
1. 🚀 Sign up for a free account on Vercel: `https://vercel.com/signup`
2. 💻 Install the Vercel CLI globally on your machine: `npm install -g vercel`
3. 🔑 Authenticate with your Vercel account: `vercel login`
4. 🌍 Deploy the app: `vercel`
5. 🎉 Follow the prompts to deploy the app to Vercel. Once deployed, you will
receive a unique URL where your app is live.
## Resources 🎨
- [Next.js Documentation](https://nextjs.org/docs)
- [shadcn/ui Documentation](https://ui.shadcn.com/)
- [SWR Documentation](https://swr.vercel.app/)
- [Axios Documentation](https://axios-http.com/docs/intro)
- [TailwindCSS Documentation](https://tailwindcss.com/docs)
- [TypeScript Documentation](https://www.typescriptlang.org/docs/)
- [Prettier Documentation](https://prettier.io/docs/en/)
- [Mixpanel Documentation](https://docs.mixpanel.com/docs/what-is-mixpanel)
- [Vercel Documentation](https://vercel.com/docs)
## Contact 💡
If you have any questions or suggestions regarding this project, or just want to
say hi. You can contact us via the following methods:
- 📧 Email: nikkschaefer@gmail.com
- 🐦 Portfolio: https://nikschaefer.com
- 🌐 GitHub: https://github.com/NikSchaefer
We appreciate your interest and support in this project!
## License 📜
[MIT](https://choosealicense.com/licenses/mit/)