dir.by  
  Search  
Programming, development, testing
→
ASP.NET MVC (web сайт на архитектуре Model-View-Controller)
→
Создаем новое приложение ASP.NET MVC
  Looked at 9006 times    
 Создаем новое приложение ASP.NET MVC 
last updated: 18 May 2020
Скачать пример: MyAspNetWebApplication.zip ...
План (6 шагов)
Шаг 1. Открываем Visual Studio
If you do not have Visual Studio installed you need install Visual Studio...
Open Visual Studio 2022
or
Open Visual Studio 2019
Шаг 2. Создаем пустое ASP.NET MVC приложение
Нажимаем в меню: File → New → Project → Visual C# → ASP.NET Web Application
Нажимаем OK
Проект ASP.NET MVC создался!
Запускаем проект
Нажимаем вверху на зеленый треугольник
Ошибка!
Чтобы проект запустился нужно чтобы в проекте были:
• один или больше Controller
• один или больше View
После создания нового проекта Controller и View отсутствуют.
Controller и View сейчас создадим.
Шаг 3. Добавляем первый Controller
В архитектуре ASP.NET MVC входящие запросы обрабатываются контроллерами.
Контроллер это обычный C# класс (как правило, наследуются от System.Web.Mvc.Controller, базовый класс контроллеров).

В ASP.NET MVC контроллеры находятся в папке под названием Controllers, которую Visual Studio создала для нас при создании проекта.

Чтобы добавить контроллер в наш проект в окне Solution Explorer нажимаем правой клавишей мыши на
Controllers → Add → Controller
Назовите контроллер HomeController
В ASP.NET MVC есть соглашение 1:
Имена, которые мы даем контроллерам, должны заканчиваться словом Controller
Нажимаем Add и будет создан HomeController.cs
У нас добавился Controller

Теперь если нажимем вверху на зеленый треугольник т.е. запустим приложение
На экране увидим ошибку
Ошибка! Потому что наш Contoller пытается найти View (представление) и не находит.
Это сообщение об ошибке очень полезно.
В сообщении указано, что ASP.NET MVC не смог найти View (представление) для нашего метода, а также показано, где искал.
В ASP.NET MVC есть соглашение 2:
View (представление) связано с методом в Controller при помощи имени.

То есть
название класса View
должно совпадать с
названием метода в Controller
На заметку! В словесной терминалогии метод в Controller называется метод действия

Наш Controller называется Home,
Наш метод действия называется Index
  C#     Вспомним наш контроллер файл HomeController.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace WebApplication2.Controllers
{
     public class HomeController : Controller
     {
          public ActionResult Index()
          {
               return View();
          }
     }
}
Объяснение!
Наш класс называется HomeController поэтому мыслено убираем слово Controller и получаем что наш контроллер называется Home
Внутри нашего класса HomeController есть метод Index это и есть название метода действия
Шаг 4. Добавляем первое View
Нажимаем правой клавишей мыши по методу Index в файле HomeController.cs и нажимаем на Add View ...
Снимем галочку [ ] Use a layout or master page.
Нажимаем Add

Visual Studio в папке Views/Home создал новый файл Index.cshtml
Видим что файл содержит стандартный HTML. Исключение составляет лишь код:
@{
   Layout = null;
}
Данное выражение будет дополнительно разобрано движком Razor.
Шаг 5. Добавляем текст "Hello! World!!!" во View
Открываем Index.cshtml это в папке Views/Home и пишем "Hello! World!!!"
  Html     Файл Index.cshtml
@{
     Layout = null;
}

<!DOCTYPE html>

<html>
<head>
     <meta name="viewport" content="width=device-width" />
     <title>Index</title>
</head>
<body>
     <div>
          Hello! World!!!
     </div>
</body>
</html>
Шаг 6. Запускаем ASP.NET MVC приложение
Нажимаем вверху на зеленый треугольник
Откроется страница в браузере и мы увидим текст "Hello World!!!"
Итог
Вы заметили, что пример запустился с адресом: localhost:1764/Home/Index
localhost:1764
Это имя сервера и порт
localhost это локальный компьютер
1764 это номер порта
Home
Это класс контроллера, который по полному называется HomeController
Index
Это название метода контроллера
  C#     Наш контроллер файл HomeController.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace WebApplication2.Controllers
{
     public class HomeController : Controller
     {
          public ActionResult Index()
          {
               return View();
          }
     }
}
return View вызовет Views/Home/Index.cshtml файл
То есть метод контроллера вызовет соответствующее View (представление)

Вот наше представление (в виде html файла)
  Html     Views/Home/Index.cshtml
@{
     Layout = null;
}

<!DOCTYPE html>

<html>
<head>
     <meta name="viewport" content="width=device-width" />
     <title>Index</title>
</head>
<body>
     <div>
          Hello! World!!!
     </div>
</body>
</html>
Скачать пример
MyAspNetWebApplication.zip ...
 
← Previous topic
Что такое MVC в ASP.NET ?
 
Next topic →
Передаем данные из контроллера в представление в ASP.NET MVC. Используем ViewBag, ViewData, TempData, Model (строго типизированное представление)
 
Your feedback ... Comments ...
   
Your Name
Your comment (www links can only be added by a logged-in user)
  Объявления  
  Объявления  
 
• Что такое MVC в ASP.NET ?
• Создаем новое приложение ASP.NET MVC
Контроллер (Controller)
• Передаем данные из контроллера в представление в ASP.NET MVC. Используем ViewBag, ViewData, TempData, Model (строго типизированное представление)
Представление (View)
• Что такое View (представление) и операторы Razor в ASP.NET MVC
• Создаем переменную и выводим на экран во View в ASP.NET MVC
• @using внутри View в ASP.NET MVC
• @foreach(var item in arr) {...} внутри View в ASP.NET MVC
• @DateTime.Now внутри View в ASP.NET MVC
• Как узнать имя контроллера внутри View в ASP.NET MVC
• Отображаем [DateTime | только Date | только Time] в нужном формате в ASP.NET MVC
Разновидности представлений (View)
• Строго типизированное представление (Strongly-typed-view) в ASP.NET MVC
...
• Мастер представление (Master View) с использованием @RenderBody() в ASP.NET MVC
• Мастер представление (Master View) с использованием @RenderBody() и дополнительных секций @RenderSection в ASP.NET MVC
...
• Частичное представление (Partial View) в ASP.NET MVC. Встраиваем частичное представление @Html.Partial("My1") и @{ Html.RenderPartial("My1");}
• При нажатии submit внутри partial view происходит ajax вызов метода controller. Метод controller должен возвращать PartialView(model) | ASP.NET MVC
...
• Строго типизированное частичное представление (Strongly-typed partial view) в ASP.NET MVC
Создаем папку ViewModels. Это хороший стиль программирования для передачи данных из Controller во View
• Создаем папку ViewModels. Создаем свой класс в папке ViewModels. Это хороший стиль программирования для передачи данных из Controller во View. Web приложение ASP.NET MVC
Атрибуты. Используем атрибуты во ViewModels(чтобы показать кнопки, combo в представлении). Используем атрибуты в Controller (чтобы улучшить методы)
• Аттрибут [Display(Name = "...")] описывается в C# классе и используется в @Html.LabelFor, @Html.DisplayNameFor в ASP.NET MVC
• Аттрибут [Required(ErrorMessage = "Пожалуйста, введите название")] описывается для свойства в C# классе и требует чтобы свойство было заполнено, если не заполнено на экране ошибка ErrorMessage в ASP.NET MVC
• Аттрибут [Remote("IsValidAuthor", "Home", ErrorMessage = "Enter correct author of book")] описывается для свойства в C# классе и проверяет это свойство на правильность на сервере через метод IsValidAuthor в conroller Home, если метод возвращает false, то на экране будет ошибка ErrorMessage в ASP.NET MVC
• Аттрибут [HiddenInput(DisplayValue = false)] описывается в C# классе и используется в @Html.HiddenFor в ASP.NET MVC
Маршрутизация
Ссылки и перенаправления в представлении
• @Html.ActionLink внутри View в ASP.NET MVC
• @Html.RouteLink внутри View в ASP.NET MVC
• @Url.Action внутри View в ASP.NET MVC
• @Url.RouteUrl внутри View в ASP.NET MVC
• @Url.Content внутри View в ASP.NET MVC
Bootstrap в MVC
• Добавляем и подключаем Bootstrap (css, js файлы) в ASP.NET MVC проект
JQuery в МVС
• Подключаем JQuery в ASP.NET MVC проект
• С помощью JQuery получаем содержимое View (представления) в ASP.NET MVC. Пример: $.get("/Home/Index", function (data) {...}) ...
Класс AjaxExtensions в МVС (асинхронное получение данных)
• Подключаем jQuery & AJAX в ASP.NET MVC проект
• С помощью Ajax.ActionLink получаем содержимое View (представления) и вставляем в div в ASP.NET MVC
• Объект Ajax (это класс AjaxExtensions) в ASP.NET МVС
База данных (Entity Framework) в ASP.NET MVC
• Entity Framework в приложении ASP.NET MVC. Используем Code First (пишем c# код, а таблицы в базе данных создаются сами)
Аутентификация (login/register/logout)
• Что такое аутентификация (login/register/logout) в ASP.NET MVC ?
• Пример: Аутентификация (login/register/logout) в ASP.NET MVC используя аутентификацию форм FormsAuthentication.SetAuthCookie(model.Name, true);
Авторизация (admin/user/...)
• Что такое авторизация (admin/user/...) в ASP.NET MVC ?
• Пример: Авторизация (admin/user/...) в ASP.NET MVC используя провайдер ролей RoleProvider
Пишем приложение "Планирование дел, задач" в ASP.NET MVC
• Создаем пустое приложение "Планирование дел, задач" | ASP.NET MVC | Visual Studio 2017
• Добавляем библиотеки Bootstrap & jQuery в приложение "Планирование дел, задач" | ASP.NET MVC | Visual Studio 2017
• Создаем мастер-представление (главное меню & логин кнопки используя Bootstrap) в приложении "Планирование дел, задач" | ASP.NET MVC | Visual Studio 2017
• Добавляем контроллер "Home" и представление "Index" (главная страница в приложении "Планирование дел, задач" | ASP.NET MVC | Visual Studio 2017
• Добавляем библиотеку Entity Framework и создаем соединиение с Базой данных в приложении "Планирование дел, задач" | ASP.NET MVC | Visual Studio 2017
• Аутентификация (login/register/logout) в приложении "Планирование дел, задач" | ASP.NET MVC | Visual Studio 2017
• Добавляем класс "Task" для сохранения дел, задач в базу данных в приложении "Планирование дел, задач" | ASP.NET MVC | Visual Studio 2017
• Добавление nUnit в приложении "Планирование дел, задач" | ASP.NET MVC | Visual Studio 2017
Дополнительные темы, вопросы
• Чем ASP.NET MVC лучше ASP.NET Web Forms ?
• Выбор между ASP.NET Core и ASP.NET ?
• Как выбрать интернет браузер чтобы в нем запускался .NET проект
• Как узнать локальный адрес и порт вашего ASP.NET MVC приложения ?
• Scripts\index.d.ts(8,1): error TS1008: Build:Unexpected token; 'module, class, interface, enum, import or statement' expected. Scripts\index.d.ts(8,13): error TS1005: Build:';' expected. в Visual Studio 2017 в приложении ASP.NET MVC
• Error "unable to connect to web server "iis express" | ASP.NET MVC | Visual Studio 2017
• Error "This site can't be reached" when run ASP.NET application | Solution: Recreate the Self-Signed HTTPS Certificate for localhost in IIS Express
WWW сайты для изучения ASP.NET MVC
• Cайты для изучения ASP.NET MVC
  Ваши вопросы присылайте по почте: info@dir.by  
Яндекс.Метрика