14 de diciembre de 2024
NachUI
Mi sistema de diseño y kit de componentes de código abierto para el ecosistema React.
Publicado por:
figueroaignacioDesarrollador Fullstack & Estudiante de Programación
Así nació NachUI:
Un sistema de diseño para React creado enteramente desde cero con su propia visión. Aunque comparte el contexto de la escena actual de herramientas distribuidas por CLI y librerías sin estilos (como shadcn/ui, Base UI, Radix UI y Hero UI), se construyó sin wrappers, sin dependencias de primitivas externas y con total propiedad del desarrollador. Se creó con Tailwind + Framer Motion y se pensó específicamente para React y Next.js.
Un sistema de diseño para React creado enteramente desde cero con su propia visión. Aunque comparte el contexto de la escena actual de herramientas distribuidas por CLI y librerías sin estilos (como shadcn/ui, Base UI, Radix UI y Hero UI), se construyó sin wrappers, sin dependencias de primitivas externas y con total propiedad del desarrollador. Se creó con Tailwind + Framer Motion y se pensó específicamente para React y Next.js.
No es una librería.
No es un paquete de npm.
No es magia.
No es un paquete de npm.
No es magia.
Es código real. Para copiar, pegar, modificar y hacer tuyo.
¿Qué hace diferente a NachUI?
Propiedad Total
Acá no instalás nada ni dependés de cajas negras.
Cada componente vive dentro de tu código.
Lo ves, lo tocás, lo editás.
Cada componente vive dentro de tu código.
Lo ves, lo tocás, lo editás.
Si algo no te convence, lo cambiás sin pelearte con las abstracciones de otros.
Un Diseño Unificado
Todos los componentes comparten el mismo lenguaje visual y técnico:
- APIs consistentes
- estilos coherentes
- patrones previsibles
Nada de mezclar piezas que no se llevan bien entre sí.
Copiar, pegar y a construir
Usa herramientas que todos manejamos:
- clsx
- class-variance-authority
- tailwind-merge
Integrarlo es tan simple como copiar un archivo y empezar a usarlo.
Una Estructura que Escala
Los componentes están organizados para crecer con tu proyecto:
ordenados, modularizados y pensados para convivir entre sí sin fricción.
ordenados, modularizados y pensados para convivir entre sí sin fricción.
Animaciones listas con Framer Motion
Cada componente viene con animaciones cuidadas: suaves, elegantes y performantes.
Construido por una Persona, Propiedad Tuya
NachUI fue construido desde cero por un solo desarrollador. No hay financiamiento de capital de riesgo (VC), ni comités corporativos, ni planes con exceso de funcionalidades. Cada decisión arquitectónica es consistente porque fue diseñada por una sola persona. El código es tuyo para usarlo, editarlo y mantenerlo.
Nativo para IA
El código está escrito de forma clara y consistente, ideal para que cualquier herramienta de IA pueda:
- generar variaciones,
- sugerir mejoras,
- o crear nuevos componentes siguiendo el mismo sistema.
¿Por qué lo hice?
Primero, por diversión.
Segundo, Porque estaba cansado de reinventar botones, modales y layouts desde cero.
Tercero, Porque quería velocidad, coherencia y una identidad visual propia.
Y por ultimo, porque prefiero un sistema que controlo yo, antes que depender de un paquete más en npm.
NachUI es mi forma de crear un sistema de diseño real, flexible, accesible y totalmente abierto.
Si te interesa ver el progreso, dar feedback o colaborar, sos más que bienvenido.
Esto recién empieza. ✨
Esto recién empieza. ✨