Cómo instalar, actualizar y eliminar bibliotecas web fácilmente con Bower

Para construir un sitio web, generalmente dependemos de varias bibliotecas, ya sea en forma de CSS o JavaScript. Si construyese un sitio web pequeño que muestre una presentación de diapositivas, por ejemplo, probablemente el sitio web necesite jQuery y un complemento jQuery, Flexslider. Estas bibliotecas son las dependencias para que el sitio web funcione.

Si bien la adición de estas bibliotecas debería ser una tarea fácil, cuando se trata de un sitio web a gran escala que requiere más bibliotecas, todo podría ser engorroso y complicado desde el principio. Puede que tenga que arrastrar de un repositorio a otro repositorio, descargar cada una de las bibliotecas, extraer los paquetes y, finalmente, ponerlos en el directorio de su proyecto.

Cuando la nueva versión esté disponible, tendrá que volver a hacer todo eso (parece mucho trabajo, ¿no?).

Si eso suena como lo que ha estado haciendo durante años, vale la pena leer este artículo. Aquí le mostraremos una herramienta útil llamada Bower que hace que administrar bibliotecas de sitios web sea muy fácil. Vamos a ver.

Empezando

Para usar Bower, debes instalar Node.js. Como Bower se basa en Node.js, debería poder ejecutar Bower en todas las plataformas: Windows, Mac y Linux.

Una vez que haya instalado Node.js, abra Terminal (o Símbolo del sistema) y ejecute esta línea de comando para instalar Bower.

 npm install -g bower 

Instalación de Bibliotecas

Ahora estamos listos para usar Bower. Comencemos buscando en una biblioteca que queremos poner en nuestro directorio de proyectos. Suponiendo que se encuentra actualmente dentro del directorio, puede escribir bower search {name of the library} . Aquí, por ejemplo, busqué Normalize.css, una biblioteca para hacer que el estilo de un elemento sea consistente en todos los navegadores.

 Bower Search se normaliza 

El comando mostrará una lista de resultados; no solo nos da la Normalización original, sino que también nos muestra las versiones de Normalización que se han convertido a LESS, Sass, Stylus y otras plataformas.

Una vez que hayamos elegido cuál instalar, podemos escribir bower install {{name of the repository}} . En este ejemplo, instalaré Normalize LESS y jQuery.

 bower install normalizar menos jquery 

Este comando descargará la última versión de normalize-less y jQuery, y lo guardará en una nueva carpeta llamada bower_components ; ahora debería encontrar la carpeta creada en su directorio de proyecto.

Alternativamente, si desea instalar la versión anterior de la biblioteca, puede ejecutar el comando seguido del número de versión, de esta manera.

 bower install jquery # 1.10.0 

Ahora que tenemos las bibliotecas, Normalizar y jQuery, en nuestro directorio de proyectos, podemos utilizarlas haciendo referencia a jQuery desde la carpeta bower_components en el documento HTML e importando Normalizar MENOS en la otra hoja de estilos LESS.

en HTML

en menos

 @import "bower_components / normalize-less / normalize.less"; 

Si una de las bibliotecas ya no se usa en el sitio web, puede desinstalarla fácilmente con el comando bower uninstall, de esa manera.

 bower uninstall normalize-less 

Actualización de los componentes de Bower

Digamos que ha estado trabajando en su proyecto durante varios meses, y algunas bibliotecas que está utilizando (como jQuery) han lanzado una nueva versión. En esta circunstancia, podemos usar Bower para actualizar jQuery a la última versión. Pero primero veamos si la nueva versión se ha registrado en bower con el comando bower list .

La última versión de jQuery, como puede ver a continuación, es 2.1.1.

Para actualizar jQuery, podemos escribir bower update jquery . Una vez que la actualización se haya completado, puede ejecutar el comando bower list nuevamente para verificar la versión instalada actual. A continuación, como puede ver, ahora tenemos la última versión de jQuery.

Envolver

Bower es una herramienta realmente práctica que creo que debería aprovechar en su proyecto. Es como tener una AppStore, pero para las cosas de su sitio web, podemos instalar, actualizar y eliminar bibliotecas cómodamente.

En el próximo artículo nos sumergiremos en Bower y exploraremos algunas características más avanzadas. Así que estad atentos.

13 complementos de WordPress para personalizar su página de inicio de sesión

Las páginas de inicio de sesión y registro actúan como la puerta de entrada a nuestros sitios web. Las páginas de inicio de sesión y registro bien diseñadas y bien marcadas son las que hacen que su sitio se destaque del resto . Si su sitio funciona en el registro de usuarios o tiene una sección solo para miembros, estas páginas de inicio de sesión probablemente ayudarán a formar las primeras impresiones que sus visitantes tienen de su servicio o producto.Esto gara

(Consejos de tecnología y diseño)

Ahora puede enviar y recibir dinero con Gmail

Android: en 2013, Google presentó una función que permitiría a los usuarios de Google Wallet enviar y recibir dinero a través de la versión web de Gmail . Avance rápido hasta 2017, esta función está dando el salto al espacio móvil ya que Gmail para Android ahora viene con la integración de Google Wallet .Para aque

(Consejos de tecnología y diseño)