MVC Framework - Primeiro Aplicativo
Vamos pular e criar nosso primeiro aplicativo MVC usando Views e Controllers. Assim que tivermos uma pequena experiência prática sobre como funciona um aplicativo MVC básico, aprenderemos todos os componentes e conceitos individuais nos próximos capítulos.
Criar o primeiro aplicativo MVC
Step 1- Inicie o Visual Studio e selecione Arquivo → Novo → Projeto. Selecione Web → Aplicativo da Web ASP.NET MVC e nomeie este projeto comoFirstMVCApplicatio. Selecione o local comoC:\MVC. Clique OK.
Step 2- Isso abrirá a opção Modelo de projeto. Selecione o template vazio e View Engine as Razor. Clique OK.
Agora, o Visual Studio criará nosso primeiro projeto MVC, conforme mostrado na captura de tela a seguir.
Step 3- Agora vamos criar o primeiro Controller em nossa aplicação. Os controladores são apenas classes C # simples, que contêm vários métodos públicos, conhecidos como métodos de ação. Para adicionar um novo controlador, clique com o botão direito na pasta Controladores em nosso projeto e selecione Adicionar → Controlador. Nomeie o controlador como HomeController e clique em Adicionar.
Isso criará um arquivo de classe HomeController.cs na pasta Controladores com o seguinte código padrão.
using System;
using System.Web.Mvc;
namespace FirstMVCApplication.Controllers {
public class HomeController : Controller {
public ViewResult Index() {
return View();
}
}
}
O código acima basicamente define um método público Index dentro de nosso HomeController e retorna um objeto ViewResult. Nas próximas etapas, aprenderemos como retornar uma View usando o objeto ViewResult.
Step 4- Agora vamos adicionar uma nova visualização ao nosso Controlador doméstico. Para adicionar uma nova Visualização, clique com o botão direito na pasta de visualização e clique em Adicionar → Visualização.
Step 5- Nomeie a nova visão como índice e o mecanismo de visão como Razor (SCHTML). Clique em Adicionar.
Isso irá adicionar um novo cshtml arquivo dentro da pasta Views / Home com o seguinte código -
@{
Layout = null;
}
<html>
<head>
<meta name = "viewport" content = "width = device-width" />
<title>Index</title>
</head>
<body>
<div>
</div>
</body>
</html>
Step 6 - Modifique o conteúdo do corpo da View acima com o seguinte código -
<body>
<div>
Welcome to My First MVC Application (<b>From Index View</b>)
</div>
</body>
Step 7- Agora execute o aplicativo. Isso fornecerá a seguinte saída no navegador. Esta saída é renderizada com base no conteúdo de nosso arquivo View. O aplicativo primeiro chama o Controlador que, por sua vez, chama esta Visualização e produz a saída.
Na Etapa 7, a saída que recebemos foi baseada no conteúdo de nosso arquivo View e não teve interação com o Controlador. Dando um passo adiante, criaremos agora um pequeno exemplo para exibir uma mensagem de boas-vindas com a hora atual usando uma interação de View e Controller.
Step 8- MVC usa o objeto ViewBag para passar dados entre o Controlador e a Visualização. Abra o HomeController.cs e edite a função Index para o código a seguir.
public ViewResult Index() {
int hour = DateTime.Now.Hour;
ViewBag.Greeting =
hour < 12
? "Good Morning. Time is" + DateTime.Now.ToShortTimeString()
: "Good Afternoon. Time is " + DateTime.Now.ToShortTimeString();
return View();
}
No código acima, definimos o valor do atributo Greeting do objeto ViewBag. O código verifica a hora atual e retorna a mensagem Bom dia / tarde de acordo com a instrução return View (). Observe que aqui Greeting é apenas um atributo de exemplo que usamos com o objeto ViewBag. Você pode usar qualquer outro nome de atributo no lugar de Saudação.
Step 9 - Abra o Index.cshtml e copie o código a seguir na seção do corpo.
<body>
<div>
@ViewBag.Greeting (<b>From Index View</b>)
</div>
</body>
No código acima, estamos acessando o valor do atributo Greeting do objeto ViewBag usando @ (que seria definido no Controller).
Step 10- Agora execute o aplicativo novamente. Desta vez, nosso código executará o Controlador primeiro, definirá o ViewBag e então o renderizará usando o código View. A seguir será a saída.