покрокове керівництво
Дане покрокове керівництво знайомить з основними можливостями програми Microsoft Visual Web Developer. Воно допоможе створити просту сторінку в Visual Web Developer, проілюструє базові методи створення нової сторінки, додавання елементів управління та написання коду.
У цьому покроковому керівництві, зокрема, розглядаються наступні завдання:
Створення файлового веб-вузла.
Ознайомлення з середовищем Visual Web Developer.
Створення однофайловий сторінки ASP.NET в Visual Web Developer.
Додавання елементів управління.
Додавання обробників подій.
Для виконання цього покрокового керівництва потрібно:
Програма Visual Web Developer.
Платформа .NET Framework.
В цьому розділі покрокового керівництва створюється веб-вузол, на який додається нова сторінка. Після цього на сторінку додається текст HTML, а сама сторінка виконується в браузері.
У ньому створюється веб-вузол на базі файлової системи. для якого не потрібні служби Microsoft IIS. Замість цього сторінка створюється і запускається в локальній файловій системі.
У файловому веб-сайті сторінки і інші файли зберігаються у вибраній папці на локальному комп'ютері. Інші параметри веб вузла включають веб-вузол локальної IIS. який зберігає файли в теці локального кореня IIS (зазвичай, \ Inetpub \ Wwwroot \). FTP-вузол зберігає файли на віддаленому сервері, доступ до якого по всій мережі Інтернет здійснюється за допомогою протоколу FTP. Віддалений веб-вузол зберігає файли на віддаленому сервері, доступному через локальну мережу. Додаткові відомості див. У розділі Покрокове керівництво. Редагування веб-вузлів з FTP в Visual Web Developer. Також файли веб-вузла можуть зберігатися в системі управління версіями файлів, такий як Visual SourceSafe. Додаткові відомості див. У розділі Знайомство з системою управління версіями.
Створення файлового веб-вузла
Відкрийте Visual Web Developer.
У меню Файл виберіть пункт Створити веб-вузол.
З'явиться діалогове вікно Створити веб-вузол. як показано на наступному скріншоті.
У діалоговому вікні "Створити веб-вузол".У групі Встановлені шаблони Visual Studio виберіть Веб-вузол ASP.NET.
При створенні веб-вузла вказується шаблон. Кожен шаблон створює веб-додаток, що містить різні файли і папки. В ході даного покрокового керівництва буде створено веб-вузол на базі шаблону Веб-вузол ASP.NET. який створює деякі папки і кілька файлів за замовчуванням.
В поле Розташування виберіть поле Файлова система і введіть ім'я папки, в якій будуть зберігатися сторінки веб-вузла.
Наприклад, введіть ім'я папки C: \ BasicWebSite.
У списку Мова виберіть Visual Basic або Visual C #.
Вибрана мова програмування буде встановлений як мову за замовчуванням для даного веб-вузла. Проте, в одному і тому ж веб-додатку можна використовувати кілька мов, створюючи сторінки і компоненти на різних мовах програмування.
Натисніть кнопку ОК.
Visual Web Developer створить папку і нову сторінку з ім'ям Default.aspx. За замовчуванням при створенні нової сторінки Visual Web Developer відображає сторінку в поданні джерела, де можна бачити HTML-елементи сторінки. На наступному скріншоті показана веб-сторінка за замовчуванням в поданні джерела.
Веб-сторінка за замовчуванням в поданні джерела.
Огляд можливостей Visual Web Developer
Перш ніж продовжити роботу над сторінкою, корисно ознайомитися з середовищем розробки Visual Web Developer. На наступному малюнку показані вікна і засоби, доступні в Visual Web Developer.
Схема середовища Visual Web Developer.
Знайомство з Web designer в Visual Web Developer
Панелі інструментів. Надають команди для форматування тексту, пошуку тексту і т. Д. Деякі панелі інструментів доступні тільки при роботі в уявленні конструювання.
Оглядач рішень. Показує файли і папки на веб-сайті.
Вікно документів. Відображає робочі документи у вікнах з вкладками. Для перемикання між документами потрібно клацнути вкладку.
Вікно "Властивості". Дозволяє змінювати параметри сторінки, елементів HTML, елементів управління та інших об'єктів.
Панель елементів. Надає елементи управління і елементи HTML, які можна перетягувати на сторінку. Елементи в Панелі елементів згруповані по загальних функцій.
Оглядач серверів / оглядач баз даних. Відображає підключення бази даних. Якщо вкладка Оглядач серверів, хоч я знаю в Visual Web Developer, слід в меню Вид вибрати Оглядач серверів або Оглядач баз даних.
Створення нової сторінки Web Forms
При створенні нового веб-вузла Visual Web Developer додає ASP.NET сторінку (сторінки Web Forms) з ім'ям Default.aspx. Сторінку Default.aspx можна використовувати в якості домашньої сторінки веб-вузла. Але в даному покроковому керівництві ми створимо і будемо працювати з новою сторінкою.
Додавання сторінки до веб-сайту
Закрийте сторінку Default.aspx. Для цього клацніть правою кнопкою миші на вкладці і ім'ям файлу і виберіть команду Закрити.
У браузері рішень клацніть правою кнопкою миші на веб-сайті (наприклад, C: \ BasicWebSite) і потім натисніть кнопку Додавання нового елемента.
У розділі Встановлені шаблони Visual Studio виберіть Форма Web Forms. На наступному скріншоті показано діалогове вікно Додавання нового елемента.
У діалоговому вікні "Додавання нового елемента".У полі Ім'я введіть FirstWebPage.
У списку Мова виберіть мову програмування, з яким ви вважаєте за краще працювати (Visual Basic. C # або J #). При створенні веб-вузла було вказано мову за замовчуванням. Проте кожного разу при створенні нової сторінки або компонента для веб-вузла можна задавати мову програмування, відмінний від встановленого за замовчуванням. Можна використовувати різні мови програмування на одному веб-сайті.
Зніміть прапорець Розміщувати код в окремому файлі.
В даному покроковому керівництві показано створення сторінки в одному файлі, що містить і код, і HTML. Код сторінок ASP.NET може перебувати як на сторінці, так і в окремому файлі класу. Докладні відомості про збереження коду в окремому файлі см. В розділі Покрокове керівництво. Створення базової веб-сторінки з поділом коду в Visual Web Developer.
Натисніть кнопку Додати.
Visual Web Developer створить нову сторінку і відкриє її в режимі джерела.
Додавання на сторінку HTML-коду
У цій частині покрокового керівництва на сторінку буде додано статичний текст.
Додавання тексту на сторінку
Щоб переключитися в уявлення конструювання, в нижній частині вікна документів виберіть вкладку Конструктор.
Подання конструювання відображає сторінку, над якою ведеться робота, в режимі точного відображення (WYSIWYG). Після виконання цих дій сторінка не містить тексту або елементів управління.
На сторінці введіть Ласкаво просимо в Visual Web Developer.
На наступному скріншоті показаний текст, введений в режимі конструктора.
Текст вітання в режимі конструктора.Перейдіть в режим джерела.
Можна бачити HTML-код, створений при введенні тексту в режимі конструктора, як це показано на наступному скріншоті.
Текст вітання в режимі джерела.
виконання сторінки
Перед тим як продовжити додавати елементи керування на сторінку можна спробувати її запустити. Для запуску сторінки потрібно веб-сервер. На робочому веб-сайті в якості веб-сервера використовується служба IIS. Однак щоб перевірити сторінку, можна використовувати ASP.NET Development Server, який працює локально і не вимагає служб IIS. Для веб-вузлів з файлової системою веб-сервером за замовчуванням в Visual Web Developer є сервер ASP.NET Development Server.
запуск сторінки
Щоб запустити сторінку, натисніть клавіші CTRL + F5.
Visual Web Developer запускає сервер ASP.NET Development Server. З'явиться значок в панелі інструментів, який вказує, що веб-сервер Visual Web Developer працює, як показано на наступному скріншоті.
Значок веб-сервера в Visual Web Developer.
Сторінка відкриється в браузері. Хоча створена сторінка має розширення ASPX, вона в даний момент виконується як звичайна HTML-сторінка.
Якщо в браузері відображається помилка 502 або помилка, яка свідчить про неможливість відображення сторінки, то, можливо, в браузері необхідно налаштувати виконання локальних запитів в обхід проксі-сервера. Додаткові відомості див. У розділі Практичний посібник. Обхід проксі-сервера для локальних веб-запитів.