Визуальное руководство по Visual Web Developer

В этом разделе дан краткий обзор многих компонентов и средств, включенных в среду Visual Web Developer. Visual Web Developer — это набор компонентов, которые используются для создания веб-проектов в среде Visual Studio 2010 или Visual Web Developer 2010, экспресс-выпуск.

В этом разделе содержатся следующие подразделы.

При запуске Visual Studio по умолчанию сначала открывается начальная страница. Начальная страница обеспечивает быстрый доступ к проектам, их созданию, сведениям о предстоящих выпусках продуктов и мероприятиях для специалистов, а также о последних новостях в области разработки. Чтобы открыть начальную страницу, в меню Вид выберите Начальная страница.

На начальной странице также приводятся указания и ресурсы для создания проекта. Указания включают такие задачи, как планирование и отслеживание приложения, разработка кода, создание и тестирование кода, а также администрирование приложений.

На следующей иллюстрации показана начальная страница Visual Studio.

Начальная страница Visual Studio

Интегрированная среда разработки, в которой установлены общие параметры разработки.

Решения и соответствующие проекты содержат элементы, представляющие страницы, файлы кодов, папки, ссылки и подключения к данным, являющиеся частью приложения. Решение — это контейнер, который может содержать несколько проектов. Проект обычно содержит несколько файлов, папок и другие ресурсы. Дополнительные сведения см. в разделах Решения как контейнеры и Проекты как контейнеры.

Веб-проекты

При использовании Visual Web Developer обычно создаются проекты веб-приложений ASP.NET или проекты веб-сайтов ASP.NET. Проекты обоих типов позволяют создать веб-приложение.

При выборе между проектом веб-приложения и проектом веб-сайта следует рассмотреть два основных фактора — планируемый способ развертывания проекта и способ его сопровождения после развертывания. Перед созданием проекта важно выбрать подходящий тип проекта. Дополнительные сведения см. в разделе Сравнение проектов веб-приложений с проектами веб-сайтов.

Диалоговое окно Новый веб-узел позволяет создать новый веб-сайт на локальном или удаленном компьютере или подключиться к веб-сайту по протоколу FTP для чтения и записи файлов. На следующей иллюстрации показано диалоговое окно Новый веб-узел.

Диалоговое окно "Создать веб-узел".

Диалоговое окно "Новый веб-узел".

Диалоговое окно Новый проект позволяет создать новое веб-приложение. Дополнительные сведения см. в разделе Практическое руководство. Создание решений и проектов. На следующей иллюстрации показано диалоговое окно Новый проект.

Диалоговое окно "Создание проекта"

Диалоговое окно "Новый веб-узел".

Дополнительные сведения о веб-проектах см. в разделе Типы проектов веб-сайтов в Visual Studio.

Элементы веб-проектов

После создания веб-проекта используйте диалоговое окно Добавление нового элемента для добавления страниц и других элементов в проект. При выборе элемента в списке установленных шаблонов этот элемент добавляется в проект. Элементы отображаются в списке в зависимости от выбранного языка программирования, типа проекта и целевой версии платформы .NET Framework. На следующей иллюстрации показано диалоговое окно Добавление нового элемента.

Диалоговое окно "Добавление нового элемента".

Диалоговое окно ''Добавление нового элемента''

В семействе продуктов Visual Studio совместно используется одна интегрированная среда разработки, состоящая из таких элементов, как панели инструментов, окна инструментов (которые могут закрепляться или скрываться автоматически) и окна редакторов. При разработке веб-приложений используются инструменты, меню и панели инструментов, которые относятся к веб-проектам.

ПримечаниеПримечание

Инструменты, меню и панели инструментов, относящиеся к веб-проектам, отображаются в Visual Studio при выборе коллекции параметров Веб-разработка при первом запуске Visual Studio. Дополнительные сведения см. в разделе Практическое руководство. Выбор параметров среды веб-разработки.

На следующей иллюстрации представлены окна и инструменты, доступные в среде Visual Web Developer.

ПримечаниеПримечание

На этой иллюстрации показаны окна и расположения окон по умолчанию. Меню Вид позволяет открывать дополнительные окна. Можно также изменять порядок и размеры окон согласно своим предпочтениям. Если в среду разработки уже внесены изменения, увиденное в интерфейсе IDE не будет соответствовать данной иллюстрации.

Среда Visual Web Developer

Схематика окно и средств IDE

Многие окна инструментов, используемые в среде Visual Web Developer, можно закреплять. Их можно настроить так, чтобы они были постоянно видны (закреплены) или исчезали из виду, когда не используются (автоскрытие).

Настройка меню и панелей инструментов

Меню и панели инструментов в среде Visual Web Developer можно настраивать. Чтобы настроить команды меню и панели инструментов, выберите в меню Сервис пункт Настроить. Появится диалоговое окно Настройка. Ниже показано диалоговое окно Настройка.

Диалоговое окно "Настройка"

Диалоговое окно "Настройки"

Диалоговое окно Настройка позволяет выбирать панели инструментов для отображения, создавать пользовательские панели инструментов и меню, добавлять элементы на панели инструментов и в меню и удалять их оттуда, а также изменять внешний вид элементов на панелях инструментов и в меню.

Обозреватель решений

В обозревателе решений отображаются решения, проекты и элементы в этих проектах. Обозреватель решений обеспечивает упорядоченное представление проектов и их файлов, а также доступ к связанным с ними командам.

В окне Обозревательрешений можно открывать файлы для редактирования, добавлять новые файлы в проект и задавать свойства решений, проектов и элементов. На панели инструментов, связанной с этим окном, предлагаются типовые команды, которые используются для управления выбираемым в окне элементом. Для доступа к окну Обозреватель решений выберите в меню Вид пункт Обозреватель решений. На следующей иллюстрации показано окно Обозреватель решений.

Окно "Обозреватель решений"

Обозреватель решений с файлами преобразования Web.config
ПримечаниеПримечание

На иллюстрации имеется вкладка Командный обозреватель. Эта вкладка доступна при использовании выпуска Visual Studio Team System.

Дополнительные сведения см. в разделах Использование обозревателя решений и Практическое руководство. Создание решений и проектов.

Окно "Свойства"

Окно Свойства используется для просмотра и задания свойств и событий объектов при работе с ними в редакторе и конструкторе страниц. Окно Свойства можно также использовать для просмотра и изменения свойств файлов, проектов и решений. Чтобы открыть окно Свойства, выберите в меню Вид пункт Окно свойств.

Окно Свойства позволяет работать со значениями свойств по-разному в зависимости от выбранного свойства. Для некоторых свойств введите значение в текстовом поле. Для других свойств используйте раскрывающийся список или нажмите кнопку, чтобы открыть диалоговое окно специализированного редактора. Свойства, отображаемые серым цветом, доступны только для чтения. На следующей иллюстрации показано окно Свойства.

Окно "Свойства"

окно “Свойства”

Обозреватель серверов

Окно Обозреватель серверов можно использовать, чтобы открывать подключения к данным, входить на серверы и просматривать серверные базы данных и службы.

ПримечаниеПримечание

В среде Visual Web Developer Express, окно Обозреватель серверов называется Обозреватель баз данных, поскольку оно обеспечивает доступ только к подключениям к базам данных, а не к другим серверным службам.

При работе с окнами конструктора в среде Visual Studio обычно можно перетаскивать элементы из окна Обозреватель серверов в рабочую область конструирования. При этом создаются новые компоненты, которые настраиваются для ссылки на выбранный элемент.

Дополнительные сведения см. в разделе Обращение к серверным ресурсам с помощью обозревателя серверов. На следующей иллюстрации показано окно Обозреватель серверов.

Окно обозревателя серверов

Обозреватель серверов

Для создания страниц и написания кода используются редактор и окна конструкторов. Функциональность применяемых редактора и конструкторов зависит от типа используемого файла или документа.

В редакторах и конструкторах веб-страниц имеется два представления: графическое представление конструирования и представление исходного кода. При работе с веб-страницей представление Конструктор позволяет видеть элементы управления и другие элементы в режиме, подобном режиму WYSIWYG. На следующей иллюстрации показана среда Visual Web Developer в представлении Конструктор.

Конструктор веб-страниц, представление конструирования

Конструктор веб-страниц, просмотр конструктора

В представлении Исходный код отображается исходный код файла. В этом представлении поддерживаются такие вспомогательные средства создания кода, как IntelliSense, сворачиваемые разделы кода, рефакторинг и вставка фрагментов кода. В представлении Исходный код также поддерживаются возможности редактирования, например перенос по словам, использование закладок и номеров строк. Дополнительные сведения см. в разделе Команды и функции для повышения удобства работы в редакторах. На следующей иллюстрации показана среда Visual Web Developer в представлении Исходный код.

Конструктор веб-страниц, представление исходного кода

Конструктор веб-страниц, просмотр источника
ПримечаниеПримечание

В представлении Конструктор или Исходный код можно перетаскивать элементы управления с панели элементов на страницу.

В некоторых редакторах также предусмотрено представление, позволяющее одновременно видеть представление конструирования и представление исходного кода. Такое представление называется представлением с разделением. На следующей иллюстрации показана среда Visual Web Developer в представлении с разделением.

Конструктор веб-страниц, представление с разделением

Просмотр разделенной вкладки конструктора HTML

Редактирование веб-страниц в конструкторе

Веб-страница ASP.NET состоит из визуальных элементов и программной логики. К визуальным элементам страницы относятся разметка, серверные элементы управления и статический текст. К программной логике страницы относятся обработчики событий и другой код. При работе с веб-страницами ASP.NET можно работать с разметкой в конструкторе и с кодом в редакторе кода.

На панели инструментов отображаются элементы управления, которые можно добавлять в проекты Visual Web Developer. Чтобы открыть панель элементов, выберите в меню Вид пункт Панель элементов.

На следующей иллюстрации показана панель элементов.

Панель элементов

Панель элементов

Окно Свойства CSS используется при редактировании веб-страницы ASP.NET. В этом окне отображаются стили, используемые в выделенном в данный момент фрагменте веб-страницы. Здесь также указан порядок очередности этих стилей. Кроме того, в данном окне представлен исчерпывающий список свойств CSS. Это позволяет добавлять свойства к существующим стилям, изменять уже установленные свойства. а также создавать новые встроенные стили. Дополнительные сведения см. в разделе Практическое руководство. Использование окна "Свойства CSS". На следующей иллюстрации показано окно Свойства CSS.

Окно свойств CSS

Свойства сетки CSS

Помимо использования окна Свойства CSS, управление стилями осуществляется с помощью окна Управление стилями, а применение стилей CSS — с помощью окна Применить стили. Дополнительные сведения см. в разделе Практическое руководство. Использование диалоговых окон "Применить стили" и "Управление стилями".

Для обеспечения возможности отображения веб-приложения необходимо выполнить его компиляцию или построение. В среде Visual Web Developer предусмотрен широкий набор параметров построения (компиляции) и отладки. Используя конфигурации построений, можно выбрать компоненты для построения, исключить те компоненты, которые не требуется включать в законченное приложение, и указать сведения о построении проекта. Конфигурации построений можно создавать для решений и проектов. Дополнительные сведения см. в разделах Практическое руководство. Создание и изменение конфигураций и Построение на стадии разработки приложения.

При построении начинается процесс отладки. Построение приложений позволяет обнаруживать ошибки времени компиляции. К этим ошибкам могут относиться неверный синтаксис, ошибки в зарезервированных словах и несовпадения типов. Ошибки этих типов отображаются в окне Вывод. На следующей иллюстрации показано окно Вывод.

Окно вывода со сведениями о построении

Окно вывода со сведениями о построении

После построения приложения можно использовать отладчик для обнаружения и устранения проблем, возникающих во время выполнения, например логических ошибок. Выполнение кода можно остановить (приостановить). В режиме приостановки можно проверить локальные переменные и другие данные с помощью таких средств, как окно Переменная, диалоговое окно Быстрая проверка и окна Память. Дополнительные сведения см. в разделах Окна переменных и Окно памяти. На следующих иллюстрациях показаны окна средств отладки.

Окна отладки

Средства отладки

В окне Список ошибок отображаются ошибки, предупреждения и другие сообщения, связанные с отладкой. Дополнительные сведения см. в разделе Путеводитель по отладчику.

В Visual Studio, ASP.NET и IIS предусмотрены средства, помогающие развернуть веб-приложение или веб-сайт. Некоторые средства Visual Studio работают только с проектами веб-приложений, а другие средства — только с проектами веб-сайтов.

Сведения о различиях между проектами веб-приложений и веб-сайтов см. в разделе Сравнение проектов веб-приложений с проектами веб-сайтов.

Развертывание проектов веб-приложений

Ниже перечислены типичные сценарии веб-развертывания проектов веб-приложений.

  • Развертывание веб-приложения на удаленном сервере из Visual Studio.

  • Развертывание веб-приложения с помощью Visual Studio для создания пакета (ZIP-файла), который содержит сведения, необходимые для развертывания, и может быть установлен на целевом веб-сервере.

  • Развертывание веб-приложения в процессе пакетной обработки с помощью таких специальных средств, как MSBuild.

Дополнительные сведения об этих сценариях развертывания и других возможностях развертывания проектов веб-приложений см. в разделе Карта содержимого развертывания ASP.NET.

Развертывание проектов веб-сайтов

Ниже перечислены типичные сценарии веб-развертывания проектов веб-сайтов.

  • Развертывание веб-сайта с помощью средства Копировать веб-сайт, которое позволяет копировать и синхронизировать файлы между данным компьютером и целевым компьютером или расположением.

  • Развертывание веб-сайта с помощью команды Windows XCopy.

  • Развертывание предварительно построенного (скомпилированного) веб-сайта.

Дополнительные сведения об этих сценариях развертывания и других возможностях развертывания проектов веб-сайтов см. в разделе Карта содержимого развертывания ASP.NET.

Доступ к справке можно получить, нажав F1 в интерфейсе IDE и выбрав пункт Просмотр справки в меню Справка. Документация отобразится в веб-браузере. Можно использовать локально установленную справку или читать документацию на веб-сайте MSDN. На следующей иллюстрации показана контекстная справка в окне браузера.

Отображение справки в окне браузера

Страница поиска в “Справка”
Показ: