15 plugins y librerías Frontend que deberías conocer

El mundo del desarrollo web se mantiene en expansión continua con nuevos frameworks, librerías y plugins. Para que te mantengas al día con todos los divertidos juguetes que van saliendo, hemos hecho una colección de nuestras librerías y herramientas de JavaScript y CSS favoritas de esta semana santa de 2016.

Hamburgers

Hamburgers es una colección de unos 20 botones de menú estilo hamburguesa. Todos ellos cuentan con animaciones únicas y muy trabajadas, desarrolladas en CSS puro y con garantía de que se ejecutarán con suavidad. También hay disponible una versión en Sass para todos aquellos que usen preprocesadores en sus proyectos.

Loaders

Un gran recurso que contiene una gran selección de loaders desarrollados en CSS puro, muy bien diseñados. Añadirlos en tu proyecto web o aplicación web es lo pan comido, quizá lo más difícil de todo es elegir el que más te guste (nuestro favorito es el Pacman)

Grd

Grd, como su propio nombre indica, trata sobre implementar layouts de grid. La librería está hecha en CSS puro, utiliza las propiedades del modelo flexbox y ofrece solo las características útiles y necesarias. Todo estos factores confluyen en un framework muy ligero, solo 512 bytes comprimido.

Superplaceholder

Con Suplerplaceholder puedes añadir uno o los mensajes que desees como placeholders de tus campos inputs. La librería mostrará dichos mensajes mediante una animación muy chula, haciendo el efecto de como si alguien lo estuviese escribiendo. Gracias a la cantidad de opciones de personalización, tendrás el control total sobre cómo se muestran esos placeholders.

Slick

Slick es probablemente el plugin para carruseles más complejo y rico en características que hemos visto en la red. Imagina manipular cada configuración que se te venga a la cabeza, pero de un modo sencillo y amigable. Ok, ¿lo tienes? Pues eso es Slick.

A-frame

Esta librería del futuro te permite crear experiencias de realidad virtual utilizando solo buenas y antiguas tecnologías web. Después de haber creado tu mundo 3D en HTML, A-frame lo cogerá y lo dividirá en dos pantallas con diferentes angulos. Ahora, puedes ejecutar la demo en teléfonos móviles que soporten la realidad virtual utilizando las Google CardBoard u otros dispositivos para ello.

Lavalamp

El scroll infinito es una característica infame de las nuevas tendencias de la tecnología web tanto para usuarios como para desarrolladores. A menudo es difícil de implementar y frustrante cuando no funciona bien. Lavalamp es un plugin JS que ofrece una gran alternativa al scroll infinito. En vez de cargar automáticamente nuevo contenido, puedes añadir botones en la parte superior e inferior de la página para cargar elemento próximos o anteriores.

Drift

Drift es una librería Javascript open source para añadir un hover de zoom y dotar de un aspecto más cool a las imágenes de tu web. Es soportado por múltiples navegadores, no depende de proyectos de terceros y es, relativamente, fácil de implementar.

Progress.js

Con esta librería puedes añadir barras de progreso a cualquier elemento HTML que quieras, incluyendo algunos tan difíciles como los campos inputs, las imágenes o los vídeos. Puedes modificar cualquier aspecto de las barras mediante las opciones que te otorga la librería, o bien a través de los estilos de CSS.

Min

En solo 995 bytes, Min es uno de los frameworks CSS más compactos del mundo. En este pequeño paquet, Min contiene un clásico grid de doce columnas, un buen número de componentes y es soportado por muchísimos navegadores.

Okaynav

Esta librería de Javascript y CSS es un soplo de aire fresco en cuanto a menús de navegación responsive se refiere. En lugar de crear una barra que se muestre a ancho completo en ordenadores y que se colapse en móviles, Okaynav trata de encajar tantos elementos de navegación como sea posible en el tamaño actual del navegador.

Pintsize

Una librería CSS para construir layouts de grid avanzados. Con Pintsize tienes la opción de crear tanto grids como los de Bootstrap como grids como los de Flexbox para adaptarlos al tamaño del contenido. La página web del proyecto cuenta con una sección con buenos ejemplos incluyendo el soporte para navegadores y snippets de código

Velocity

Velocity es un motor de animaciones de JS que combina la popular API de jQuery anímate() con animaciones de CSS puras que te proveen de animaciones rápidas, reutilizables y fáciles de utilizar. Si eres de los que utilizas jQuery sólo para animar elementos, puedes pasarte a Velocity para un mejor rendimiento

Balloon.css

Esta libreria CSS permite a los desarrolladores agregar tooltips a elementos en la página sin incluir una sola línea de código JavaScript. Mediante la adición de los atributos de datos para el código HTML puedes especificar el contenido a mostrar, la dirección del pop-up y otras opciones de personalización.

Fuente: tutorialzine.com

 

COMPARTE ESTE ARTÍCULO

COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN LINKEDIN
COMPARTIR EN WHATSAPP
SIGUIENTE ARTÍCULO