uploaderkit
Capa de subida de archivos full-stack para React y Node con contrato compartido cliente/servidor, hook headless y providers GCS/S3.
Contexto
uploaderkit (@pibytelabs/uploaderkit) nació de repetir la misma lógica de subida de archivos en cada proyecto: validación de tipo y tamaño, compresión de imágenes, reintentos, progreso y la firma de URLs contra el backend. La librería empaqueta todo ese flujo detrás de un contrato compartido entre cliente y servidor.
Arquitectura
Monorepo pnpm con el paquete publicable y un playground para desarrollo. El núcleo es un contrato declarativo de scopes (qué se puede subir, a dónde y con qué restricciones) que se define una vez y se comparte entre el hook de React y los adaptadores de servidor. El código se organiza en client/ (hook headless), server/ (adaptadores Express y Next.js), providers/ (GCS, S3) y crypto/ (cifrado AES-256-GCM). Se compila a ESM + CJS + .d.ts con subpath exports tree-shakeables.
Stack y API
defineUploadScopes() describe los scopes de subida; useUploader() consume ese contrato desde React y el adaptador de servidor lo valida del otro lado:
import { useUploader } from "@pibytelabs/uploaderkit";
const { upload, progress, abort } = useUploader({ scope: "avatars" });
await upload(file); // valida, comprime, sube con retry y reporta progresoCaracterísticas clave:
- Contrato compartido cliente/servidor con scopes declarativos.
- Hook headless con validación por magic numbers (no solo por extensión/MIME declarado).
- Compresión de imágenes en cliente antes de subir.
- Retry con backoff y abort en cualquier momento.
- Providers para Google Cloud Storage y AWS S3.
- Cifrado AES-256-GCM para archivos sensibles.
- Adaptadores para Express y Next.js, e i18n EN/ES.
Retos técnicos
- Validar el contenido real del archivo en el navegador leyendo sus magic numbers, sin depender del MIME que reporta el sistema operativo.
- Mantener el hook completamente headless para que cualquier UI (propia o de terceros) pueda montarse encima sin pelear con estilos.
- Cifrar archivos en cliente con AES-256-GCM sin bloquear el hilo principal en archivos grandes.
Resultado
Una librería tipada y reutilizable (MIT) que estandariza la subida de archivos en los proyectos del ecosistema @pibytelabs. Publicada en npm. Código en GitHub.