Introducción a ASP.NET MVC 5Getting started with ASP.NET MVC 5

by Rick Andersonby Rick Anderson

Hay disponible una versión actualizada de este tutorial aquí utilizando la versión más reciente de Visual Studio.An updated version of this tutorial is available here using the latest version of Visual Studio. Usa el nuevo tutorial ASP.NET Core MVC, que proporciona muchos mejoras a través de este tutorial.The new tutorial uses ASP.NET Core MVC, which provides many improvements over this tutorial.

En este tutorial se muestra ASP.NET Core MVC con controladores y vistas.This tutorial teaches ASP.NET Core MVC with controllers and views. Las páginas de Razor son una nueva alternativa en ASP.NET Core 2.0, un modelo de programación basado en páginas que facilita la compilación de interfaces de usuario web y hace que sean más productivas.Razor Pages is a new alternative in ASP.NET Core 2.0, a page-based programming model that makes building web UI easier and more productive. Se recomienda probar el tutorial de las páginas de Razor antes que la versión MVC.We recommend you try the Razor Pages tutorial before the MVC version. El tutorial de las páginas de Razor:The Razor Pages tutorial:

  • Es más fácil de seguir.Is easier to follow.
  • Abarca más características.Covers more features.
  • Es el método preferido para el desarrollo de nuevas aplicaciones.Is the preferred approach for new application development.

Este tutorial le enseña los aspectos básicos de la creación de una aplicación web de ASP.NET MVC 5 con Visual Studio 2017.This tutorial teaches you the basics of building an ASP.NET MVC 5 web app using Visual Studio 2017. El código fuente final para el tutorial se encuentra en GitHub.The final source code for the tutorial is located on GitHub.

En este tutorial se escribió por Scott Guthrie (twitter @scottgu ), Scott Hanselman (twitter: @shanselman ) , y Rick Anderson ( @RickAndMSFT )This tutorial was written by Scott Guthrie (twitter@scottgu ), Scott Hanselman (twitter: @shanselman ), and Rick Anderson ( @RickAndMSFT )

Necesita una cuenta de Azure para implementar esta aplicación en Azure:You need an Azure account to deploy this app to Azure:

  • También puede abrir una cuenta de Azure de forma gratuita -obtenga créditos puede usar para probar los servicios de Azure de pago e incluso después de que se usan hasta, puede mantener la cuenta y usar servicios gratuitos de Azure.You can open an Azure account for free - You get credits you can use to try out paid Azure services, and even after they're used up you can keep the account and use free Azure services.
  • También puede activar las ventajas de suscriptor MSDN -su suscripción a MSDN le proporciona crédito todos los meses que puede usar para servicios de Azure de pago.You can activate MSDN subscriber benefits - Your MSDN subscription gives you credits every month that you can use for paid Azure services.

Primeros pasosGet started

Empiece por instalar Visual Studio 2017.Start by installing Visual Studio 2017. A continuación, abra Visual Studio.Then, open Visual Studio.

Visual Studio es un entorno de desarrollo integrado o IDE.Visual Studio is an IDE, or integrated development environment. Al igual que utiliza Microsoft Word para escribir documentos, usará un IDE para crear aplicaciones.Just like you use Microsoft Word to write documents, you'll use an IDE to create applications. En Visual Studio, hay una lista en la parte inferior muestra distintas opciones disponibles para usted.In Visual Studio, there's a list along the bottom showing various options available to you. También hay un menú que proporciona otra manera de realizar las tareas en el IDE.There's also a menu that provides another way to perform tasks in the IDE. Por ejemplo, en lugar de seleccionar nuevo proyecto en el página de inicio, puede usar la barra de menús y seleccione archivo > denuevoproyecto.For example, instead of selecting New Project on the Start page, you can use the menu bar and select File > New Project.

Crear la primera aplicaciónCreate your first app

En el página de inicio, seleccione nuevo proyecto.On the Start page, select New Project. En el nuevo proyecto cuadro de diálogo, seleccione el Visual C# categoría a la izquierda y, a continuación, Weby, a continuación, seleccione el aplicación Web ASP.NET (.NET Framework) plantilla de proyecto.In the New project dialog box, select the Visual C# category on the left, then Web, and then select the ASP.NET Web Application (.NET Framework) project template. Nombre del proyecto "MvcMovie" y, a continuación, elija Aceptar.Name your project "MvcMovie" and then choose OK.

En el nueva aplicación Web ASP.NET cuadro de diálogo, elija MVC y, a continuación, elija Aceptar.In the New ASP.NET Web Application dialog, choose MVC and then choose OK.

Visual Studio usa una plantilla predeterminada para el proyecto de ASP.NET MVC que acaba de crear, por lo que tiene ahora una aplicación de trabajo sin hacer nada!Visual Studio used a default template for the ASP.NET MVC project you just created, so you have a working application right now without doing anything! Se trata de un simple "Hello World!"This is a simple "Hello World!" proyecto y, de un buen lugar para iniciar la aplicación.project, and it's a good place to start your application.

Presiona F5 para iniciar la depuración.Press F5 to start debugging. Al presionar F5, Visual Studio inicia IIS Express y ejecuta la aplicación web.When you press F5, Visual Studio starts IIS Express and runs your web app. A continuación, Visual Studio inicia un explorador y abre la página principal de la aplicación.Visual Studio then launches a browser and opens the application's home page. Tenga en cuenta que la barra de direcciones del explorador dice localhost:port# y no algo como example.com.Notice that the address bar of the browser says localhost:port# and not something like example.com. Eso es porque localhost siempre apunta a su propio equipo local, que en este caso, se ejecuta la aplicación que acaba de crear.That's because localhost always points to your own local computer, which in this case is running the application you just built. Cuando Visual Studio se ejecuta un proyecto web, se usa un puerto aleatorio para el servidor web.When Visual Studio runs a web project, a random port is used for the web server. En la imagen siguiente, el número de puerto es 1234.In the image below, the port number is 1234. Al ejecutar la aplicación, verá un número de puerto diferente.When you run the application, you'll see a different port number.

Desde el comienzo esta plantilla predeterminada proporciona Home, Contact, y About páginas.Right out of the box this default template gives you Home, Contact, and About pages. No se muestra la imagen siguiente el inicio, sobre, y póngase en contacto con vínculos.The image below doesn't show the Home, About, and Contact links. Según el tamaño de la ventana del explorador, es posible que deba haga clic en el icono de navegación para ver estos vínculos.Depending on the size of your browser window, you might need to click the navigation icon to see these links.

La aplicación también proporciona compatibilidad para registrar e inicie sesión.The application also provides support to register and log in. El siguiente paso es cambiar el funcionamiento de esta aplicación y aprender un poco sobre ASP.NET MVC.The next step is to change how this application works and learn a little bit about ASP.NET MVC. Cierre la aplicación de ASP.NET MVC y vamos a cambiar algo de código.Close the ASP.NET MVC application and let's change some code.

Para obtener una lista de tutoriales actuales, consulte MVC artículos recomendado.For a list of current tutorials, see MVC recommended articles.

Consulte esta aplicación se ejecuta en AzureSee this app running on Azure

¿Desea ver el sitio terminado que se ejecuta como una aplicación web en directo?Would you like to see the finished site running as a live web app? Puede implementar una versión completa de la aplicación en su cuenta de Azure, simplemente haga clic en el botón siguiente.You can deploy a complete version of the app to your Azure account by simply clicking the following button.

Necesita una cuenta de Azure para implementar esta solución en Azure.You need an Azure account to deploy this solution to Azure. Si aún no tiene una cuenta, use una de las opciones siguientes para crear uno:If you don't already have an account, use one of the following options to create one: