Скачиваний:
5
Добавлен:
27.11.2024
Размер:
825.37 Кб
Скачать

Министерство образования и науки Российской Федерации

Саратовский государственный технический университет

Балаковский институт техники, технологии и управления

ИНТЕРАКТИВНОЕ ПРОГРАММИРОВАНИЕ ВЕБ-ПРИЛОЖЕНИЙ

Методические указания к выполнению практических работ по дисциплине

«Интерактивное программирование веб-приложений» для студентов всех форм обучения по направлению 230400.62

Одобрено редакционно-издательским советом Балаковского института техники,

технологии и управления

Балаково 2014

Практическая работа №1. Создание веб-приложения с использованием

Microsoft Visual Studio.

Введение

Цель работы: знакомство с технологией ASP.NET и создание веб-

приложения с использованием MS Visual Studio.

Основные понятия

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

Веб-приложение ASP.NET содержит несколько компонентов, в том числе следующие:

веб-формы (.ASPX-страницы), которые обеспечивают интерфейс для веб-приложений.

код, который находится на .ASPX-странице или на странице с выделенным кодом.

конфигурационные файлы - XML файлы, определяющие

настройки для веб-приложений и веб-сервера.

Visual Studio содержит шаблоны, которые поддерживают создание ряда общих типов проектов. Эти шаблоны содержат все необходимые фай-

лы и гарантируют, что IDE имеет оптимальную конфигурацию для вы-

бранного проекта.

При создании проекта в Visual Studio, вы также можете создать большой контейнер, называемый решением, который может содержать не-

сколько проектов. Visual Studio включает в себя несколько шаблонов про-

ектов на различных языках.

2

3
Шаблоны: ASP.NET Web Site.

В Visual Studio, можно создавать веб-приложения с помощью двух различных шаблонов:

шаблон проекта веб-приложения ASP.NET. Представляет собой модель веб-проектов, которая похожа на типовой веб-проект в Visual

Studio.

шаблон проекта веб-сайта ASP.NET. Представляет собой модель веб-проекта с дополнительными возможностями, дополнительной гибко-

стью в управлении веб-приложениями.

Выбор шаблона проекта зависит от ваших требований и предпочте-

ний к процессу разработки.

Технология выполнения работы

Сценарий. Винзавод Coho предлагает ряд гарантий для своих со-

трудников. В практической работе вы создадите веб-сайт, который позво-

лял бы сотрудникам выбирать и настраивать их опции. Перечень выгод,

которые предлагает Винзавод Coho отображается на нескольких страницах на веб-сайте.

В этой практической работе, будет создан веб-узел ASP.NET, создан компонент в проекте библиотеки классов, а затем ссылка на компонент.

Практическая работа выполняется с помощью Visual C#. В этом упражне-

нии вы создадите ASP.NET Веб-сайт проекта под названием Benefits.

Основными задачами этого мероприятия являются:

Создание новой файловой системы веб-сайта ASP.NET.

Добавление начальных файлов веб-сайта и отображение веб-

страницы Default.aspx.

Задача 1: Создание новой файловой системы веб-сайта ASP.NET.

Запустите Microsoft Visual Studio.

В Visual Studio, создайте следующий новый веб-сайт:

Расположение: F:\PROFILES\useraptech-x-xx\Benefits.

Язык: Visual C#.

Visual Studio создает решение Benefits в папке

F:\PROFILES\useraptech-x-xx\Benefits. Это решение содержит веб-сайт

Benefits. Когда вы создаете веб-узел ASP.NET, обозреватель решения со-

держит следующие пункты для веб-сайта.

Файл

Описание

Веб-папка App_Data

Папка, содержащая файлы данных приложения.

Файл Default.aspx

Пустая страница. Обозреватель решения также

 

содержит файл кода веб-страницы, названной

 

Default.aspx.cs (Visual C #).

Файл web.config

Файл веб-конфигурации.

Задача 2: Добавить начальные файлы на веб-сайт Benefits.

Добавить все файлы из папки E:\Labfiles\Starter\CS или

E:\Labfiles\Starter\VB на веб-сайт Benefits.

Файлы Header.ascx, medical.aspx и test.aspx, вместе с файлом кода добавляются к веб-сайту Benefits в обозревателе решений. Файлы, которые вы добавили к этому проекту в предыдущем шаге станут основой для ва-

шего веб-сайта.

Упражнение 2: Создание класса.

Сценарий. Веб-сайт Benefits требует компонент, который возвращает список опций для сотрудников, которые предлагает Винзавод Coho. В этом упражнении вы создадите класс с именем Benefits для вашего веб-решения.

Затем вы реализуете класс, чтобы возвратить строку имен.

Основными задачами этого мероприятия являются:

1.Добавление нового класса к веб-узлу.

2.Применение класса для возвращения строки имен.

Задача 1: Добавить новый класс на веб-узел.

Добавить для веб-сайта новый класс Benefits.cs.

Задача 2: Реализовать класс, который возвращает строку имен.

4

1. В классе Benefits добавить следующий код, чтобы создать поль-

зовательскую структуру.

Ваш код должен выглядеть следующим примером.

public struct BenefitInfo {

public string benefitName;

public string benefitPage;

}

Код создает структуры под названием BenefitInfo, которая содержит две строки benefitName и benefitPage.

2. В классе Benefits добавить следующий код для создания метода

GetBenefitsList.

3. Ваш код должен выглядеть следующим примером.

public BenefitInfo[] GetBenefitsList() { BenefitInfo[] benefitsArray = new BenefitInfo[3]; benefitsArray[0].benefitName = "Dental"; benefitsArray[0].benefitPage = "dental.aspx"; benefitsArray[1].benefitName = "Medical"; benefitsArray[1].benefitPage = "medical.aspx"; benefitsArray[2].benefitName = "Life Insurance"; benefitsArray[2].benefitPage = "life.aspx"; return benefitsArray;

}

Метод GetBenefitsList создает массив структур BenefitInfo, заполняет структуры информацией, а затем возвращает массив.

4.Постройте веб-сайт.

5.Убедитесь, что веб-сайт компилируется без ошибок.

Результаты: После этого упражнения, вы должны были добавить класс к веб-узлу и реализовать его таким образом, чтобы он осуществлял возврат строки имен.

5

Упражнение 3: Вызов компонента.

Сценарий. В этом упражнении вы будете писать код для проверки класс Benefits на веб-странице. Вы будете также расширять класс Benefits

для отображения дополнительной опции.

Основными задачами этого мероприятия являются:

Открыть файл кода для веб-страницы test.aspx и просмотреть страницу в браузере.

Внести изменения в класс.

Построить и протестировать веб-сайт.

Задача 1: Открыть файл с фоновым кодом для веб-страницы test.aspx

и просматривать страницы в браузере.

1. Открыть файл с фоновым кодом для test.aspx.

Закодируйте экземпляр компонента, а затем вызовите метод

GetBenefitsList, который возвращает список льгот и имена страниц.

2. Открыть test.aspx в браузере.

Откроется окно браузера и отобразит все опции льгот на веб-

странице test.aspx.

3. Закройте браузер.

Задача 2: внести изменение в класс.

1. В классе Benefits изменить первую строку кода, чтобы увеличить размер массива на единицу.

Ваш код должен выглядеть следующим примером.

BenefitInfo[] benefitsArray = new BenefitInfo[4];

2. В классе Benefits добавить следующий код:

В конце класса добавить еще одну опцию в массив.

Ваш код должен выглядеть следующим примером.

benefitsArray[3].benefitName = "Retirement Account";

benefitsArray[3].benefitPage = "retirement.aspx";

6

Задача 3: Построить и протестировать веб-сайт.

1.Постройте веб-сайт.

2.Убедитесь, что веб-сайт компилируется без ошибок.

3.Откройте test.aspx в браузере.

4.Откройте окно обозревателя и веб-страницу test.aspx. Теперь также отображается Новая опция льготы из класса.

5.Закройте браузер.

6.Закройте Visual Studio.

Результаты: После этого упражнения, вы проверили класс Benefits на веб-странице и усовершенствовали класс Benefits для отображения допол-

нительных выгод.

Вопросы для самоконтроля

1.Из каких компонентов состоит . NET Framework 3.5?

2.Какова цель CLR?

3.Вы должны создать программируемый веб-компонент, с помо-

щью которого вы сможете обмениваться с другими веб-приложениями.

Какой компонент вы должны создать?

4. Необходимо разработать приложение, которое должно поддер-

живать несколько версий .Net Framework. Какой инструмент позволит это выполнить?

5.Какие языки программирования поддерживаются Visual Studio?

6.Какие шаблоны проектов предоставляются в Visual Studio?

7.Когда Вы создаете веб-приложение, какие файлы Visual Studio

при этом предоставляются?

8.Каким образом вы можете создавать и просматривать веб-форму?

9.Что такое пространство имен?

10.Когда вы собираете класс, где находится сохраненный DLL-

файл?

7

Время, отведенное на выполнение работы

Работа должна быть выполнена за одно занятие – 2 часа.

Отчет сдается на последнем занятии.

8

Практическая работа №2. Создание Microsoft ASP.NET веб-формы.

Введение

Цель работы: создание пользовательского интерфейса на сайте при помощи ASP.NET веб-формы.

Основные понятия

Веб-формы являются программируемыми веб-страницами, которые служат в качестве пользовательского интерфейса (UI) для веб-приложений

Microsoft ASP.NET. Веб-форма предоставляет пользователю информацию в любой тип браузера, а он реализует логику приложения с помощью сер-

верного код.

Чтобы добавить дополнительные формы веб-приложений, выполни-

те следующие действия:

1.В Solution Explorer щелкните правой кнопкой мыши на имени проекта или веб-сайта, а затем нажмите кнопку Добавить новый элемент.

2.В диалогового окна Добавление нового элемента веб-форм,

введите имя веб-формы, а затем нажмите кнопку Добавить.

Серверные элементы управления ASP.NET – это компоненты, кото-

рые выполняются на сервере и инкапсулируют пользовательский интер-

фейс и другие, связанные с этим функции. Они включают в себя кнопки,

текстовые поля и списки.

Есть много видов серверных элементов управления, которые доступ-

ны в ASP.NET. В целом они разделяются на серверные элементы управле-

ния HTML и элементы управления веб-сервером. HTML элементы веб-

формы не доступны на сервере. Элементы управления веб-сервером вклю-

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

9

Представление состояния записывает состояния элементов управле-

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

нию состояния.

Серверные элементы управления HTML могут быть описаны как элементы серверного кода. Такое преобразование позволяет использовать элементы управления для таких событий, которые обрабатываются на сер-

вере. Серверные элементы управления HTML включают атрибут runat="server".

Встроенные элементы управления веб-сервером соответствуют про-

стым элементов HTML. Проверка управления скрыто контролируют поль-

зовательский ввод в отношении предопределенных шаблонов. Широкий круг элементов управления веб-сервером предоставляют широкие функци-

ональные возможности, для того, чтобы ваша веб-форма могла осуществ-

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

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

ганизовать свое приложение на определенном уровне.

Технология выполнения работы

В этой практической работе, вы создадите пользовательский интерфейс для веб-форм Default.aspx и Life.aspx и страницы на веб-сайте

Benefits. Веб-форма Default.aspx является домашней страницей веб-сайта

Benefits. Веб-форма Default.aspx отображает список преимуществ, которые предлагает компания. Веб-форма Life.aspx позволяет пользователю ввести информацию о страховании такую, как свое имя, дату рождения, а охват суммы. Cтраница Life.aspx использует также главную страницу, которая

10