Minientrada

Montando un entorno de desarrollo para aplicaciones Angular 8

El manejo, desarrollo y configuración de los backend es el punto fuerte de mi carrera profesional, y debo reconocer que tengo un gran debe con el frontend.

Acabo de comenzar un proyecto en el que Angular 8 y PrimeNG van a ser mis grandes aliados para crear una interfaz de usuario web atractiva. Me ha llegado el momento, por tanto, de comenzar a escribir algunos posts relacionados con Javascript. El primero, como crear en mi MAC un entorno de desarrollo que me permita crear la web del futuro.

Requisitos.

Para desarrollar con Angular, es necesario tener:

  • Node.js – En versión 12.2.0 o superior.
  • Typescript – En versión 2.1 o superior.
  • Navegador – Recomendado utilizar Google Chrome, aunque Mozilla Firefox también funcionará bien.
  • Instalar Angular CLI
  • Instalar un IDE de desarrollo.

Instalar homebrew.

Para instalar los requisitos hay varias maneras de hacerlo, utilizando por ejemplo el instalador que te descargas del website correspondiente (p.e el instalador de node.js  https://nodejs.org/es/download/) o utilizando Homebrew, un gestor de paquetes macOS para instalar aquellos paquetes que no se instalan desde la tienda de Apple.

Utilizar Homebrew permite instalar, desinstalar y actualizar de manera automática los paquetes que se vayan necesitando.

Para instalar homebrew hay que ejecutar desde un terminal lo siguiente:

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Para comprobar que brew se ha instalado correctamente puedes ejecutar el comando brew con la opción –version. El resultado debería ser la versión instalada.

$brew --version
Homebrew 2.1.6
Homebrew/homebrew-core (git revision ebe4; last commit 2019-06-16)

Homebrew habrá creado una estructura de directorios para manejar aquellas aplicaciones que se instalan utilizando la herramienta. Esto ordenará la instalación de esos paquetes y aplicaciones que no se instalan utilizando las herramientas de MAC.

Si ya tenías  instalado brew, acuérdate de actualizarlo:

$brew update

Instalar Node.js

Instalaremos nodejs utilizando homebrew.

Instalaremos nodejs utilizando directamente el instalador del website de nodejs. La página de descargas es https://nodejs.org/es/download/.

Al terminar la instalación habrá dejado instalado el ejecutable node y el gestor de paquetes npm en el directorio ejecutable de usuario /usr/local/bin. 

Para comprobar que nodejs está correctamente instalado puedes preguntar por las versiones tanto de node como de npm.

$ node -v
v10.16.0

$npm -version
6.9.0

Instalar Typescript

Para que angular funcione correctamente usaremos typescript 2.1 o superior. Para instalarlo usaremos el gestor de paquetes npm.

$ npm install -g typescript

Instalar Angular CLI

Angular CLI es la consola de cliente que se utiliza en angular para administrar la creación de aplicaciones.

$ npm install -g @angular/cli

Para probar que se ha instalado correctamente como siempre se puede consultar la versión instalada.

$ ng --version
     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

    
Angular CLI: 8.0.3
Node: 10.16.0
OS: darwin x64
Angular: 
... 

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.800.3
@angular-devkit/core         8.0.3
@angular-devkit/schematics   8.0.3
@schematics/angular          8.0.3
@schematics/update           0.800.3
rxjs                         6.4.0

 

Instalar un IDE de desarrollo.

Existen tantos IDEs de desarrollo como estrellas en el firmamento. Quizás esto es una exageración, pero hay muchos. Mi recomendación es que instales uno con el que te sientas a gusto, y si no tienes preferencias, que instales Visual Studio Code de Microsoft. Gratis y continuamente mantenido.

Puedes descargarlo aquí.

 

Y de momento esto es todo. Ya tenemos instalado en nuestro ordenador lo necesario para poder desarrollar sitios web usando Angular.