10 librerías de Javascript y CSS para este abril

Nuestra misión en programacion.net es mantenerte al día con las últimas y más frescas tendencias en el desarrollo web. Es por eso que todos los meses te mostramos una colección cuidadosamente seleccionada, de algunos de los mejores recursos con los que me he topado en Internet y que considero dignos de tu atención. Nuestra lista para este abril de 2017 incluye alucinantes librerías gratuitas, échales un ojo...

Core UI

Basado en Bootstrap 4, Core UI es una plantilla admin que ofrece una solución altamente personalizable para desarrollar intranets. Cuenta con distintas versiones para que puedas integrarla de manera sencilla en algunos de los frameworks más populares del momento, como AngularJS, Angular 2, React.js y Vue.js.

React Trend

Un componente de React creado por el Unsplash team que puede ser utilizado para crear gráficos de líneas elegantes que te puede servir para mostrar tendencias y métricas de actividad. Este proyecto tiene un rollo minimalista y te brinda una solución sencilla y pulida a un problema específico. Así que no esperes una librería completa para gráficas. También existe un port no oficial para Vue que puedes descargar aquí.

Element

Element es un framework UI basado en Vue.js 2.0. Incluye un conjunto de más de 50 componentes que están personalizados de manera consistente, siguiendo ciertas nociones de diseño y de color. Cada uno de los elementos cuenta con una documentación detallada y son súper fáciles de personalizar e implementar en cualquier proyecto Vue.js.

BigPicture

Lightbox moderno que funciona tanto para imágenes, como para vídeos, proporcionándote pop-ups con animaciones increíbles y suaves. Una característica impresionante de BigPicture es que funciona tanto con los tags <img> como con los elementos que cuentan con un background-image, dándole libertad a los desarrolladores para construir sus sitios web como ellos quieran. En cuanto al vídeo, cuenta con soporte para YouTube, Vimeo...

Reactive Listener

No dejes que su nombre te engañe, no es un componente de React. Reactive Listener es una librería creada por Zurb que te permite crear detectores de eventos avanzados que responden a acciones más complejas que simples clicks y hovers. Es capaz de reconocer cuando el usuario se mueve cerca de un elemento, por ejemplo, pero en futuro seguro que añaden detectores mucho más chulos.

Eagle.js

Eagle.js es un framework para Vue.js que es ideal para crear slideshows, es decir, muy parecido a Reveal.js. Soporta animaciones, themes, widgets interactivos y hace que el hecho de reusar componentes, slides y estilos sea coser y cantar en tus slideshows.

Pushy Buttons

Una pequeña librería de CSS que te permite crear botones, los cuales da “gustico” pulsar gracias a una animación super currada. Los botones cuentan con 4 tamaños distintos y puedes seleccionar 3 colores. Tranquilo, puedes personalizar todo esto vía SASS o simplemente, modificando el archivo .css que te proporciona la librería.

MoveTo

No puede faltar un mes de compilaciones de librerías de Javascript y CSS sin que incluyamos una para hacer scroll mediante un clic. Este mes te presentamos a MoveTo, una librería de Javascript sin depencias que solo pesa 1kb comprimida, súper sencilla de utilizar y, por si fuera poco, utiliza la API nativa window.scroll para llevar a cabo las animaciones.

Anchorme

Anchorme es una potente librería de Javascript que coge cualquier cadena o archivo de texto y detecta todos las URLs que hay en su interior. Es rápida, de confianza y cuenta con un montón de opciones de personalización. Puedes utilizarla para convertir URLs en enlaces clicables con el tag de HTML <a>, para extraer todas las URLs del contenido de un correo electrónico, para validar IPs.

RPG Awesome

Fuente gratuita de iconos con cerca de más de 500 iconos vectoriales con temática fantástica. Lo cubre todo, desde armas y armaduras, hasta magia y los típicos elementos del inventario de un juego RPG. Lo bueno de esta fuente de iconos es que puede utilizarse como cualquier otra fuente de iconos (<i class="ra ra-sword"></i>) y puedes personalizarla vía CSS o SASS.

Fuente: tutorialzine.com