Учебный курс по WebMatrix, часть 16. Разработка ASP.NET WebPages и Razor в Visual Studio
Это завершающая глава учебного курса по WebMatrix. Предыдущие части руководство можно найти здесь:
- Учебный курс по WebMatrix, глава 1. Начало работы с WebMatrix и веб-страницами ASP.NET Учебный курс по WebMatrix, глава 2. Использование кода веб-страниц ASP.NET
- Учебный курс по WebMatrix, глава 3. Более сложный пример на ASP.NET
- Учебный курс по WebMatrix, глава 4. Знакомство с синтаксисом Razor. Рекомендации по программированию
- Учебный курс по WebMatrix, глава 5. Знакомство с синтаксисом Razor, серверный код и ASP.NET
- Учебный курс по WebMatrix, глава 6. Знакомство с синтаксисом Razor. Обработка ошибок
- Учебный курс по WebMatrix, глава 7. Работа с формами
- Учебный курс по WebMatrix, глава 8. Работа с данными
- Учебный курс по WebMatrix, глава 9. Отображение данных
- Учебный курс по WebMatrix, глава 10. Работа с изображениями
- Учебный курс по WebMatrix, глава 11. Работа с видео
- Учебный курс по WebMatrix, глава 12. Кэширование и оптимизация производительности
- Учебный курс по WebMatrix, глава 13. Анализ трафика и посещаемости
- Учебный курс по WebMatrix, глава 14. Оптимизация для поисковых систем
- Учебный курс по WebMatrix, глава 15. Использование пакетного менеджера
В этой главе будет рассказано, как использовать Visual Studio 2010 или Visual Web Developer 2010 Express для разработки сайтов на базе ASP.NET Web Pages и синтаксиса Razor.
Вы научитесь тому, как установить бесплатную среду Visual Web Developer 2010 Express и инструменты ASP.NET Razor Tools, а так же как использовать функции Visual Studio, такие как IntelliSense и отладку.
Зачем использовать Visual Studio?
Вы можете разрабатывать веб-сайты на базе ASP.NET Web pages и синтаксиса Razor с помощью WebMatrix или многих других редакторов кода. Например, вы можете использовать Microsoft Visual Studio 2010, которая является полнофункциональной интегрированной средой разработки (IDE) предлагающей мощный набор инструментов для создания приложений разных типов (не только веб-сайтов). Для того чтобы работать со страницами ASP.NET Razor, вы можете использовать как полную редакцию Visual Studio, так и ее бесплатную редакцию Visual Web Developer Express.
Есть две полезные функции Visual Studio, которыми располагает Visual Studio для программирования веб-страниц на ASP.NET Razor:
- IntelliSense – увеличивает вашу продуктивность с помощью автозавершения кода и вывода информации о класса и методах, с которыми вы работаете в редакторе (WebMatrix включает в себя IntelliSense для некоторых языков, например HTML и CSS, но не для C#. В будущем, с выходом второй версии, WebMatrix получит улучшения, сравнимые по функционалу с Visual Studio);
- Отладчик – позволяет вам исследовать причины неправильной работы кода, останавливая программу во время ее работы и исследуя состояние программы в данный момент, перемещаясь по коду от строки к строке.
Эти функции пока доступны только в Visual Studio.
Установка ASP.NET Razor Tools
В этой части руководства будет показано, как установить бесплатную редакцию Visual Web Developer Express 2010 и пакет инструментов ASP.NET Web Pages Tools for Visual Studio.
Установите Web Platform Installer, загрузив его по адресу:
https://www.microsoft.com/web/downloads/platform.aspx.
Запустите Web Platform Installer. Если вы еще не установили Visual Studio или Visual Web Developer Express, то найдите в списке Visual Web Developer Express и нажмите «добавить» (Add). Найдите в списке ASP.NET MVC 3 и нажмите «добавить». Этот пакет содержит инструменты для Visual Studio, которые позволяют строить сайты на базе ASP.NET Razor.
Нажмите «Установить» (Install) для завершения установки.
Использование ASP.NET Razor Tools for Visual Studio
Для того чтобы использовать IntelliSense или отладчик, вам необходимо создать в Visual Studio веб-сайт на базе ASP.NET Razor.
Запустите Visual Studio или Visual Web Developer. В меню File нажмите New Web Site. В диалоговом окне выберите язык программирования, который вы будете использовать для сайта (C# или Visual Basic). Выберите шаблон проекта ASP.NET Web Site (Razor). В ниспадающем меню выберите «File System» укажите путь для создания сайта.
Нажмите OK.
Использование IntelliSense
После того как вы создали сайт, вы можете увидеть как IntelliSense работает в Visual Studio. Откройте страницу Default.cshtml вашего сайта. После закрывающего тега </p> наберите @ServerInfo. (включая точку). Обратите внимание, как IntelliSense отображает доступные методы для хелпера ServerInfo в ниспадающем списке.
Выберите метод GetHtml из списка и нажмите Enter. IntelliSense автоматически добавит метод (как и для любого метода в C#, вы должны добавить скобки в конце). Финальный код будет выглядеть так:
@Server.GetHtml()
Нажмите Ctrl+F5 для запуска страницы. В своем браузере вы увидите следующее:
Закройте браузер и сохраните обновленную страницу Default.cshtml.
Использование отладчика
Вверху страницы Default.cshtml, после линии, которая начинается с Page.Title добавьте следующую линию кода:
var myTime = DateTime.Now.TimeOfDay;
Щелкните слева от кода в сером поле для того, чтобы добавить точку остановки (breakpoint) при отладке. Точка остановки (останова) – это метка, которая говорит отладчику, где нужно остановить выполнение программы для того, чтобы вы могли оценить состояние программы в нужный вам момент.
Удалите вызов метода ServerInfo.GetHtml и добавьте вызов переменной @myTime в этом месте. Этот вызов показывает текущее время. Обновленная страница будет выглядеть следующим образом:
Нажмите F5 для того, чтобы запустить страницу в режиме отладки. Выполнение страницы остановится в том месте где была установлена точка остановки. На картинке показано как будет выглядеть страница в редакторе вместе с точкой остановки (желтым), панелью отладки и кнопкой Step Into.
Нажмите Step Into (или кнопку F11). Это позволит перейти к следующей линии кода, нажатие F11 будет переводить вас дальше и дальше. Обратите внимание на значение переменной myTime, которое вы можете узнать наведя на нее мышью или же воспользовавшись панелями Locals и Call Stack.
Когда вы завершите изучение переменных нажмите F5 для продолжения работы вашей страницы уже без остановки на каждой линии кода. Так ваша страница будет выглядеть в браузере:
Для того чтобы узнать больше об отладчике и том, как отлаживать код в Visual Studio обратитесь к руководству Walkthrough: Debugging Web Pages in Visual Web Developer.