En esta introducción de 5 a 10 minutos al entorno de desarrollo integrado (IDE) de Visual Studio, creará y ejecutará una sencilla aplicación web de front-end de Angular.
Prerrequisitos
Asegúrese de instalar el siguiente software:
Visual Studio 2022 o posterior. Vaya a la página de descargas de Visual Studio para instalarlo de forma gratuita.
En la ventana de inicio (elija Archivo>Ventana de inicio para abrirla), seleccione Crear un nuevo proyecto.
Busque Angular en la barra de búsqueda de la parte superior y, a continuación, seleccione Angular App.
A partir de la versión 11 de Visual Studio 2022, el nombre de la plantilla se cambió de Proyecto Angular de TypeScript independiente a Aplicación Angular.
Asigne un nombre al proyecto y a la solución.
Elija Creary espere a que Visual Studio cree el proyecto.
Visualización de las propiedades del proyecto
La configuración predeterminada del proyecto le permite compilar y depurar el proyecto. Pero, si necesita cambiar la configuración, haga clic con el botón derecho en el proyecto en el Explorador de Soluciones, seleccione Propiedadesy, a continuación, vaya a la sección Linting, Build o Deploy.
Para la configuración del depurador, use launch.json.
Nota
launch.json almacena la configuración de inicio asociada al botón Iniciar en la barra de herramientas de depuración. Actualmente, launch.json debe estar ubicado en la carpeta .vscode.
Construir tu proyecto
Elija Compilar>Compilar solución para compilar el proyecto.
Tenga en cuenta que la compilación inicial puede tardar un tiempo, ya que la CLI de Angular ejecuta el comando npm install.
Iniciar el proyecto
Presione F5 o seleccione el botón Iniciar, situado en la parte superior de la ventana, y verá un símbolo del sistema:
La CLI de Angular que ejecuta el comando ng start
Nota
Compruebe la salida de la consola para ver los mensajes, como un mensaje que le indica que actualice la versión de Node.js.
A continuación, deberías ver aparecer las aplicaciones base de Angular.
Para empezar a trabajar con el desarrollo web, cree un proyecto web sencillo en Visual Studio Code que contenga una página web, un archivo CSS y un archivo JavaScript. Vea cómo usar herramientas de desarrollo en el explorador para comprobar su trabajo.
Cree soluciones de un extremo a otro en Microsoft Azure para crear Azure Functions, implementar y administrar aplicaciones web, desarrollar soluciones que usen Azure Storage, etc.
Cree un proyecto de ASP.NET Core para que actúe como back-end de API y un proyecto de Angular para proporcionar la interfaz de usuario en Visual Studio.
En este episodio, Robert se une a Ed Charbeneau para una discusión sobre el uso de Angular con ASP.NET Core. Ed muestra cómo crear una aplicación de Angular con las nuevas plantillas de proyecto de ASP.NET Core [01:45],, cómo crear una aplicación angular con un back-end de API web [20:45] y cómo usar Angular para compilar una aplicación nativa de iOS y Android [27:10]. Recursos Obtenga información sobre la plantilla de Angular para .NET. Componentes de interfaz de usuario profesionales para Angular Compi
Cree una aplicación web sencilla mediante ASP.NET Core y TypeScript, agregue código TypeScript, ejecute la aplicación y depure con puntos de interrupción.
Entérese de que Visual Studio proporciona una compatibilidad completa con el desarrollo de JavaScript, tanto con JavaScript directamente, como con el lenguaje de programación TypeScript.
