create-unstack

# Create Unstack ![npm](https://img.shields.io/npm/v/create-unstack) ![License](https://img.shields.io/npm/l/create-unstack) ![Downloads](https://img.shields.io/npm/dt/create-unstack) ![Node Version](https://img.shields.io/node/v/create-unstack) > 🚀 A modern Next.js application scaffolding tool with TailwindCSS, HeroUI, and configurable authentication & database options. Create Unstack is a streamlined CLI tool that helps you bootstrap complete Next.js applications with a carefully selected tech stack, sensible defaults, and optional features to suit your project needs. ## Features - 🌐 **[Next.js 15+](https://nextjs.org/)** - The latest version of the React framework - 🎨 **[TailwindCSS](https://tailwindcss.com/)** - Utility-first CSS framework with pre-configured design tokens - 🧰 **[HeroUI](https://heroui.org/)** - Modern component library for building beautiful UIs - 🖌️ **[ShadCN](https://ui.shadcn.com/)** - Pre-configured component library for TailwindCSS - 🔒 **[Authentication](https://better-auth.com/)** - Optional Better-Auth integration for secure user management - 🗄️ **[MongoDB](https://www.mongodb.com/)** - Optional MongoDB integration for data storage - ⚡ **[Million.js](https://million.dev/)** - Optional React performance optimization - 🔍 **[ESLint & Prettier](https://eslint.org/)** - Pre-configured with sensible defaults - 📦 **[TypeScript](https://www.typescriptlang.org/)** - Type-safe JavaScript with strict configuration - 🚀 **Fast Start** - Get up and running in seconds, not hours ## Installation You can use Create Unstack without installing it by using npx: ```bash npx create-unstack my-app ``` Or install it globally to use it anywhere: ```bash npm install -g create-unstack create-unstack my-app ``` ## Why? Create Unstack was made because it took me more time than I wanted to setup a new NextJS project with everything I wanted. I always had to delete a lot of things I didn't want, and I always had to add a lot of things I did want. So I decided to make a CLI that would do it for me. The stack used is what I personally use for my projects. I hope you like it! ## Usage ### Basic Usage Simply run the CLI command and follow the interactive prompts: ```bash npx create-unstack my-app ``` ### Command Line Options You can bypass the interactive prompts by using command line flags: ```bash npx create-unstack my-app --db --auth --million ``` Available options: - `--db`: Enable MongoDB integration - `--auth`: Enable Better-Auth authentication - `--million`: Enable Million.js optimization - `--yes`: Use default options without prompts ### Project Structure The generated project follows a clean, modern structure: ``` my-app/ ├── app/ # Next.js App Router │ ├── layout.tsx # Root layout with providers │ ├── page.tsx # Home page │ └── providers.tsx # Client-side providers ├── components/ # Reusable UI components │ └── ui/ # UI components ├── config/ # Configuration files │ ├── fonts.ts # Font definitions │ └── site.ts # Site metadata ├── lib/ # Utility functions and services │ ├── utils.ts # Helper functions │ └── db.ts # MongoDB client (if enabled) ├── styles/ # Global styles │ └── globals.css # TailwindCSS imports and variables ├── .eslintrc.mjs # ESLint configuration ├── .prettierrc # Prettier configuration ├── .gitignore # Git ignore rules ├── next.config.js # Next.js configuration ├── package.json # Dependencies and scripts ├── postcss.config.js # PostCSS configuration ├── tailwind.config.js # TailwindCSS configuration └── tsconfig.json # TypeScript configuration ``` ## Generated Tech Stack The scaffolded application includes: - **Next.js 15+** with App Router and React Server Components - **TailwindCSS 3.4+** with design token variables - **HeroUI** _and_ **ShadCN** setup out of the box for beautiful UI components - **TypeScript** with strict configuration - **ESLint & Prettier** with comprehensive rule sets - **next-themes** for dark/light mode - **Inter & Fira Code fonts** from Google Fonts ### Optional Features When selected, these features are seamlessly integrated: - **MongoDB** - Connection with development mode optimization - **Better-Auth** - Authentication with MongoDB adapter - **Million.js** - Performance optimization for React components ## Why Create Unstack? While there are many starter templates available, Create Unstack offers: 1. **Fine-tuned Tech Selection** - Carefully chosen libraries that work well together 2. **Minimal Boilerplate** - Just enough structure without overwhelming complexity 3. **Optional Features** - Add only what you need 4. **Modern Practices** - Latest patterns and best practices for Next.js development 5. **Developer Experience** - Beautiful CLI, sensible defaults, and clear structure ## Contributing Contributions are welcome! Please feel free to submit a Pull Request. ## License This project is licensed under the MIT License - see the LICENSE file for details. ## Acknowledgments - [Next.js](https://nextjs.org/) - The React Framework - [TailwindCSS](https://tailwindcss.com/) - Utility-first CSS framework - [HeroUI](https://heroui.dev/) - Beautiful UI components - [Better-Auth](https://better-auth.dev/) - Authentication library - [@clack/prompts](https://github.com/natemoo-re/clack) - Beautiful CLI prompts --- Made with ❤️ by [The Untraceable](https://github.com/TheUntraceable)