{"id":630,"date":"2021-07-17T03:12:52","date_gmt":"2021-07-17T03:12:52","guid":{"rendered":"https:\/\/dev1992.com\/?p=630"},"modified":"2021-07-17T17:31:37","modified_gmt":"2021-07-17T17:31:37","slug":"crear-un-nuevo-proyecto-angular-primeros-pasos-con-angular-i","status":"publish","type":"post","link":"https:\/\/dev1992.com\/index.php\/2021\/07\/17\/crear-un-nuevo-proyecto-angular-primeros-pasos-con-angular-i\/","title":{"rendered":"Crear un Nuevo Proyecto Angular – Primeros Pasos con Angular I"},"content":{"rendered":"\n
<\/div>\n\n\n\n

\u00bfQu\u00e9 es Angular?<\/h2>\n\n\n\n

Es un framework para creaci\u00f3n de aplicaciones web, aunque no solo se queda ah\u00ed, ya que en conjunto con otros framework puedes crear aplicaciones de escritorio como con Electron.js, o tambi\u00e9n aplicaciones m\u00f3viles con NativeScript.<\/p>\n\n\n\n

Pero, \u00bfQu\u00e9 es un Framework?<\/h2>\n\n\n\n

Es un conjunto estandarizado de conceptos, pr\u00e1cticas y criterios que nos proveen de una estructura conceptual y tecnol\u00f3gica, para enfocar un tipo de problem\u00e1tica particular que sirve como referencia, para enfrentar y resolver nuevos problemas de \u00edndole similar.<\/p>\n\n\n\n

\u00bfQu\u00e9 lenguajes utilizaremos?<\/h2>\n\n\n\n

HTML para dar estructura al contenido, TypeScript el JavaScript con esteroides para mostrar informaci\u00f3n din\u00e1mica y CSS para los estilos.<\/p>\n\n\n\n

<\/div>\n\n\n\n

Configurar el ambiente y el entorno local<\/h2>\n\n\n\n

Como podemos apreciar en su documentaci\u00f3n oficial<\/a>, lo \u00fanico que necesitamos es tener Node.js instalado en nuestro equipo y tambi\u00e9n tener instalado el CLI de Angular. As\u00ed que \u00a1Vamos a ello!.<\/p>\n\n\n\n

Desde aqu\u00ed<\/a> puedes descargar Node.js, al momento de redacci\u00f3n esta en la versi\u00f3n 14.17.3 LTS, es recomendable reiniciar tu PC despu\u00e9s de la instalaci\u00f3n , ahora desde la consola ejecutaras el siguiente comando para instalar de forma global la ultima versi\u00f3n de Angular:<\/p>\n\n\n\n

 npm install -g @angular\/cli <\/code><\/pre>\n\n\n\n
Crear un nuevo proyecto Angular<\/h2>\n\n\n\n
Ahora para crear un proyecto existen dos formas, ambas son desde la consola, pero la primera es accediendo al directorio donde vas a crear el proyecto por medio de comandos (cd), o la segunda que es creando la carpeta donde vas a crear el proyecto y arrastr\u00e1ndolo al editor (VSC) y abriendo una consola, en ambos casos despu\u00e9s procedemos a instalar los componentes necesarios para el proyecto.<\/p>\n\n\n\n
El comando para poder crear el proyecto es el siguiente:<\/p>\n\n\n\n
 ng new nombre_del_proyecto <\/code><\/pre>\n\n\n\n
Ejecutar el proyecto Angular<\/h2>\n\n\n\n
Ahora para poder ejecutar el proyecto y ver que realmente funcione bien ejecutaremos el comando:<\/p>\n\n\n\n
 ng serve <\/code><\/pre>\n\n\n\n
<\/div>\n\n\n\n
\n