Это первый шаг бесплатного руководства «NerdDinner», которое показывает, как построить маленькое, но полноценное веб-приложение, используя ASP.NET MVC.
Начнем наше приложение NerdDinner(ужин для ботанов) с выбора пункта меню File>New Project.
Мы увидим окно «New Project». Для создания ASP.NET MVC приложения, мы выберем пункт «Web» в левой части окна, а далее шаблон проекта «ASP.NET MVC Web Application» в правой части.

Убедитесь, что вы установили ASP.NET MVC, иначе вы не увидите данного пункта в «New Project». Также это можно сделать через Microsoft Web Platform Installer (ASP.NET MVC доступен в секции «Web Platform>Frameworks and Runtimes»)
Мы назовем новый проект «NerdDinner». После нажатия “OK” Visual Studio предложит выборочно создать проект для юнит-тестирования для нового проекта. Данный проект позволяет нам создать автоматизированные тесты, которые проверяют функциональность и поведение нашего приложения (мы рассмотрим данную тему в следующих шагах).
![clip_image002[6] clip_image002[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/8c5/ca7/f3b/8c5ca7f3b529f3f528b4d02c9cf9e25c.png)
Выпадающий список «Test framework» содержит все доступные шаблоны юнит-тестовых проектов для ASP.NET MVC на данной машине. Вы можете использовать Nunit, MBUnit и XUnit, а также встроенный Visual Studio Unit Test framework.
Visual Studio Unit Test framework доступен в Professional версии и выше, для Standard и Express версии нужно установить стороннее дополнение. Если не установлено ни одного тестового фреймворка, окно выбора не появляется.
Мы воспользуемся именем тестового проекта по умолчанию – «NerdDinner.Tests» и выберем фреймворк «Visual Studio Unit Test». После подтверждения Visual Studio создаст решение с двумя проектами, один для веб-приложения, второй для юнит-тестирования:
![clip_image003[8] clip_image003[8]](https://habrastorage.org/r/w1560/getpro/habr/post_images/95b/cd2/0fe/95bcd20fe191407389c903e311d8b8c1.png)
Когда вы создаете новой ASP.NET MVC приложение с Visual Studio, она автоматически добавляет нужный список директорий и файлов в проект:
![clip_image004[6] clip_image004[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/990/e05/e7f/990e05e7fc90d50157cb2806319d8059.png)
У ASP.NET MVC проекта, по умолчанию, шесть высокоуровневых директорий:
/Controllers – Куда вы помещаете классы Controller для обработки URL запросов
/Models – Где вы размещаете классы для предоставления и манипулирования данными
/Views – Где вы храните файлы шаблонов UI, которые отвечают за прорисовку результата
/Scripts – Где вы располагаете файлы JavaScript библиотек и скрипты (.js)
/Content – Где вы размещаете CSS файлы и изображения, а также другие статические объекты.
/App_Data – Где вы храните файлы данных для записи и чтения.
ASP.NET MVC не требует от вас придерживаться данной структуры. Фактически, работая над большими приложениям разработчики обычно разделяют приложение на несколько проектов для гибкости. Например: классы моделей данных выносят в отдельный проект библиотеки. Тем не менее, структура проекта по умолчанию, предоставляет удобное решение, для сохранения чистоты и прозрачности структуры
Когда мы раскроем директорию /Controllers, то обнаружим, что Visual Studio добавила два класса котроллера – HomeController и AccountController, по умолчанию:
![clip_image005[6] clip_image005[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/c16/f23/6ba/c16f236ba2f6f167f98ad3626a57b15d.png)
В директории /Views находятся три поддиректории: /Home, /Account и /Shared, а также несколько файлов-шаблонов в каждой:
![clip_image006[6] clip_image006[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/90b/d72/d58/90bd72d5839ca6196887f68fd355e5c6.png)
Директории /Content и /Scripts хранят файл Site.css, который используется для оформления всего HTML на сайте, а также JavaScript библиотеки, которые предоставляют приложению поддержку jQuery и ASP.NET AJAX:
![clip_image007[6] clip_image007[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/907/91a/6e9/90791a6e9c1c246fd377868b7365f4c7.png)
Проект NerdDinner.Test хранит всего-лишь два класса, которые содержат юнит-тесты для наших классов котроллеров:
![clip_image008[6] clip_image008[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/23b/01c/7cc/23b01c7cc43764493516fe2ee4892740.png)
Перечисленные файлы, которые добавляются Visual Studio в проект по умолчанию, предоставляют нам базовую структуру работающего приложения, дополняя домашней страницей, about страницей, страницами для регистрации/входа/выхода и страницей необработанных ошибок.
Мы можем запустить проект, выбрав в меню Debug>StartDebugging или Debug>Start Without Debugging:
![clip_image009[6] clip_image009[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/c59/e77/924/c59e77924dac3485c217806d8355b41b.png)
Проект запустится используя встроенный в Visual Studio ASP.NET Web-сервер:
![clip_image010[6] clip_image010[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/62c/d34/52f/62cd3452f880cc693de6154f0a29ea5d.png)
Ниже расположена домашняя страница нашего нового проекта (URL: “/”) после запуска:
![clip_image011[6] clip_image011[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/773/789/b23/773789b2372702d004dde817ecb3803d.png)
Нажав на ссылку «About», вы увидите about страницу (URL: “/Home/About”):
![clip_image012[6] clip_image012[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/6ea/077/14c/6ea07714c8dc14c703a52d4a66a029af.png)
Нажав на “Log On” в правом верхнем углу, мы перенесемся на страницу авторизации (URL: “/Account/LogOn”):
![clip_image013[6] clip_image013[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/8a3/d1b/dbb/8a3d1bdbbc2f19cb6084c6c46b9e282c.png)
Ежели у нас отсутствует логин, мы можем перейти на регистрацию (URL: “/Account/Register”):
![clip_image014[7] clip_image014[7]](https://habrastorage.org/r/w1560/getpro/habr/post_images/cf2/d2b/c0c/cf2d2bc0cc8f11d28c595fa14b47f186.png)
Код, который отвечает за реализацию home, about и logout/register функциональность добавлен по умолчанию, во время создания проекта. Вы будем использовать его, как отправную точку в нашем проекте.
Если мы используем Professional версию Visual Studio и выше, то можем воспользоваться встроенной поддержкой юнит-тестирования в IDE:
![clip_image016[7] clip_image016[7]](https://habrastorage.org/r/w1560/getpro/habr/post_images/148/118/862/148118862c167eff02079fc35f0d2b15.png)
Выбрав один из вариантов, откроется панель «Test Results», которая предоставляет нам статус каждого из 27 встроенных юнит-тестов в виде Прошел/не прошел.
![clip_image017[6] clip_image017[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/867/790/7a6/8677907a62045084e641a488c0d3ef89.png)
Позже в данном руководстве мы поговорим о автоматизированном тестировании и добавим дополнительные юнит-тесты, которые покроют функционал приложения, реализованные нами.
И так, мы имеем базовую структуру приложения и можем перейти к созданию базы данных для хранения данных приложения.
Начнем наше приложение NerdDinner(ужин для ботанов) с выбора пункта меню File>New Project.
Мы увидим окно «New Project». Для создания ASP.NET MVC приложения, мы выберем пункт «Web» в левой части окна, а далее шаблон проекта «ASP.NET MVC Web Application» в правой части.

Убедитесь, что вы установили ASP.NET MVC, иначе вы не увидите данного пункта в «New Project». Также это можно сделать через Microsoft Web Platform Installer (ASP.NET MVC доступен в секции «Web Platform>Frameworks and Runtimes»)
Мы назовем новый проект «NerdDinner». После нажатия “OK” Visual Studio предложит выборочно создать проект для юнит-тестирования для нового проекта. Данный проект позволяет нам создать автоматизированные тесты, которые проверяют функциональность и поведение нашего приложения (мы рассмотрим данную тему в следующих шагах).
![clip_image002[6] clip_image002[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/8c5/ca7/f3b/8c5ca7f3b529f3f528b4d02c9cf9e25c.png)
Выпадающий список «Test framework» содержит все доступные шаблоны юнит-тестовых проектов для ASP.NET MVC на данной машине. Вы можете использовать Nunit, MBUnit и XUnit, а также встроенный Visual Studio Unit Test framework.
Visual Studio Unit Test framework доступен в Professional версии и выше, для Standard и Express версии нужно установить стороннее дополнение. Если не установлено ни одного тестового фреймворка, окно выбора не появляется.
Мы воспользуемся именем тестового проекта по умолчанию – «NerdDinner.Tests» и выберем фреймворк «Visual Studio Unit Test». После подтверждения Visual Studio создаст решение с двумя проектами, один для веб-приложения, второй для юнит-тестирования:
![clip_image003[8] clip_image003[8]](https://habrastorage.org/r/w1560/getpro/habr/post_images/95b/cd2/0fe/95bcd20fe191407389c903e311d8b8c1.png)
Исследуем структуру директорий NerdDinner
Когда вы создаете новой ASP.NET MVC приложение с Visual Studio, она автоматически добавляет нужный список директорий и файлов в проект:
![clip_image004[6] clip_image004[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/990/e05/e7f/990e05e7fc90d50157cb2806319d8059.png)
У ASP.NET MVC проекта, по умолчанию, шесть высокоуровневых директорий:
/Controllers – Куда вы помещаете классы Controller для обработки URL запросов
/Models – Где вы размещаете классы для предоставления и манипулирования данными
/Views – Где вы храните файлы шаблонов UI, которые отвечают за прорисовку результата
/Scripts – Где вы располагаете файлы JavaScript библиотек и скрипты (.js)
/Content – Где вы размещаете CSS файлы и изображения, а также другие статические объекты.
/App_Data – Где вы храните файлы данных для записи и чтения.
ASP.NET MVC не требует от вас придерживаться данной структуры. Фактически, работая над большими приложениям разработчики обычно разделяют приложение на несколько проектов для гибкости. Например: классы моделей данных выносят в отдельный проект библиотеки. Тем не менее, структура проекта по умолчанию, предоставляет удобное решение, для сохранения чистоты и прозрачности структуры
Когда мы раскроем директорию /Controllers, то обнаружим, что Visual Studio добавила два класса котроллера – HomeController и AccountController, по умолчанию:
![clip_image005[6] clip_image005[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/c16/f23/6ba/c16f236ba2f6f167f98ad3626a57b15d.png)
В директории /Views находятся три поддиректории: /Home, /Account и /Shared, а также несколько файлов-шаблонов в каждой:
![clip_image006[6] clip_image006[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/90b/d72/d58/90bd72d5839ca6196887f68fd355e5c6.png)
Директории /Content и /Scripts хранят файл Site.css, который используется для оформления всего HTML на сайте, а также JavaScript библиотеки, которые предоставляют приложению поддержку jQuery и ASP.NET AJAX:
![clip_image007[6] clip_image007[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/907/91a/6e9/90791a6e9c1c246fd377868b7365f4c7.png)
Проект NerdDinner.Test хранит всего-лишь два класса, которые содержат юнит-тесты для наших классов котроллеров:
![clip_image008[6] clip_image008[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/23b/01c/7cc/23b01c7cc43764493516fe2ee4892740.png)
Перечисленные файлы, которые добавляются Visual Studio в проект по умолчанию, предоставляют нам базовую структуру работающего приложения, дополняя домашней страницей, about страницей, страницами для регистрации/входа/выхода и страницей необработанных ошибок.
Запуск приложения NerdDinner
Мы можем запустить проект, выбрав в меню Debug>StartDebugging или Debug>Start Without Debugging:
![clip_image009[6] clip_image009[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/c59/e77/924/c59e77924dac3485c217806d8355b41b.png)
Проект запустится используя встроенный в Visual Studio ASP.NET Web-сервер:
![clip_image010[6] clip_image010[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/62c/d34/52f/62cd3452f880cc693de6154f0a29ea5d.png)
Ниже расположена домашняя страница нашего нового проекта (URL: “/”) после запуска:
![clip_image011[6] clip_image011[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/773/789/b23/773789b2372702d004dde817ecb3803d.png)
Нажав на ссылку «About», вы увидите about страницу (URL: “/Home/About”):
![clip_image012[6] clip_image012[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/6ea/077/14c/6ea07714c8dc14c703a52d4a66a029af.png)
Нажав на “Log On” в правом верхнем углу, мы перенесемся на страницу авторизации (URL: “/Account/LogOn”):
![clip_image013[6] clip_image013[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/8a3/d1b/dbb/8a3d1bdbbc2f19cb6084c6c46b9e282c.png)
Ежели у нас отсутствует логин, мы можем перейти на регистрацию (URL: “/Account/Register”):
![clip_image014[7] clip_image014[7]](https://habrastorage.org/r/w1560/getpro/habr/post_images/cf2/d2b/c0c/cf2d2bc0cc8f11d28c595fa14b47f186.png)
Код, который отвечает за реализацию home, about и logout/register функциональность добавлен по умолчанию, во время создания проекта. Вы будем использовать его, как отправную точку в нашем проекте.
Тестирование NerdDinner приложения
Если мы используем Professional версию Visual Studio и выше, то можем воспользоваться встроенной поддержкой юнит-тестирования в IDE:
![clip_image016[7] clip_image016[7]](https://habrastorage.org/r/w1560/getpro/habr/post_images/148/118/862/148118862c167eff02079fc35f0d2b15.png)
Выбрав один из вариантов, откроется панель «Test Results», которая предоставляет нам статус каждого из 27 встроенных юнит-тестов в виде Прошел/не прошел.
![clip_image017[6] clip_image017[6]](https://habrastorage.org/r/w1560/getpro/habr/post_images/867/790/7a6/8677907a62045084e641a488c0d3ef89.png)
Позже в данном руководстве мы поговорим о автоматизированном тестировании и добавим дополнительные юнит-тесты, которые покроют функционал приложения, реализованные нами.
Следующий шаг
И так, мы имеем базовую структуру приложения и можем перейти к созданию базы данных для хранения данных приложения.