Cargando

Ir a contenido

X
Deja tu iPhone en la mesa y escucha todo los que dicen cuando tu no estás
ATENCION
Ver Más! Alguien con su iPhone te podría estar escuchando (aun estando bloqueado). Mira cómo lo hacen.

 


Crear arquitectura de desarrollo Front End con NPM, Grunt y Bower

Tutorial para aprender a realizar una buena arquitectura de desarrollo Front End con NPM, Grunt y Bower. Se debe tener conocimiento sobre HTML, CSS, JavaScript.


Escrito por abr 23 2016 12:29


Instalación

 

Instalación NodeJS


Ahora sí, manos a la obra!. Empecemos por instalar NodeJS. Eres Windows, Linux o Mac?, esto no importa, en cualquiera de los tres podremos trabajar ^^. En mi caso voy a realizar todas las instalaciones en Windows.

 

Primero vayamos a la página de NodeJS en la opción Download:

 

 

Elegimos el instalador a descargar dependiendo de nuestro sistema operativo.

 

[color=#a9a9a9]Pulsa imagen para ampliarla[/color]

 

Después de descargar el NodeJS podemos instalarlo como cualquier programa de nuestro ordenador.

 

npm-grunt-bower-2.jpg

 

Después de haber finalizado la instalación abrimos una línea de comandos (MSDOS, Shell o Terminal) y colocamos el siguiente comando:

node --version
npm --version
En este caso esta es la versión instalada.

 

npm-grunt-bower-3.jpg

 

 

Al tener NodeJS instalado en nuestro sistema tenemos un listado de comandos. Empezaremos a utilizar algunos para la instalación de Grunt y Bower.

 

Instalando Grunt


Como se mencionó anteriormente, Grunt es un conjunto de paquetes de NPM, podemos hacer la instalación de este con el siguiente comando:
npm install -g grunt
Antes de ejecutar este comando en nuestra línea de comandos te explico que le estamos diciendo a NodeJS que haga.
  • npm: es el comando de paquetes de NodeJS.
  • install: indicamos que lo que queremos es hacer una instalación.
  • -g: Instala el paquete globalmente (que pueda ser usado en cualquier lugar de tu sistema operativo). Cabe destacar que si no queremos instalar globalmente este paquete podemos omitir -g en el comando a ejecutar. Ya que NodeJS nos da la libertad instalar un paquete solo para un proyecto en específico, o global para el sistema operativo y ser usado en cualquier proyecto.
  • grunt: Paquete a instalar.

 

npm-grunt-bower-4.jpg

 

 

Nota
La instalación de estos paquetes pueden demorar dependiendo de la velocidad de tu internet.

 

Instalando Bower


De la misma forma como instalamos Grunt instalaremos el paquete de Bower:
npm install -g bower
Instalación paquete

 

npm-grunt-bower-5.jpg

 

Podemos ver como quedaron instalados nuestros paquetes con el comando:

npm ls -g
paquetes instalados

 

 

npm-grunt-bower-6.jpg

 

 



AYUDA A MEJORAR ESTE TUTORIAL!

¿Crees que puedes corregir o mejorar este tutorial? Puedes enviar tu Edición con los cambios que consideres útiles.

0 usuarios han editado este tutorial. ¡Edita y conviértete en un reconocido experto!


Tutoriales Relacionados



Sin comentarios, sé el primero!

No esperes más y entra en Solvetic
Deja tus comentarios y aprovecha las ventajas de la cuenta de usuario ¡Únete!
10
VOTA
5
100%
4
0%
3
0%
2
0%
1
0%

  Información

  •   Publicado abr 23 2016 12:29
  •   Actualizado abr 23 2016 12:55
  •   Visitas 3.7K
  •   Nivel
    Profesional