4

10 plugins jQuery que deberías conocer

1330Puntos

hace 8 años

Para agilizar el proceso de desarrollo de nuestra aplicación puede ser muy útil usar plugins hechos con la librería JavaScript jQuery, para así enfocarnos en otros aspectos que a veces dejamos de lado. Desde que apareció jQuery, el trabajo del front-end se resaltó más, así mismo los desarrolladores activos en la comunidad de JavaScript tuvieron la idea de apoyarse entre sí creando plugins para que se puedan usar en los diferentes proyectos que demanda el mercado. Con esta tendencia se inicio una nueva era: la de los grandes aportes no solo con jQuery sino con muchos lenguajes de programación y librerías dándole un valor profesional al uso de estas tecnologías. Existe una gran cantidad de plugins jQuery en Internet, a continuación te dejaré una lista con algunos que te serán quizás indispensables.

1. AgeCheck.js

Si tienes en tu proyecto contenido solo para mayores de edad, con este plugin puedes dar permiso para que solo los puedan ver los que cumplan una edad mínima. 3_edit_a Para usar el plugin debes dirigirte al siguiente enlace. Con este plugin estás cuidando menores de edad que están expuestos constantemente a contenido inapropiado en la internet.

2. Monthly.js

Este plugin muestra un calendario con los días del mes. Si tienes un evento un determinado día lo puedes publicar y hacerlo “linkeable” para permitir que los usuarios vean más detalles del evento. 3_edit_b Si una organización hace muchos eventos, este plugin puede ayudarla a compartir esta agenda con sus usuarios. Si deseas saber cómo se usa y las funciones que tiene, solo dirígete al siguiente enlace.

3. TableExport.js

Este plugin te permite exportar dinámicamente las tablas HTML a hojas de cálculo Excel .xls o .xlsx, valores separados por comas .csv y texto sin formato en una sola línea de código .txt. c Para usarlo necesitas tener la librería FileSaver.js y jQuery 1.2.1 o más. Si quieres saber más detalles solo dirígete al siguiente enlace.

4. Daily Messages

Inspirado en la plataforma de comunicación Basecamp, Daily Messages te permite mostrar mensajes personalizados para cada día de la semana. d Para hacernos una idea, imagina que el día domingo tienes pensado mostrar un saludo por el día de la madre o sea cual sea la festividad; con este plugin puedes mostrar un mensaje y así darle más vida a tu proyecto web. Para definir los mensajes creamos la siguiente estructura:

<pre class=“EnlighterJSRAW”>$(’.mensaje-diario’).dailyMessages({
monday: “Hoy es Lunes dia del Arepa!”,
tuesday: "Hoy es Martes, dia del Taco! ",
wednesday: “Hoy es Miercoles dia del Ceviche!”,
thursday: “Hoy es Jueves dia del Asado!”,
friday: “Hoy es Viernes pasa un genial fin de semana!”,
saturday: “Hoy es Sabado como lo estas pasado?”,
sunday: “Ho es Domingo y celebramos el dia de la Madre”,
success: function() {
console.log(‘Funciona!’);
},
error: function(message) {
console.log(message);
$(this).remove();
}
});</pre>

Luego creas una capa para imprimir los saludos:Si dejas vacío y sin texto un día de la semana, va mostrar vacío por defecto. Para descargar y usar el plugin ve a este enlace.

5. Droparea

Este plugin puede ayudar al usuario a tener una mejor experiencia a la hora de subir sus archivos: es el popular Drag and Drop, con el cual puedes subir un archivo con solo arrastrarlo al contenedor. edit_e Para ver la demo y toda la documentación ve al siguiente enlace y dale una funcionalidad llamativa a la subida de tus archivos.

6. jQuery contextMenu

Este plugin le agrega un menú de opciones a cualquier elemento de tu proyecto, como puedes ver en la imagen. Si estás haciendo un CRUD (Create, Read, Update and Delete, o en español, Crear, Leer, Actualizar y Borrar) puedes agregar las opciones de editar, eliminar, etc. También puedes agregar al menú las opciones que desees. f Para conocer más de este interesante plugin debes dirigirte al siguiente enlace.

7. Previewer

Si tienes en mente vender un producto digital, recuerda que se tiene que visualizar correctamente en todos los dispositivos, tanto móviles como de escritorio. Por ello con este plugin le puedes ofrecer al usuario una vista previa de cómo se vería tu producto en todos los dispositivos: móvil, tablet/iPad, Laptop,MacbookPro y PC/iMac. g Esto ayuda a generar una buena experiencia para usuario y aumenta las probabilidades que compren tu producto digital. Para saber más de este plugin dirígete al siguiente enlace.

8. Section Scroll

Nos ayuda a mostrar nuestra página con botones de navegación al costado; es una nueva manera de mostrar nuestro contenido en una sola página. h

9. Pagination.js

Se trata de muy buen plugin para paginar nuestros contenidos y darles una mejor experiencia a los usuarios; podemos usar la versión completa pagination.js o la versión mínima pagination.min.js. i En SEO si tienes una gran cantidad de registros en tu base de datos, no es muy bueno que tu página muestre muchos registros a la vez, ya que tardaría mucho en cargar y un factor importante para posicionar tu proyecto es que tu página cargue muy rápido, entonces puedes usar este plugin para paginar los registros desde tu base de datos y así mostrar cierta cantidad de registros por página y obtener más velocidad de carga. Puedes leer más sobre este plugin en el siguiente enlace. Sobre el mismo tema: Historias de Horror SEO por Aleyda Solís [Vídeo]

10. LoadGo

Este plugin nos ayuda a mostrar una imagen en vez del típico texto “cargando”, tiene soporte para transparencia con las imágenes en formato PNG, para poder rellenar los espacios con el color que quieras y otras funcionalidades. j Para conocer más detalles de este plugin ve al siguiente enlace.

Conclusión

Es muy importante que entiendas que el uso de los plugins en tu proyecto hace que su desarrollo sea mas ágil y puedas seguir mejorándolo. Espero que te sirvan estos plugins y los puedas aplicar a tus proyectos. Para complementar tu aprendizaje, te recomendamos nuestro curso de JavaScript y jQuery:

[maxbutton id=“4” url=“https://platzi.com/javascript-full-stack/?utm_source=blog&utm_medium=cta_curso&utm_campaign=blog-jquery-plugins#plan_form”]

Juan Ricardo
Juan Ricardo
pepoflex

1330Puntos

hace 8 años

Todas sus entradas
Escribe tu comentario
+ 2
1
3405Puntos

dgfdgdfgdfg
dakshdkjashd
wueuiqyuiweyuiqw