Importante
Esta información hace referencia a un producto en versión preliminar, el cual puede sufrir importantes modificaciones antes de que se publique la versión comercial. Microsoft no proporciona ninguna garantía, expresa o implícita, con respecto a la información proporcionada aquí.
Para la versión actual, consulte la versión de .NET 9 de este artículo.
Por Rick Anderson
En este tutorial se muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas. Si todavía no tiene experiencia en el desarrollo web de ASP.NET Core, considere la versión de Razor Pages de este tutorial, que proporciona un punto de partida más sencillo. Vea Elección de una interfaz de usuario web de ASP.NET Core, donde se comparan Razor Pages, MVC y Blazor para el desarrollo de la interfaz de usuario.
Este es el primer tutorial de una serie que muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas.
Al final de la serie, tendrá una aplicación que administra, valida y muestra datos de películas. Aprenderá a:
- Crear una aplicación web.
- Agregar un modelo y aplicarle scaffolding.
- Trabajar con una base de datos.
- Agregar búsqueda y validación.
Vea o descargue el código de ejemplo (cómo descargarlo).
Puede seguir las instrucciones de Visual Studio Code en macOS, Linux o Windows. Es posible que se requieran cambios si usa un entorno de desarrollo integrado (IDE) distinto de Visual Studio Code.
- Inicie Visual Studio y seleccione Crear un proyecto.
- En el cuadro de diálogo Crear un proyecto, seleccione Aplicación web ASP.NET Core (Modelo-Vista-Controlador)>Siguiente.
- En el cuadro de diálogo Configura el proyecto nuevo:
- Escriba
MvcMovie para Nombre de proyecto. Es importante asignar al proyecto el nombre MvcMovie. Las mayúsculas tienen que coincidir con cada namespace cuando se copia el código.
- La ubicación para el proyecto se puede establecer en cualquier lugar.
- Seleccione Siguiente.
- En el cuadro de diálogo Información adicional:
- Seleccione .NET 9.0.
- Comprobar que la opción No usar instrucciones de nivel superior está desactivada.
- Seleccione Crear.
Para obtener más información, incluidos enfoques alternativos para crear el proyecto, consulte: Creación de un proyecto nuevo en Visual Studio.
Visual Studio usa la plantilla de proyecto predeterminada para el proyecto de MVC creado. El proyecto creado:
- Es una aplicación de trabajo.
- Es un proyecto básico de inicio.
Para realizar el tutorial debe estar familiarizado con VS Code. Para más información, vea Introducción a VS Code y Ayuda de Visual Studio Code.
Seleccione Nuevo terminal en el menú Terminal para abrir el terminal integrado.
Cambie al directorio (cd) que contendrá el proyecto. El proyecto se puede ubicar en cualquier lugar.
Ejecute los comandos siguientes:
dotnet new mvc -o MvcMovie
code -r MvcMovie
El comando dotnet new crea un nuevo proyecto de ASP.NET Core MVC en la carpeta MvcMovie.
El comando code abre la carpeta de proyecto MvcMovie en la instancia actual de Visual Studio Code.
Visual Studio Code puede mostrar un cuadro de diálogo en el que se le pregunta: ¿confía en los autores de los archivos de esta carpeta?
- Si confía en todos los archivos de la carpeta principal, seleccione Confiar en los autores de todos los archivos de la carpeta principal.
- Seleccione Sí, confío en los autores, ya que la carpeta del proyecto tiene archivos generados por .NET.
- Cuando Visual Studio Code le solicite que agregue recursos de compilación y depuración del proyecto, seleccione Sí. Si Visual Studio Code no ofrece agregar recursos de compilación y depuración, seleccione Ver>Paleta de comandos y escriba "
.NET" en el cuadro de búsqueda. En la lista de comandos, seleccione el comando .NET: Generate Assets for Build and Debug.
Visual Studio Code agrega una carpeta .vscode con los archivos launch.json y tasks.json que se han generado.
Ejecución de la aplicación
Presione Ctrl+F5 para ejecutar la aplicación sin el depurador.
Visual Studio muestra el siguiente cuadro de diálogo cuando un proyecto aún no está configurado para usar SSL:
Haga clic en Sí si confía en el certificado SSL de IIS Express.
Se muestra el cuadro de diálogo siguiente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
Visual Studio ejecuta la aplicación y abre el explorador predeterminado.
En la barra de direcciones aparece localhost:<port#> (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Cuando Visual Studio crea un proyecto web, se usa un puerto aleatorio para el servidor web.
Iniciar la aplicación sin depurar presionando Ctrl+F5 le permite:
- Modifique el código.
- Guarde el archivo.
- Actualizar rápidamente el explorador y ver los cambios en el código.
Puede iniciar la aplicación en modo de depuración o en modo de no depuración desde el menú Depurar:
Puede depurar la aplicación si selecciona el botón https en la barra de herramientas:
En la imagen siguiente se muestra la aplicación:
- Cierre la ventana del explorador. Visual Studio detendrá la aplicación.
Para confiar en el certificado de desarrollo de HTTPS, ejecute el comando siguiente:
dotnet dev-certs https --trust
El comando anterior requiere .NET 9 SDK o posterior en Linux. Para Linux en el SDK de .NET 8.0.401 y versiones anteriores, consulta la documentación de tu distribución de Linux para confiar en un certificado.
El comando anterior muestra el siguiente cuadro de diálogo, siempre que el certificado no fuera de confianza previamente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener más información, consulta la sección Confiar en el certificado de desarrollo HTTPS de ASP.NET Core del artículo Aplicación de SSL.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
En Visual Studio Code, presione Ctrl+F5 (Windows) o ^+F5 (macOS) para ejecutar la aplicación sin depurar.
Visual Studio Code:
- Inicia Kestrel.
- Inicia un explorador.
- Navega a
https://localhost:<port#>.
En la barra de direcciones aparece localhost:<port#> (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Localhost solo sirve las solicitudes web del equipo local.
El inicio de la aplicación sin depuración seleccionando Ctrl + F5 le permite:
Modifique el código.
Guarde el archivo.
Actualizar rápidamente el explorador y ver los cambios en el código.
Cierre la ventana del explorador.
En Visual Studio Code, en el menú Ejecutar, seleccione Detener depuración o presione Mayús+F5 para detener la aplicación.
Ayuda de Visual Studio Code
En el siguiente tutorial de esta serie conocerá MVC y empezará a escribir código.
En este tutorial se muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas. Si todavía no tiene experiencia en el desarrollo web de ASP.NET Core, considere la versión de Razor Pages de este tutorial, que proporciona un punto de partida más sencillo. Vea Elección de una interfaz de usuario web de ASP.NET Core, donde se comparan Razor Pages, MVC y Blazor para el desarrollo de la interfaz de usuario.
Este es el primer tutorial de una serie que muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas.
Al final de la serie, tendrá una aplicación que administra y muestra datos de películas. Aprenderá a:
- Crear una aplicación web.
- Agregar un modelo y aplicarle scaffolding.
- Trabajar con una base de datos.
- Agregar búsqueda y validación.
Vea o descargue el código de ejemplo (cómo descargarlo).
Las instrucciones de Visual Studio Code usan la CLI de .NET para las funciones de desarrollo de ASP.NET Core, como la creación de los proyectos. Puede seguir dichas instrucciones en macOS, Linux o Windows y con cualquier editor de código. Si usa otra herramienta que no sea Visual Studio Code, es posible que sea necesario realizar cambios menores.
- Inicie Visual Studio y seleccione Crear un proyecto.
- En el cuadro de diálogo Crear un proyecto, seleccione Aplicación web ASP.NET Core (Modelo-Vista-Controlador)>Siguiente.
- En el cuadro de diálogo Configura el proyecto nuevo:
- Escriba
MvcMovie para Nombre de proyecto. Es importante asignar al proyecto el nombre MvcMovie. Las mayúsculas tienen que coincidir con cada namespace cuando se copia el código.
- La ubicación para el proyecto se puede establecer en cualquier lugar.
- Seleccione Siguiente.
- En el cuadro de diálogo Información adicional:
- Seleccione .NET 8.0 (Compatibilidad a largo plazo).
- Comprobar que la opción No usar instrucciones de nivel superior está desactivada.
- Seleccione Crear.
Para obtener más información, incluidos enfoques alternativos para crear el proyecto, consulte: Creación de un proyecto nuevo en Visual Studio.
Visual Studio usa la plantilla de proyecto predeterminada para el proyecto de MVC creado. El proyecto creado:
- Es una aplicación de trabajo.
- Es un proyecto básico de inicio.
Para realizar el tutorial debe estar familiarizado con VS Code. Para más información, vea Introducción a VS Code y Ayuda de Visual Studio Code.
Seleccione Nuevo terminal en el menú Terminal para abrir el terminal integrado.
Cambie al directorio (cd) que contendrá el proyecto. El proyecto se puede ubicar en cualquier lugar.
Ejecute los comandos siguientes:
dotnet new mvc -o MvcMovie
code -r MvcMovie
El comando dotnet new crea un nuevo proyecto de ASP.NET Core MVC en la carpeta MvcMovie.
El comando code abre la carpeta de proyecto MvcMovie en la instancia actual de Visual Studio Code.
Visual Studio Code puede mostrar un cuadro de diálogo en el que se le pregunta: ¿confía en los autores de los archivos de esta carpeta?
- Si confía en todos los archivos de la carpeta principal, seleccione Confiar en los autores de todos los archivos de la carpeta principal.
- Seleccione Sí, confío en los autores, ya que la carpeta del proyecto tiene archivos generados por .NET.
- Cuando Visual Studio Code le solicite que agregue recursos de compilación y depuración del proyecto, seleccione Sí. Si Visual Studio Code no ofrece agregar recursos de compilación y depuración, seleccione Ver>Paleta de comandos y escriba "
.NET" en el cuadro de búsqueda. En la lista de comandos, seleccione el comando .NET: Generate Assets for Build and Debug.
Visual Studio Code agrega una carpeta .vscode con los archivos launch.json y tasks.json que se han generado.
- Seleccione Archivo>Nuevo proyecto.
- Seleccione Web y Consola>Aplicación>Aplicación Web (Modelo-Vista-Controlador)>Continuar.
- En el cuadro de diálogo Configurar la nueva aplicación web (controlador de vista de modelos):
- Seleccione .NET 8.0 para Marco de trabajo de destino.
- Comprobar que la opción No usar instrucciones de nivel superior está desactivada.
- Seleccione Continuar.
- Escriba
MvcMovie para Nombre de proyecto. Es importante asignar al proyecto el nombre MvcMovie. Las mayúsculas tienen que coincidir con cada namespace cuando se copia el código.
- La ubicación para el proyecto se puede establecer en cualquier lugar.
- Seleccione Crear.
Ejecución de la aplicación
Presione Ctrl+F5 para ejecutar la aplicación sin el depurador.
Visual Studio muestra el siguiente cuadro de diálogo cuando un proyecto aún no está configurado para usar SSL:
Haga clic en Sí si confía en el certificado SSL de IIS Express.
Se muestra el cuadro de diálogo siguiente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
Visual Studio ejecuta la aplicación y abre el explorador predeterminado.
En la barra de direcciones aparece localhost:<port#> (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Cuando Visual Studio crea un proyecto web, se usa un puerto aleatorio para el servidor web.
Iniciar la aplicación sin depurar presionando Ctrl+F5 le permite:
- Modifique el código.
- Guarde el archivo.
- Actualizar rápidamente el explorador y ver los cambios en el código.
Puede iniciar la aplicación en modo de depuración o en modo de no depuración desde el menú Depurar:
Puede depurar la aplicación si selecciona el botón https en la barra de herramientas:
En la imagen siguiente se muestra la aplicación:
- Cierre la ventana del explorador. Visual Studio detendrá la aplicación.
Para confiar en el certificado de desarrollo de HTTPS, ejecute el comando siguiente:
dotnet dev-certs https --trust
El comando anterior requiere .NET 9 SDK o posterior en Linux. Para Linux en el SDK de .NET 8.0.401 y versiones anteriores, consulta la documentación de tu distribución de Linux para confiar en un certificado.
El comando anterior muestra el siguiente cuadro de diálogo, siempre que el certificado no fuera de confianza previamente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener más información, consulta la sección Confiar en el certificado de desarrollo HTTPS de ASP.NET Core del artículo Aplicación de SSL.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
En Visual Studio Code, presione Ctrl+F5 (Windows) o ^+F5 (macOS) para ejecutar la aplicación sin depurar.
Visual Studio Code:
- Inicia Kestrel.
- Inicia un explorador.
- Navega a
https://localhost:<port#>.
En la barra de direcciones aparece localhost:<port#> (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Localhost solo sirve las solicitudes web del equipo local.
El inicio de la aplicación sin depuración seleccionando Ctrl + F5 le permite:
Modifique el código.
Guarde el archivo.
Actualizar rápidamente el explorador y ver los cambios en el código.
Cierre la ventana del explorador.
En Visual Studio Code, en el menú Ejecutar, seleccione Detener depuración o presione Mayús+F5 para detener la aplicación.
Seleccione Opción+Comando+Retorno para ejecutar la aplicación sin el depurador.
Visual Studio para Mac:
- Inicia el servidor Kestrel.
- Inicia un explorador.
- Navega a
http://localhost:port, donde port es un número de puerto elegido aleatoriamente, establecido cuando Visual Studio crea un proyecto web.
Visual Studio para Mac muestra el siguiente elemento emergente:
- Seleccione Instalar y confiar si confía en el certificado de implementación.
Se muestra el cuadro de diálogo siguiente:
- Escriba la contraseña y seleccione Actualizar configuración.
Para obtener más información, vea Confiar en el certificado de desarrollo de ASP.NET Core HTTPS .
En la barra de direcciones aparece localhost:<port#> (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Localhost solo sirve las solicitudes web del equipo local.
Puede iniciar la aplicación en modo de depuración o en modo de no depuración desde el menú Depurar.
En la imagen siguiente se muestra la aplicación:
- Cierre la ventana del explorador. Visual Studio para Mac detendrá la aplicación.
Ayuda de Visual Studio Code
Ayuda de Visual Studio para Mac
En el siguiente tutorial de esta serie conocerá MVC y empezará a escribir código.
En este tutorial se muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas. Si todavía no tiene experiencia en el desarrollo web de ASP.NET Core, considere la versión de Razor Pages de este tutorial, que proporciona un punto de partida más sencillo. Vea Elección de una interfaz de usuario web de ASP.NET Core, donde se comparan Razor Pages, MVC y Blazor para el desarrollo de la interfaz de usuario.
Este es el primer tutorial de una serie que muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas.
Al final de la serie, tendrá una aplicación que administra y muestra datos de películas. Aprenderá a:
- Crear una aplicación web.
- Agregar un modelo y aplicarle scaffolding.
- Trabajar con una base de datos.
- Agregar búsqueda y validación.
Vea o descargue el código de ejemplo (cómo descargarlo).
Las instrucciones de Visual Studio Code usan la CLI de .NET para las funciones de desarrollo de ASP.NET Core, como la creación de los proyectos. Puede seguir dichas instrucciones en macOS, Linux o Windows y con cualquier editor de código. Si usa otra herramienta que no sea Visual Studio Code, es posible que sea necesario realizar cambios menores.
- Inicie Visual Studio y seleccione Crear un proyecto.
- En el cuadro de diálogo Crear un proyecto, seleccione Aplicación web ASP.NET Core (Modelo-Vista-Controlador)>Siguiente.
- En el cuadro de diálogo Configura el proyecto nuevo:
- Escriba
MvcMovie para Nombre de proyecto. Es importante asignar al proyecto el nombre MvcMovie. Las mayúsculas tienen que coincidir con cada namespace cuando se copia el código.
- La ubicación para el proyecto se puede establecer en cualquier lugar.
- Seleccione Siguiente.
- En el cuadro de diálogo Información adicional:
- Seleccionar .NET 7.0.
- Comprobar que la opción No usar instrucciones de nivel superior está desactivada.
- Seleccione Crear.
Para obtener más información, incluidos enfoques alternativos para crear el proyecto, consulte: Creación de un proyecto nuevo en Visual Studio.
Visual Studio usa la plantilla de proyecto predeterminada para el proyecto de MVC creado. El proyecto creado:
- Es una aplicación de trabajo.
- Es un proyecto básico de inicio.
Para realizar el tutorial debe estar familiarizado con VS Code. Para obtener más información, consulte Introducción a VS Code.
Seleccione Nuevo terminal en el menú Terminal para abrir el terminal integrado.
Cambie al directorio (cd) que contendrá el proyecto. El proyecto se puede ubicar en cualquier lugar.
Ejecute los comandos siguientes:
dotnet new mvc -o MvcMovie
code -r MvcMovie
El comando dotnet new crea un nuevo proyecto de ASP.NET Core MVC en la carpeta MvcMovie.
El comando code abre la carpeta de proyecto MvcMovie en la instancia actual de Visual Studio Code.
Visual Studio Code puede mostrar un cuadro de diálogo en el que se le pregunta: ¿confía en los autores de los archivos de esta carpeta?
- Si confía en todos los archivos de la carpeta principal, seleccione Confiar en los autores de todos los archivos de la carpeta principal.
- Seleccione Sí, confío en los autores, ya que la carpeta del proyecto tiene archivos generados por .NET.
- Cuando Visual Studio Code le solicite que agregue recursos de compilación y depuración del proyecto, seleccione Sí. Si Visual Studio Code no ofrece agregar recursos de compilación y depuración, seleccione Ver>Paleta de comandos y escriba "
.NET" en el cuadro de búsqueda. En la lista de comandos, seleccione el comando .NET: Generate Assets for Build and Debug.
Visual Studio Code agrega una carpeta .vscode con los archivos launch.json y tasks.json que se han generado.
- Inicie Visual Studio para Mac y seleccione Archivo>Nuevo proyecto....
- En Visual Studio para Mac, seleccione Web y consola>Aplicación>Aplicación web (controlador de vista de modelos)>Continuar.
- En el cuadro de diálogo Configurar la nueva aplicación web (controlador de vista de modelos):
- Seleccione .NET 7.0 para Marco de trabajo de destino.
- Comprobar que la opción No usar instrucciones de nivel superior está desactivada.
- Seleccione Continuar.
- Escriba
MvcMovie para Nombre de proyecto. Es importante asignar al proyecto el nombre MvcMovie. Las mayúsculas tienen que coincidir con cada namespace cuando se copia el código.
- La ubicación para el proyecto se puede establecer en cualquier lugar.
- Seleccione Crear.
Ejecución de la aplicación
- Presione Ctrl+F5 para ejecutar la aplicación sin el depurador. Visual Studio muestra el siguiente cuadro de diálogo cuando un proyecto aún no está configurado para usar SSL:Seleccione Sí si confía en el certificado SSL de IIS Express. Se muestra el cuadro de diálogo siguiente: Seleccione Sí si acepta confiar en el certificado de desarrollo. Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado de Firefox SEC_ERROR_INADEQUATE_KEY_USAGE.
Visual Studio ejecuta la aplicación y abre el explorador predeterminado.
En la barra de direcciones aparece localhost:<port#> (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Cuando Visual Studio crea un proyecto web, se usa un puerto aleatorio para el servidor web.
Iniciar la aplicación sin depurar presionando Ctrl+F5 le permite:
- Modifique el código.
- Guarde el archivo.
- Actualizar rápidamente el explorador y ver los cambios en el código.
Puede iniciar la aplicación en modo de depuración o en modo de no depuración desde el menú Depurar:
Puede depurar la aplicación si selecciona el botón https en la barra de herramientas:
En la imagen siguiente se muestra la aplicación:
- Cierre la ventana del explorador. Visual Studio detendrá la aplicación.
Para confiar en el certificado de desarrollo de HTTPS, ejecute el comando siguiente:
dotnet dev-certs https --trust
El comando anterior requiere .NET 9 SDK o posterior en Linux. Para Linux en el SDK de .NET 8.0.401 y versiones anteriores, consulta la documentación de tu distribución de Linux para confiar en un certificado.
El comando anterior muestra el siguiente cuadro de diálogo, siempre que el certificado no fuera de confianza previamente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener más información, consulta la sección Confiar en el certificado de desarrollo HTTPS de ASP.NET Core del artículo Aplicación de SSL.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
En Visual Studio Code, presione Ctrl+F5 (Windows) o ^+F5 (macOS) para ejecutar la aplicación sin depurar.
Visual Studio Code:
- Inicia Kestrel.
- Inicia un explorador.
- Navega a
https://localhost:<port#>.
En la barra de direcciones aparece localhost:<port#> (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Localhost solo sirve las solicitudes web del equipo local.
El inicio de la aplicación sin depuración seleccionando Ctrl + F5 le permite:
Modifique el código.
Guarde el archivo.
Actualizar rápidamente el explorador y ver los cambios en el código.
Cierre la ventana del explorador.
En Visual Studio Code, en el menú Ejecutar, seleccione Detener depuración o presione Mayús+F5 para detener la aplicación.
Seleccione Opción+Comando+Retorno para ejecutar la aplicación sin el depurador.
Visual Studio para Mac:
- Inicia el servidor Kestrel.
- Inicia un explorador.
- Navega a
http://localhost:port, donde port es un número de puerto elegido aleatoriamente, establecido cuando Visual Studio crea un proyecto web.
Visual Studio para Mac muestra el siguiente elemento emergente:
- Seleccione Instalar y confiar si confía en el certificado de implementación.
Se muestra el cuadro de diálogo siguiente:
- Escriba la contraseña y seleccione Actualizar configuración.
Para obtener más información, vea Confiar en el certificado de desarrollo de ASP.NET Core HTTPS .
En la barra de direcciones aparece localhost:<port#> (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Localhost solo sirve las solicitudes web del equipo local.
Puede iniciar la aplicación en modo de depuración o en modo de no depuración desde el menú Depurar.
En la imagen siguiente se muestra la aplicación:
- Cierre la ventana del explorador. Visual Studio para Mac detendrá la aplicación.
Ayuda de Visual Studio Code
Ayuda de Visual Studio para Mac
En el siguiente tutorial de esta serie conocerá MVC y empezará a escribir código.
En este tutorial se muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas. Si todavía no tiene experiencia en el desarrollo web de ASP.NET Core, considere la versión de Razor Pages de este tutorial, que proporciona un punto de partida más sencillo. Vea Elección de una interfaz de usuario web de ASP.NET Core, donde se comparan Razor Pages, MVC y Blazor para el desarrollo de la interfaz de usuario.
Este es el primer tutorial de una serie que muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas.
Al final de la serie, tendrá una aplicación que administra y muestra datos de películas. Aprenderá a:
- Crear una aplicación web.
- Agregar un modelo y aplicarle scaffolding.
- Trabajar con una base de datos.
- Agregar búsqueda y validación.
Vea o descargue el código de ejemplo (cómo descargarlo).
Las instrucciones de Visual Studio Code usan la CLI de .NET para las funciones de desarrollo de ASP.NET Core, como la creación de los proyectos. Puede seguir dichas instrucciones en macOS, Linux o Windows y con cualquier editor de código. Si usa otra herramienta que no sea Visual Studio Code, es posible que sea necesario realizar cambios menores.
Para Visual Studio para Mac, consulte la versión de .NET 7 de este tutorial.
- Inicie Visual Studio y seleccione Crear un proyecto.
- En el cuadro de diálogo Crear un proyecto, seleccione Aplicación web ASP.NET Core (Modelo-Vista-Controlador)>Siguiente.
- En el cuadro de diálogo Configurar su nuevo proyecto, escriba
MvcMovie en Nombre del proyecto. Es importante asignar al proyecto el nombre MvcMovie. Las mayúsculas tienen que coincidir con cada namespace cuando se copia el código.
- Seleccione Siguiente.
- En el cuadro de diálogo Información adicional, seleccione .NET 6.0 (Compatibilidad a largo plazo).
- Seleccione Crear.
Para obtener enfoques alternativos para crear el proyecto, vea Creación de un proyecto nuevo en Visual Studio.
Visual Studio usa la plantilla de proyecto predeterminada para el proyecto de MVC creado. El proyecto creado:
- Es una aplicación de trabajo.
- Es un proyecto básico de inicio.
Para realizar el tutorial debe estar familiarizado con VS Code. Para más información, vea Introducción a VS Code y Ayuda de Visual Studio Code.
Seleccione Nuevo terminal en el menú Terminal para abrir el terminal integrado.
Cambie al directorio (cd) que contendrá el proyecto.
Ejecute los comandos siguientes:
dotnet new mvc -o MvcMovie
code -r MvcMovie
El comando dotnet new crea un nuevo proyecto de ASP.NET Core MVC en la carpeta MvcMovie.
El comando code abre la carpeta de proyecto MvcMovie en la instancia actual de Visual Studio Code.
Visual Studio Code puede mostrar un cuadro de diálogo en el que se le pregunta: ¿confía en los autores de los archivos de esta carpeta?
- Si confía en todos los archivos de la carpeta principal, seleccione Confiar en los autores de todos los archivos de la carpeta principal.
- Seleccione Sí, confío en los autores, ya que la carpeta del proyecto tiene archivos generados por .NET.
- Cuando Visual Studio Code le solicite que agregue recursos de compilación y depuración del proyecto, seleccione Sí. Si Visual Studio Code no ofrece agregar recursos de compilación y depuración, seleccione Ver>Paleta de comandos y escriba "
.NET" en el cuadro de búsqueda. En la lista de comandos, seleccione el comando .NET: Generate Assets for Build and Debug.
Visual Studio Code agrega una carpeta .vscode con los archivos launch.json y tasks.json que se han generado.
Para Visual Studio para Mac, consulte la versión de .NET 7 de este tutorial.
Ejecución de la aplicación
Seleccione Ctrl + F5 para ejecutar la aplicación sin el depurador.
Visual Studio muestra el siguiente cuadro de diálogo cuando un proyecto aún no está configurado para usar SSL:
Haga clic en Sí si confía en el certificado SSL de IIS Express.
Se muestra el cuadro de diálogo siguiente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
Visual Studio ejecuta la aplicación y abre el explorador predeterminado.
En la barra de direcciones aparece localhost:<port#> (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Cuando Visual Studio crea un proyecto web, se usa un puerto aleatorio para el servidor web.
El inicio de la aplicación sin depuración seleccionando Ctrl + F5 le permite:
- Modifique el código.
- Guarde el archivo.
- Actualizar rápidamente el explorador y ver los cambios en el código.
Puede iniciar la aplicación en modo de depuración o en modo de no depuración desde el menú Depurar:
Puede depurar la aplicación seleccionando el botón MvcMovie en la barra de herramientas:
En la imagen siguiente se muestra la aplicación:
Seleccione Ctrl+F5 para ejecutarla sin el depurador.
Para confiar en el certificado de desarrollo de HTTPS, ejecute el comando siguiente:
dotnet dev-certs https --trust
El comando anterior requiere .NET 9 SDK o posterior en Linux. Para Linux en el SDK de .NET 8.0.401 y versiones anteriores, consulta la documentación de tu distribución de Linux para confiar en un certificado.
El comando anterior muestra el siguiente cuadro de diálogo, siempre que el certificado no fuera de confianza previamente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener más información, consulta la sección Confiar en el certificado de desarrollo HTTPS de ASP.NET Core del artículo Aplicación de SSL.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
Visual Studio Code:
- Inicia Kestrel.
- Inicia un explorador.
- Navega a
https://localhost:<port#>.
En la barra de direcciones aparece localhost:<port#> (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Localhost solo sirve las solicitudes web del equipo local.
El inicio de la aplicación sin depuración seleccionando Ctrl + F5 le permite:
Para Visual Studio para Mac, consulte la versión de .NET 7 de este tutorial.
Ayuda de Visual Studio Code
Ayuda de Visual Studio para Mac
En el siguiente tutorial de esta serie conocerá MVC y empezará a escribir código.
En este tutorial se muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas. Si todavía no tiene experiencia en el desarrollo web de ASP.NET Core, considere la versión de Razor Pages de este tutorial, que proporciona un punto de partida más sencillo. Vea Elección de una interfaz de usuario web de ASP.NET Core, donde se comparan Razor Pages, MVC y Blazor para el desarrollo de la interfaz de usuario.
Este es el primer tutorial de una serie que muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas.
Al final de la serie, tendrá una aplicación que administra y muestra datos de películas. Aprenderá a:
- Crear una aplicación web.
- Agregar un modelo y aplicarle scaffolding.
- Trabajar con una base de datos.
- Agregar búsqueda y validación.
Vea o descargue el código de ejemplo (cómo descargarlo).
Las instrucciones de Visual Studio Code usan la CLI de .NET para las funciones de desarrollo de ASP.NET Core, como la creación de los proyectos. Puede seguir dichas instrucciones en macOS, Linux o Windows y con cualquier editor de código. Si usa otra herramienta que no sea Visual Studio Code, es posible que sea necesario realizar cambios menores.
- Inicie Visual Studio y seleccione Crear un proyecto.
- En el cuadro de diálogo Crear un proyecto, selecciona Aplicación web ASP.NET Core>Siguiente.
- En el cuadro de diálogo Configurar su nuevo proyecto, escriba
MvcMovie en Nombre del proyecto. Es importante asignar al proyecto el nombre MvcMovie. Las mayúsculas tienen que coincidir con cada correspondencia de namespace cuando se copia el código.
- Seleccione Crear.
- En el cuadro de diálogo Crear una aplicación web ASP.NET Core, selecciona:
- .NET Core y ASP.NET Core 5.0 en los menús desplegables.
- Aplicación web de ASP.NET Core (Modelo-Vista-Controlador).
- Crear.
Para obtener enfoques alternativos para crear el proyecto, vea Creación de un proyecto nuevo en Visual Studio.
Visual Studio usó la plantilla de proyecto predeterminada para el proyecto de MVC creado. El proyecto creado:
- Es una aplicación de trabajo.
- Es un proyecto básico de inicio.
Para realizar el tutorial debe estar familiarizado con VS Code. Para obtener más información, consulte Introducción a VS Code.
Seleccione Nuevo terminal en el menú Terminal para abrir el terminal integrado.
Cambie al directorio (cd) que contendrá el proyecto.
Ejecute los comandos siguientes:
dotnet new mvc -o MvcMovie
code -r MvcMovie
El comando dotnet new crea un nuevo proyecto de ASP.NET Core MVC en la carpeta MvcMovie.
El comando code abre la carpeta de proyecto MvcMovie en la instancia actual de Visual Studio Code.
Visual Studio Code puede mostrar un cuadro de diálogo en el que se le pregunta: ¿confía en los autores de los archivos de esta carpeta?
- Si confía en todos los archivos de la carpeta principal, seleccione Confiar en los autores de todos los archivos de la carpeta principal.
- Seleccione Sí, confío en los autores, ya que la carpeta del proyecto tiene archivos generados por .NET.
- Cuando Visual Studio Code le solicite que agregue recursos de compilación y depuración del proyecto, seleccione Sí. Si Visual Studio Code no ofrece agregar recursos de compilación y depuración, seleccione Ver>Paleta de comandos y escriba "
.NET" en el cuadro de búsqueda. En la lista de comandos, seleccione el comando .NET: Generate Assets for Build and Debug.
Visual Studio Code agrega una carpeta .vscode con los archivos launch.json y tasks.json que se han generado.
Seleccione Archivo>Nueva solución.
En las versiones de Visual Studio para Mac anteriores a 8.6, seleccione .NET Core>Aplicación>Aplicación web (controlador de vista de modelos)>Siguiente. En la versión 8.6 o posteriores, seleccione Web y consola>Aplicación>Aplicación web (controlador de vista de modelos)>Siguiente.
En el cuadro de diálogo Configure your new Web Application (Configurar la nueva aplicación web):
- Asegúrese de que la autenticación esté establecida en Sin autenticación.
- Si se presenta una opción para seleccionar una plataforma de destino, seleccione la versión 5.x más reciente.
- Seleccione Siguiente.
Asigne el nombre MvcMovie al proyecto y, después, seleccione Crear.
Ejecución de la aplicación
Seleccione Ctrl + F5 para ejecutar la aplicación sin el depurador.
Visual Studio muestra el siguiente cuadro de diálogo cuando un proyecto aún no está configurado para usar SSL:
Haga clic en Sí si confía en el certificado SSL de IIS Express.
Se muestra el cuadro de diálogo siguiente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
Visual Studio:
En la barra de direcciones aparece localhost:port# (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Cuando Visual Studio crea un proyecto web, se usa un puerto aleatorio para el servidor web.
El inicio de la aplicación sin depuración seleccionando Ctrl + F5 le permite:
- Modifique el código.
- Guarde el archivo.
- Actualizar rápidamente el explorador y ver los cambios en el código.
Puede iniciar la aplicación en modo de depuración o en modo de no depuración desde el elemento de menú Depurar:
Puede depurar la aplicación seleccionando el botón IIS Express.
En la imagen siguiente se muestra la aplicación:
Seleccione Ctrl+F5 para ejecutarla sin el depurador.
Para confiar en el certificado de desarrollo de HTTPS, ejecute el comando siguiente:
dotnet dev-certs https --trust
El comando anterior requiere .NET 9 SDK o posterior en Linux. Para Linux en el SDK de .NET 8.0.401 y versiones anteriores, consulta la documentación de tu distribución de Linux para confiar en un certificado.
El comando anterior muestra el siguiente cuadro de diálogo, siempre que el certificado no fuera de confianza previamente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener más información, consulta la sección Confiar en el certificado de desarrollo HTTPS de ASP.NET Core del artículo Aplicación de SSL.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
Visual Studio Code:
- Inicia Kestrel.
- Inicia un explorador.
- Navega a
https://localhost:5001.
En la barra de direcciones aparece localhost:port:5001 (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Localhost solo sirve las solicitudes web del equipo local.
El inicio de la aplicación sin depuración seleccionando Ctrl + F5 le permite:
Seleccione Ejecutar>Iniciar sin depurar para iniciar la aplicación.
Visual Studio para Mac:
- Inicia el servidor Kestrel.
- Inicia un explorador.
- Navega a
http://localhost:port, donde port es un número de puerto elegido aleatoriamente.
Visual Studio para Mac muestra el siguiente elemento emergente:
Si confía en el certificado de desarrollo, seleccione Sí.
Se muestra el cuadro de diálogo siguiente:
Escriba la contraseña y seleccione Aceptar
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener más información, vea Confiar en el certificado de desarrollo de ASP.NET Core HTTPS .
En la barra de direcciones aparece localhost:port# (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Cuando Visual Studio crea un proyecto web, se usa un puerto aleatorio para el servidor web.
Puede iniciar la aplicación en modo de depuración o en modo de no depuración desde el menú Ejecutar.
En la imagen siguiente se muestra la aplicación:
Ayuda de Visual Studio Code
Ayuda de Visual Studio para Mac
En la siguiente sección de este tutorial conocerá MVC y empezará a escribir código.
En este tutorial se muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas. Si todavía no tiene experiencia en el desarrollo web de ASP.NET Core, considere la versión de Razor Pages de este tutorial, que proporciona un punto de partida más sencillo. Vea Elección de una interfaz de usuario web de ASP.NET Core, donde se comparan Razor Pages, MVC y Blazor para el desarrollo de la interfaz de usuario.
Este es el primer tutorial de una serie que muestra el desarrollo web de ASP.NET Core MVC con controladores y vistas.
Al final de la serie, tendrá una aplicación que administra y muestra datos de películas. Aprenderá a:
- Crear una aplicación web.
- Agregar un modelo y aplicarle scaffolding.
- Trabajar con una base de datos.
- Agregar búsqueda y validación.
Vea o descargue el código de ejemplo (cómo descargarlo).
Las instrucciones de Visual Studio Code usan la CLI de .NET para las funciones de desarrollo de ASP.NET Core, como la creación de los proyectos. Puede seguir dichas instrucciones en cualquier plataforma (macOS, Linux o Windows) y con cualquier editor de código. Si usa otra herramienta que no sea Visual Studio Code, es posible que sea necesario realizar cambios menores. Para obtener más información sobre cómo instalar Visual Studio Code en macOS, vea Visual Studio Code en macOS.
En Visual Studio, seleccione Crear un proyecto.
Select Aplicación web ASP.NET Core>Siguiente.
Asigne el nombre MvcMovie al proyecto y seleccione Crear. Es importante que el proyecto se llame MvcMovie para que, al copiar el código, coincida con el espacio de nombres.
Seleccione Aplicación web (Modelo-Vista-Controlador) . En las listas desplegables, seleccione .NET Core y ASP.NET Core 3.1 y, después, Crear.
Visual Studio usó la plantilla de proyecto predeterminada para el proyecto de MVC creado. El proyecto creado:
- Es una aplicación de trabajo.
- Es un proyecto básico de inicio.
Para realizar el tutorial debe estar familiarizado con VS Code. Para más información, vea Introducción a VS Code y Ayuda de Visual Studio Code.
Abra el terminal integrado.
Cambie los directorios (cd) a una carpeta que contenga el proyecto.
Ejecute el siguiente comando:
dotnet new mvc -o MvcMovie
code -r MvcMovie
Se muestra un cuadro de diálogo con el texto Required assets to build and debug are missing from 'MvcMovie'. Add them? (Faltan los activos necesarios para compilar y depurar en "MvcMovie". ¿Desea agregarlos?), seleccione Sí.
dotnet new mvc -o MvcMovie; Crea un nuevo proyecto de ASP.NET Core MVC en la carpeta MvcMovie.
code -r MvcMovie: carga el archivo de proyecto MvcMovie.csproj en Visual Studio Code.
Seleccione Archivo>Nueva solución.
En las versiones de Visual Studio para Mac anteriores a 8.6, seleccione .NET Core>Aplicación>Aplicación web (controlador de vista de modelos)>Siguiente. En la versión 8.6 o posteriores, seleccione Web y consola>Aplicación>Aplicación web (controlador de vista de modelos)>Siguiente.
En el cuadro de diálogo Configure your new Web Application (Configurar la nueva aplicación web):
- Asegúrese de que la autenticación esté establecida en Sin autenticación.
- Si se presenta una opción para seleccionar una plataforma de destino, seleccione la versión 3.x más reciente.
- Seleccione Siguiente.
Asigne el nombre MvcMovie al proyecto y, después, seleccione Crear.
Ejecución de la aplicación
Seleccione CTRL+F5 para ejecutar la aplicación sin depurar.
Visual Studio muestra el siguiente cuadro de diálogo cuando un proyecto aún no está configurado para usar SSL:
Haga clic en Sí si confía en el certificado SSL de IIS Express.
Se muestra el cuadro de diálogo siguiente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
Visual Studio:
En la barra de direcciones aparece localhost:port# (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Cuando Visual Studio crea un proyecto web, se usa un puerto aleatorio para el servidor web.
El inicio de la aplicación sin depuración seleccionando Ctrl + F5 le permite:
- Modifique el código.
- Guarde el archivo.
- Actualizar rápidamente el explorador y ver los cambios en el código.
Puede iniciar la aplicación en modo de depuración o en modo de no depuración desde el elemento de menú Depurar:
Puede depurar la aplicación seleccionando el botón IIS Express.
En la imagen siguiente se muestra la aplicación:
Seleccione CTRL+F5 para ejecutar la aplicación sin depurar.
Para confiar en el certificado de desarrollo de HTTPS, ejecute el comando siguiente:
dotnet dev-certs https --trust
El comando anterior requiere .NET 9 SDK o posterior en Linux. Para Linux en el SDK de .NET 8.0.401 y versiones anteriores, consulta la documentación de tu distribución de Linux para confiar en un certificado.
El comando anterior muestra el siguiente cuadro de diálogo, siempre que el certificado no fuera de confianza previamente:
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener más información, consulta la sección Confiar en el certificado de desarrollo HTTPS de ASP.NET Core del artículo Aplicación de SSL.
Para obtener información sobre cómo confiar en el explorador Firefox, consulte Error de certificado SEC_ERROR_INADEQUATE_KEY_USAGE de Firefox.
Visual Studio Code:
- Inicia Kestrel.
- Inicia un explorador.
- Navega a
https://localhost:5001.
En la barra de direcciones aparece localhost:port:5001 (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Localhost solo sirve las solicitudes web del equipo local.
El inicio de la aplicación sin depuración seleccionando Ctrl + F5 le permite:
Seleccione Ejecutar>Iniciar sin depurar para iniciar la aplicación.
Visual Studio para Mac: inicia el servidor Kestrel, inicia un explorador y navega a http://localhost:port, donde port es un número de puerto elegido aleatoriamente.
Visual Studio para Mac muestra el siguiente elemento emergente:
Si confía en el certificado de desarrollo, seleccione Sí.
Se muestra el cuadro de diálogo siguiente:
Escriba la contraseña y seleccione Aceptar
Si acepta confiar en el certificado de desarrollo, seleccione Sí.
Para obtener más información, vea Confiar en el certificado de desarrollo de ASP.NET Core HTTPS .
En la barra de direcciones aparece localhost:port# (y no algo como example.com). El nombre de host estándar del equipo local es localhost. Cuando Visual Studio crea un proyecto web, se usa un puerto aleatorio para el servidor web. Al ejecutar la aplicación verá otro puerto distinto.
Puede iniciar la aplicación en modo de depuración o en modo de no depuración desde el menú Ejecutar.
En la imagen siguiente se muestra la aplicación:
Ayuda de Visual Studio Code
Ayuda de Visual Studio para Mac
En la siguiente sección de este tutorial conocerá MVC y empezará a escribir código.
