A continuación te presento la lista de librerías que con toda seguridad verías en mis proyectos, al menos en los que involucren ASP.NET MVC:
- jQuery y bootstrap: ¿hay algo que explicar? =)
- bootbox: cuadros de diálogo, alerta, prompt, input, etc. Al igual que con otras librerías, es necesario poner atención a las versiones, por ejemplo, cuando instalé el Nuget package "bootbox" tenía instalado el Bootstrap4 y sucedió que los cuadros de diálogo de bootbox aparecían con el título deforme. Revisé un poco la documentación y me dí cuenta de que estaba usando un bootbox que requería la versión 3 de bootstrap. Fue necesario buscar un paquete de bootbox diferente: Bootbox.JS
- toastr: notificaciones "non blocking", mensajes que desaparecen solos.
- bootstrap-select: dropdown list estilizadas, con opciones adicionales como checkboxes y búsqueda entre los elementos disponibles.
- requiere jQuery, bootstrap, popper.js
- jquery-editable-select: dropdown lists estilizadas con opciones adicionales pero menor funcionalidad que el anterior.
- jquery.datatables: para la creación y estilizado de tablas de datos con funcionalidades como exportado a excel, pdf, búsqueda entre los elementos de la tabla, ordenamiento, paginación
- datatables.bootstrap: para estilizar los datatables con bootstrap
- datatables.buttons: extensión para datatables, que añade la capacidad de añadir botones de excel, pdf, etc.
- jszip: necesario para las opciones de exportado a excel
- datatables/buttons.html5: necesario para uso de los botones en HTML5 (existe otra librería para botones Flash para el caso de navegadores viejos)
- NOTA: si es necesario utilizar más de un plugin/componente de jQuery datatables, tienen una página de descarga donde puedes indicar qué necesitas y te genera opciones consolidadas para obtenerlo de un CDN, un paquete para descargar, NPM, Yarn o Bower.
- js.cookie: manejo de cookies (sin dolores de cabeza).
¿Cómo las añado al proyecto?
En el caso de ASP.NET, Algunas de ellas tienen su correspondiente paquete Nuget, tales como:
- jQuery
- Bootstrap: normalmente instala también jQuery y popper.js
- Bootbox
- Toastr
- jQuery.DataTables: incluye por default varios archivos como datatables.bootstrap.js y datatables.buttons y buttons.html5, pero no incluye jsZip.
- jsZip
¿En qué orden las añado? en el mismo orden que se encuentra la lista anterior dado que algunas de ellas tienen dependencia con otras, por ejemplo, Bootbox requiere bootstrap y jQuery mientras que Bootstrap necesita jQuery.
Para proyectos de Angular y similares, las añado manualmente o configuro el bundle si la plataforma lo permite.
Bundling en ASP.NET MVC 5
Por lo general, el proyecto tengo los siguientes bundles:
- ScriptBundle:
- jquery: aquí se encuentra solo el jQuery
- jQueryVal: añadido por ASP.NET
- modernizr: añadido por ASP.NET
- bootstrap: contiene todos los archivos de Javascript que son default o casi default en todas las páginas de la aplicación, incluso algunos que no sean necesarios en todas las páginas pero que no sean demasiado grandes. Por ejemplo: bootstrap.js, respond.js, bootbox.js, toastr.js, bootstrap-select.js, jquery.datatables.min.js, datatables.bootstrap.js, datatables.buttons.min.js, js.cookie.js y algún script propio de mi aplicación.
- datatables_excel_export: dado que no todas las pantallas exportan datos excel, aquí agrupo dos archivos, jsZip.js y buttons.html5.js.
- StyleBundle:
- css: aquí añado todos los css necesarios por los componentes de la lista anterior, y claro, los míos propios: bootstrap.css, bootstrap-select.css, toastr.css, jquery.datatables.css, etc, etc.
Para Finalizar
Lo más importante para mí acerca de este post es que me digas ¿Cuáles utilizas tu, porqué y para qué?
Saludos!
