• Ir a navegación principal
  • Ir al contenido principal
  • Ir a la barra lateral primaria
  • Ir al pie de página

Antonio Pérez

Full Stack developer

  • Inicio
  • Sobre mi
  • Full Stack Podcast
  • Blog
  • Contacto

Cómo crear un proyecto nuevo con Angular.

Usted está aquí: Inicio / angular / Cómo crear un proyecto nuevo con Angular.

01/12/2018 por Antonio Pérez 3 comentarios

[Actualización 25-10-2020] – Aquí tenéis el proceso de creación actualizado con la creación de un proyecto de Angular 10 en un video de youtube que he publicado en mi canal, echadle un vistazo y suscribíos!

Aqui tenéis, como ya teníamos, el proceso con Angular 7, son muy parecidos en realidad.

Ya tenemos con nosotros angular 7, parece que fue ayer cuando lanzaron angular 6 y ya tenemos aquí a su sucesor. Bueno, en realidad hace solo unos meses que se lanzó angular 6, pero bueno, los chicos de Angular no quieren que nos durmamos en los laureles y aquí nos han dado una nueva major release.

Novedades angular 7

En primer lugar cabe destacar que Angular 7 es la versión del framework más rápida hasta el momento, en cada versión una de las principales preocupaciones del equipo de desarrollo es hacer la compilación de los paquetes más rápida.

Instala la versión del CLI

En primer lugar, si eres desarrollador de angular tendrás un follón de versiones de padre y muy señor mío, así que instálate Node Version Manager alma de Dios (nvm), si no lo tienes instalado pon esto en tu terminal de Mac o Linux.

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bash 

Una vez que ya has instalado nvm (que ya era hora hijo mio… ) selecciona en primer lugar la versión de node con la que vas a trabajar con:

nvm use 10.12.0

Si por ejemplo, vas a trabajar con la versión 10.12.0 de node, esta por ejemplo es una buena versión para trabjar con Angular 7, esto es importante que lo hagas antes de instalar el CLI de angular, si intentas instalar el CLI y después cambias la versión de node se te complica un poco. Ahora puedes comprobar que la versión está bien con nvm list

Deberías ver una pantalla parecida a esta

Pero bueno, ya lo hemos hecho bien, y tenemos node seleccionado, ahora en el terminal escribes:

npm install @angular/cli <- Esto instalará la última versión estable de angular CLI
npm install @angular/cli -g <- Esto instalará el CLI y lo hará accesible de forma global
npm install @angular/cli@6.1.1 <- Si por lo que sea quieres una versión específica del angular CLI (como cuando clonas un repo de un proyecto ya creado)

Ha llegado el momento de crear tu nuevo proyecto con Angular 7, ahora tan solo escribe:

ng new nombre_de_mi_app

Y verás como aparecen estos mensajes en pantalla, aquí vemos algunos cambios, en primer lugar, con angular 7 el propio cli te pregunta si vas a incluir el sistema de router de Angular y después el tipo de css que vas a usar, así que ya no vas a tener que toquetear para ajustar y usar scss, como hago yo siempre, jeje, directamente lo vas a seleccionar de la lista que aparece:


Una vez hayas seleccionado estos dos parámetros se crea todo tu proyecto nuevo de angular:

Ahora, comprobamos que se ha instalado todo bien con el comando ng v y vemos esto:

Aquí tienes descritas todas las versiones que estás usando

Y ahora, señores, es cuando empieza el baile, ahora ya va a depender de ti crear una aplicación rompedora y que funcione a las mil maravillas. Angular cada vez nos está poniendo esto más sencillo.

Si queréis ampliar esta información os dejo el enlace de la documentación oficial: https://angular.io/docs

Archivado en:angular, Angular 2+, Desarrollo Front End, Desarrollo web, Javascript

Interacciones con los lectores

Comentarios

  1. Pepe dice

    05/06/2019 en 4:17 pm

    Que bola

    Responder
    • Antonio Pérez dice

      23/06/2019 en 3:34 pm

      No entiendo muy bien tu comentario…

      Responder
  2. Los Santos dice

    24/09/2020 en 3:18 pm

    Que bola nomas es rebueno

    Responder

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Barra lateral primaria

Si quieres contactar conmigo y comentarme tus impresiones adelante!

Suscríbete a Full Stack Podcast

Y únete a nuestro canal de telegram en t.me/fullstackpodcast para participar activamente y formar parte de una gran comunidad de desarrolladores!

Lo último en Full Stack Podcast

  • Asíncronía con Angular: RxJS
    07/03/2021
    45 minutes

  • Historias del backend con república web
    11/07/2020
    1 hour 25 minutes

  • Scrum y gestión de proyectos
    13/06/2020
    45 minutes

Footer

  • Facebook
  • GitHub
  • LinkedIn
  • Twitter
  • YouTube

Copyright © 2021 — Antonio Pérez • Todos los derechos reservados - Iniciar sesión