Desarrollador Full Stack especializado en JavaScript, React, Node.js. Creador de Flashy.js, librería moderna de notificaciones para web.
La librería de notificaciones JavaScript más moderna y personalizable del universo. Sin dependencias, puro rendimiento 🚀
Librería JavaScript notificaciones, toast messages, alerts modernos, frontend development, Pablo Martínez desarrollador full stack
Características que hacen de Flashy.js la mejor librería de notificaciones
Solo ~8KB. Más liviano que tus preocupaciones después de usarlo.
Temas, posiciones, animaciones y más opciones bajo tu control.
Se adapta perfectamente a desktop, tablet y móvil.
Elige tu método favorito para integrar Flashy.js en tu proyecto
<script src="https://unpkg.com/@pablotheblink/flashyjs@1.0.5/flashy.js"></script>
<script>
flashy('¡Hola mundo!', 'success');
</script>
npm install @pablotheblink/flashyjsimport flashy from '@pablotheblink/flashyjs';
flashy('¡Instalado correctamente!', 'success');Para proyectos que requieren archivos locales
Explora las diferentes funcionalidades con ejemplos en vivo
// Diferentes formas de usar los tipos
flashy.success('¡Operación exitosa!');
flashy.error('Algo salió mal');
flashy.warning('Ten cuidado');
flashy.info('Información útil');
// O usando el método principal
flashy('Mensaje', 'success');
flashy('Mensaje', { type: 'error' });flashy('Mensaje', {
position: 'top-left' // top-left, top-center, top-right
}); // bottom-left, bottom-center, bottom-rightflashy('Mensaje', {
animation: 'bounce' // slide, fade, bounce, zoom
});flashy('Mensaje', {
theme: 'dark' // light, dark
});Referencia técnica completa para desarrolladores
message
(string, required)
El texto de la notificación
options
(object|string, optional)
Configuración o tipo de notificación
function
Función para cerrar la notificación manualmente
| Opción | Tipo | Por defecto | Descripción |
|---|---|---|---|
type |
string | success, error, warning, info, default | |
position |
string | top-left, top-center, top-right, bottom-left, bottom-center, bottom-right | |
duration |
number | Duración en ms (0 = permanente) | |
closable |
boolean | Mostrar botón de cerrar | |
animation |
string | slide, fade, bounce, zoom | |
theme |
string | light, dark | |
icon |
string | Icono personalizado (HTML/emoji) | |
onClick |
function | Callback al hacer clic | |
onClose |
function | Callback al cerrar |
flashy.success(message, options)
flashy.error(message, options)
flashy.warning(message, options)
flashy.info(message, options)flashy.setDefaults({
duration: 5000,
position: 'bottom-right'
});
flashy.getDefaults();// Cerrar todas
flashy.closeAll();
// Cerrar específica
const close = flashy('Mensaje');
close();// Limpiar todo
flashy.destroy();Crea tu notificación perfecta como un científico loco
flashy('¡Tu notificación con superpoderes!', 'success');flashy('¡Tu notificación con superpoderes!', {
type: 'success',
position: 'top-right',
duration: 4000,
closable: true,
animation: 'slide',
theme: 'light'
});flashy('¡Tu notificación con superpoderes!', {
type: 'success',
position: 'top-right',
duration: 4000,
onClick: () => {
console.log('Notificación clickeada');
},
onClose: () => {
console.log('Notificación cerrada');
}
});Desarrolladores de todo el mundo ya están usando FlashyJS. Lee sus opiniones y experiencias.
Frontend Developer | Next.js | React
"La documentación es clara: copié y pegué y de inmediato funcionó."
Full Stack Developer | Python | Angular
"No tienes idea cuánto he buscado una funcional, gracias"
Full-Stack Web Developer | Node.js
"Lo he probado y está muy bueno. Las animaciones son sencillas y responden muy bien."
Full Stack Developer | PHP, Laravel, C#
"Excelente, muy buena documentación"
Full Stack Developer | PHP | Laravel | React
"Me gusta muy fácil de implementar."
Backend Developer | NestJS | Express
"Con el ejemplo queda claro, un puntazo! 8KB!"
"Se ve bien. Estaba buscando algo así"
Luis Beroíza
Ingeniero Jefe de Software
"Está super! Felicidades por el lanzamiento."
Ricardo Arana-Reyes
Frontend Software Engineer
"La probé y súper bien, muy fácil de usar"
Carlos Acosta Nieto
Ingeniero Full Stack
"Justo lo que buscaba, gracias."
José Luis Quispe
Angular, NestJs Developer
"Buenísima, me encantó."
Oscar Esteban Loaiza
Ingeniero Multimedia
"Muy buena! 👌 gracias por el aporte crack!"
Paul Uzcategui
Desarrollador Full Stack
"Entre esa y GASP uffffff se hace magia."
Oscar Bobadilla
Creative & Web Developer
"Perfecto para lo que estoy aprendiendo, gracias!"
Olga Betancourt
Full Stack Developer Junior
"Buenisima!! La voy a usar en algún proyecto!"
Agustina Mena
Full Stack Developer
Descubre TikToks, videos de YouTube, tutoriales y contenido creado por desarrolladores que usan Flashy.js
Estamos preparando una sección increíble con el mejor contenido de la comunidad:
Videos cortos y tutoriales
Tutoriales en profundidad
Artículos y guías
Proyectos en vivo
¡Queremos destacar tu trabajo! Compártelo con nosotros.
Video destacado #1
Próximamente
Tutorial completo
Próximamente
TikTok viral
Próximamente
Ayúdanos a hacer Flashy.js aún más épico de lo que ya es
Si encontraste un bug o tienes una idea genial, no te quedes callado. Cuéntanos todo en GitHub.
Reportar o Sugerir 🚨¡Las contribuciones son súper bienvenidas! Échale un vistazo a nuestra guía y vamos a construir algo increíble juntos.
Guía de Contribución 📖Desarrollador Full Stack con un poquito de locura 🤪 por crear herramientas que hagan que los usuarios digan "¡WOW!" Creé Flashy.js porque las notificaciones aburridas me dan sueño 😴 y quería algo que hiciera bailar a las pantallas 💃
Si este proyecto te ha robado el corazón ❤️ (y algunos cafés ☕), considera invitarme a una pizza 🍕 para seguir creando cositas geniales
Tu apoyo me ayuda a seguir desarrollando herramientas útiles y gratuitas para la comunidad
