DEV Community

Cover image for 6 librerías ideales para el desarrollo Front-End
GabrielOmar
GabrielOmar

Posted on

6 librerías ideales para el desarrollo Front-End

Existe gran cantidad de librerías para el desarrollo Front-End, de hecho el proceso de publicar una librería personalizada básica es bastante rápido.

En este artículo hablaremos de 7 librerías que nos ayudarán en más de una ocasión.

Moment.js

Esta librería es muy popular entre los desarrolladores ya que nos facilita la tarea de manipular fechas en cualquier formato que necesitemos. Ya sea YYYY/MM/DD, YYYY/MM o cualquier formato en el que necesitemos la fecha, Moment se encargará de esto de forma fácil y rápida.

Este es un pequeño ejemplo de como se usa Moment.js

moment().format('MMMM Do YYYY, h:mm:ss a'); 
// January 5th 2021, 7:31:27 pm
Enter fullscreen mode Exit fullscreen mode

GreenSock

Ya sea si eres freelancer o trabajas para una empresa, en algún momento requerirás hacer animaciones y si bien puedes usar CSS para lograrlo, GreenSock es una alternativa bastante viable que nos permite usar animaciones increíbles y que dan muy buen aspecto al UI de la aplicación. El uso de esta librería es bastante sencillo y nos ofrece resultados muy buenos. Conoce más la libreria.

gsap.to(graph, { duration: 2.5, ease: "power4.out", y: -500 }); 
Enter fullscreen mode Exit fullscreen mode

Draggable.js

Esta librería me gusta bastante por la gran versatilidad que tiene. Nos permite trabajar con objetos arrastrables tal cual su nombre lo indica. Ya sean listas, cajas, filas o incluso pequeños puzzle que podemos utilizar. Conoce más la libreria.

Chart.js

Chart.js es una librería que nunca podría faltar en los sistemas de control, ya sea un dashboard, un crm u otro sistema que tiene el mismo fin, manejar información y comparar datos. Con esta librería podremos generar gráficos dinámicos con gran facilidad e incluso podemos adaptarlas a un Socket para que la información llegue en tiempo real sin necesidad de actualizar la página. Conoce más la libreria.

var myBarChart = new Chart(ctx, {
    type: 'bar',
    data: data,
    options: options
});

Enter fullscreen mode Exit fullscreen mode

Redux

El ya conocido Redux es sin duda el manejador de estados más popular del mercado, esta librería nos permite emitir actualizaciones de estado en respuesta a acciones. Algo importante es que, estas modificaciones podrás hacerlas a través de objetos sencillos o acciones, y no a través de cambios directos en el estado. Conoce más la libreria.

Iconate

Iconate nos permitirá hacer cientos de variaciones para personalizar los íconos de nuestra aplicación. Por ejemplo, podrás hacer que tu ícono de barra se convierta en una fecha y rote al momento de hacer la transmisión. Conoce más la libreria.

var iconElement = document.getElementById('icon');
var options = {
    from: 'fa-bars',
    to: 'fa-arrow-right',
    animation: 'rubberBand'
};

iconate(iconElement, options);
Enter fullscreen mode Exit fullscreen mode

Existen muchas más librerías, deja tu favorita en los comentarios para que todos podamos conocerla :)

Top comments (1)

Collapse
 
aresinodev profile image
Aarón Resino Jiménez

En el caso de moment es la más utilizada para trabajar con fechas, pero me quedo con date-fns que es similar y pesa bastante menos que moment.js 😉