Ir al contenido principal

Hola Mundo - Angular en 5min LEVANTA tu primera APP

¡Hola a todos! 馃憢 ¿Alguna vez te has preguntado c贸mo crear una aplicaci贸n web desde cero en cuesti贸n de minutos? 馃殌 Si es as铆, est谩s en el lugar correcto. En este art铆culo, te llevaremos paso a paso por el proceso de levantar tu primera aplicaci贸n con Angular en solo 5 minutos. ⏱️ Aqu铆 encontrar谩s una gu铆a sencilla y directa para poner en marcha tu proyecto Angular. ¡Vamos a empezar! 馃帀


Paso 1. INSTALAR NODEJS

Instalar NodeJS desde su p谩gina oficial, mejor si eliges siempre la LTS Node.js — Download Node.js® (nodejs.org). Luego de descargarlo NEXT a todo y listo. 







Paso 2. REVISAR

Verificar que se haya instalado correctamente, abre una consola CMD y comprueba la versi贸n de NodeJS y NPM que ya viene incluido en la instalaci贸n anterior. 

Node -v

Npm –version or npm --v



Paso 3. INSTALAR ANGULAR

Instalar Angular; ve a la p脿gina oficial https://angular.dev/ -> tools -> cli -> set-up y copia el comando que ah铆 aparece en un CMD. 

npm install -g @angular/cli@17


Paso 4. 

En las computadoras cliente de Windows, la ejecuci贸n de scripts de PowerShell est谩 deshabilitada de manera predeterminada, por lo que el comando anterior puede generar un error. Para permitir la ejecuci贸n de scripts de PowerShell, que son necesarios para los binarios globales de npm, por lo que debes ejecutar el siguiente comando:

Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy RemoteSigned


Paso 5. INICIAR PROYECTO

Crea una carpeta donde quieras que este tu Hola Mundo, navega hacia el en el CMD y ejecuta: 

cd desktop

cd mi_proyecto

ng new tu-nombre-hola-mundo


Paso 6. CORRER PROYECTO

Abre el proyecto desde tu editor favorito, por ejemplo Visual Studio Code y ejecuta desde la terminal del editor el siguiente comando para levantar la APP:

ng serve



Ve a la direcci贸n que ah铆 indica y mira la APP. 

¡Listo! Eso es todo :) a veces se nos olvida o cambiamos de computadora y toca volver hacer todo, por lo que esta gu铆a es muy r谩pido poder levantar nuevamente angular. 


Comentarios

Entradas m谩s populares de este blog

Arquitectura N-Capas GU脥A COMPLETA .NET Core

Entendiendo la Arquitectura Limpia (Clean Architecture) en .NET: Una Gu铆a Completa La Arquitectura Limpia, tambi茅n conocida como arquitectura N-Capas, es un patr贸n de dise帽o que nos ayuda a crear aplicaciones mantenibles, testables y escalables. En este art铆culo, exploraremos en detalle c贸mo implementar esta arquitectura en un proyecto .NET. Si quieres entenderlo m谩s f谩cil y con c贸digo, te dejo este otro art铆culo:   Arquitectura Limpia explicado con patitos 馃悿 ¿Qu茅 es la Arquitectura Limpia? La Arquitectura Limpia es un conjunto de principios de dise帽o que nos ayuda a separar las responsabilidades en diferentes capas de nuestra aplicaci贸n. Cada capa tiene una responsabilidad espec铆fica y se comunica con las otras capas a trav茅s de interfaces bien definidas. Estructura del Proyecto Una t铆pica estructura de proyecto en Arquitectura Limpia se ve as铆: ├── Controllers/ │   └── ProductController.cs ├── Domain/ │   ├── Models/ │   └── DTOs/ ├── Repository/ │...

Archivo Application.properties en SPRING BOOT

  Gu铆a Completa: Application.properties en Spring Boot El archivo application.properties es una pieza fundamental en aplicaciones Spring Boot, actuando como el centro de configuraci贸n para todo tu proyecto. En esta gu铆a, exploraremos sus caracter铆sticas principales y c贸mo aprovecharlo al m谩ximo. ¿Qu茅 es application.properties? Es un archivo de configuraci贸n que permite definir diferentes par谩metros y valores para tu aplicaci贸n Spring Boot sin necesidad de modificar el c贸digo fuente. Se ubica en src/main/resources y Spring Boot lo lee autom谩ticamente al iniciar. Configuraciones Esenciales Configuraci贸n del Servidor # Puerto del servidor server.port = 8080 # Contexto de la aplicaci贸n server.servlet.context-path = /miapp Conexi贸n a Base de Datos # MySQL spring.datasource.url = jdbc:mysql://localhost:3306/mibasededatos spring.datasource.username = usuario spring.datasource.password = contrase帽a spring.datasource.driver-class-name = com.mysql.cj.jdbc.Driver JPA y Hibernat...

Kubernets (K8S) - PRIMEROS pasos

¡Hola, amantes de la tecnolog铆a! 馃憢 Si has escuchado hablar de Kubernetes pero a煤n no sabes por d贸nde empezar, este art铆culo es para ti. 馃殺 Kubernetes, tambi茅n conocido como K8s, es una herramienta poderosa para la gesti贸n de contenedores que puede parecer intimidante al principio. Pero no te preocupes, aqu铆 te guiaremos paso a paso para que puedas dominar los conceptos b谩sicos y empezar a desplegar tus propias aplicaciones en un cl煤ster de Kubernetes. 馃寪 Prep谩rate para descubrir c贸mo esta tecnolog铆a puede transformar la manera en que desarrollas y despliegas tus aplicaciones. ¡Vamos a sumergirnos en el mundo de Kubernetes! 馃捇馃殌 Vamos hacer un listado para lo que vamos a necesitar instalar:  Docker Desktop  Install Docker Desktop on Windows | Docker Docs   Kubectl  Install Tools | Kubernetes   MiniCube  https://minikube.sigs.k8s.io/docs/start Scoop ( opcional para instalar Kubecolor)  Scoop   Kubecolor ( opcional para colores en PowerShell)  ...