🚀 create-sackapp

Un generador de aplicaciones Vite + React + TailwindCSS + shadcn/ui ⚡ creado por Sack.
Configura en segundos un proyecto frontend moderno, interactivo y personalizable.

Ideal si quieres iniciar rápido sin perder tiempo en configuraciones repetitivas.
El CLI te hace preguntas interactivas para elegir el nombre de tu app y qué librerías extra quieres instalar, asegurando que siempre tengas una base sólida y lista para producción.

✨ Características principales

• 🛠 Vite + React como base ultrarrápida.
• 🎨 TailwindCSS con configuración lista (dark mode incluido).
• 🧩 shadcn/ui inicializado con componentes de diseño moderno.
• 🔌 Alias @/ configurado en Vite y TypeScript para imports limpios.
• ✅ Instalación opcional de librerías extra con un selector interactivo.

📦 Instalación

Con npm (recomendado):

npm create sackapp@latest

Con npx:

npx create-sackapp

🖥 Uso

Ejecuta el comando y responde las preguntas:

npx create-sackapp

1. Ingresa el nombre de tu aplicación.
2. Selecciona las librerías extras que quieras añadir.
3. Deja que el CLI haga la magia ✨.

Al terminar:

cd mi-app
npm run dev

📚 Librerías disponibles por defecto

Además de Vite + React + TailwindCSS + shadcn/ui, puedes elegir instalar estas librerías:

• ⚡ axios Cliente HTTP minimalista y poderoso para hacer peticiones a APIs. Soporta interceptores, cancelación de requests y configuración global de headers. Ideal para consumir backends REST o GraphQL.

• 🐻 zustand Librería de manejo de estado global extremadamente simple pero muy escalable. Usa una API basada en hooks y evita la complejidad de Redux. Perfecta para proyectos medianos y grandes.

• 🍭 SweetAlert2 Librería de modales y alertas personalizables y modernas. Reemplaza los alert() y confirm() nativos con interfaces más atractivas, accesibles y fáciles de integrar.

• 🪝 useHooks (@uidotdev/usehooks) Colección de hooks reutilizables para React. Incluye hooks para manejar eventos de teclado, scroll, media queries, intervalos, y muchos otros patrones comunes sin necesidad de reescribir lógica.

• 🧭 react-router-dom Librería oficial de enrutamiento para React. Permite crear SPA (Single Page Applications) con navegación entre páginas, rutas anidadas, parámetros dinámicos y loaders para datos.

🛠 Estructura generada

Ejemplo de estructura inicial creada por el CLI:

mi-app/
├── src/
│   ├── App.jsx
│   ├── index.css
│   └── main.jsx
├── vite.config.js
├── tailwind.config.js
├── tsconfig.json
├── package.json
└── ...

💡 Ejemplo rápido

npx create-sackapp
# App name: mi-dashboard
# Extra deps: [axios, zustand, react-router-dom]

cd mi-dashboard
npm run dev

Ya tendrás un proyecto con:

• Axios configurado para consumir APIs
• Zustand para manejar el estado global
• React Router listo para definir tus rutas
• Tailwind + shadcn para el diseño de la UI

🔥 Autor

Hecho con 💻 y ☕ por Sack. Si te gusta este proyecto, deja una ⭐ en GitHub o compártelo con tu equipo.