Herramientas de trabajo y Angular CLI

Clase 6 de 80Curso de Angular 4

Resumen

Domina un flujo de trabajo confiable para Angular cuatro usando la herramienta correcta. Aquí conocerás por qué Angular CLI simplifica la configuración, cómo se apoyan en Node.js, el navegador Chrome y editores como PHP Storm, y qué aporta cada pieza para crear, probar y preparar tu app para producción.

¿Qué herramientas se usarán y para qué sirven?

Para avanzar con seguridad, conviene tener claro qué usar y por qué. La prioridad es elegir la herramienta correcta para ahorrar tiempo y evitar errores.

  • Navegador web: se usará Chrome con sus herramientas de desarrollador. Si ya conoces Firefox con Firebox, puedes usarlo, aunque no se verán conceptos específicos de Firebox.
  • Editor de texto: opciones como Brackets, Atom, Subline, Notepad++ o PHP Storm.
  • PHP Storm: destaca por autocompletado, highlight de sintaxis y navegación entre clases, además de soporte nativo de TypeScript.
  • Nota sobre TypeScript: si tu editor no lo soporta de forma nativa, puedes buscar un plugin para añadirlo.
  • Node.js: no se escribirá código en Node, pero se necesitará su manejador de paquetes, llamado MPM.
  • Angular CLI: será la herramienta más usada durante todo el desarrollo.

¿Por qué Angular CLI es la herramienta correcta para Angular cuatro?

Configurar Angular cuatro puede resultar retador por su naturaleza robusta y la cantidad de piezas móviles que deben funcionar en conjunto. Muchas personas abandonaban porque “no funcionaba como debería”. Aquí entra la idea clave: usar siempre la herramienta correcta.

La explicación se ilustra con una escena de Indiana Jones: el enemigo parece fuerte y ágil, pero en vez de usar el látigo, Indiana saca una pistola y resuelve el problema de forma directa. Lo mismo ocurre con Angular CLI: un problema complejo se resuelve de manera simple y rápida al elegir bien.

  • Qué es Angular CLI: un set de herramientas para consola.
  • Qué hace: genera el proyecto base y también componentes, rutas, servicios y pipes.
  • Qué facilita: correr la app de forma local en el navegador, hacer app testing y preparar la app para producción.
  • Beneficio central: reduce la fricción de la configuración y te permite enfocarte en el desarrollo.

¿Cómo se integran navegador, editor y Node.js en el desarrollo?

La colaboración entre herramientas es clave para un ciclo de trabajo ágil y claro.

  • Con Angular CLI generas la estructura del proyecto y los artefactos que necesites.
  • En el editor (por ejemplo, PHP Storm) aprovechas autocompletado, highlight de sintaxis y navegación entre clases para escribir código más rápido y con menos errores.
  • En el navegador (Chrome) ejecutas la app localmente y verificas cambios de forma inmediata.
  • Con MPM desde Node.js gestionas lo que requiere la ejecución de la app.
  • Usando Angular CLI realizas app testing y preparas el build para producción cuando esté listo.

¿Con qué editor te sientes más cómodo y por qué? Comparte tu experiencia usando Angular CLI en los comentarios.