Шаблоны проектирования Web Профессор Хомоненко А Д ПГУПС

Шаблоны проектирования Web Профессор Хомоненко А. Д. ПГУПС, 07. 11. 2010

Вопросы: l l l Общие сведения о шаблонах Примеры шаблонов Web Технология Ajax Библиотека j. Query Объектная модель документа DOM

Литература: http: //msdn. microsoft. com/ruru/library/ee 377605. aspx 2. Heffelfinger D. R. Java EE 5 Development using Glass. Fish Application Server. Packt Publishing, 2007. ─ 420 с. 3. Кент Бек. Экстремальное программирование: разработка через тестирование. СПб. : Питер, 2003. 1.

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

Варианты шаблонов Web-приложений Веб-приложение ASP. NET. Возможности: l Главная страница. l Каскадная таблица стилей. l Безопасный вход с использованием системы членства ASP. NET. l Скрипты по технологии Ajax с использованием библиотеки j. Query. l Навигация с помощью карты сайта.

Варианты шаблонов Web-приложений Веб-приложение ASP. NET MVC 2. Возможности: l используется для создания веб-приложений, работающих с шаблоном "модельпредставление-контроллер «; l позволяет разделять различные аспекты приложения (логика ввода, бизнес-логика интерфейса), обеспечивая возможность тесного взаимодействия между ними; l стимулирует разработку на основе тестирования (Test-Driven Development, TDD ).

Варианты шаблонов Web-приложений Пустое Веб-приложение ASP. NET. Возможности: Создает веб-приложение ASP. NET, включающее файл Web. config и папку App_Data, но не другие файлы. Этот шаблон используется, если не требуется функциональность, встроенная в стандартный шаблон (например главные страницы, каскадная таблица стилей и необязательное членство), или создаваемое приложение не является приложением на платформе динамических данных или приложением MVC.

Варианты шаблонов Web-приложений Пустое Веб-приложение ASP. NET MVC 2: Этот шаблон создает пустое веб-приложение ASP. NET MVC 2, включающее папки для контроллеров, моделей, представлений и скриптов, а также файл Web. config, но не другие файлы.

Варианты шаблонов Web-приложений Веб-приложение ASP. NET с сущностями платформы динамических данных: l применяется для создания веб-приложения на платформе динамических данных, использующего ADO. NET Entity Framework; l этот тип веб-приложения можно привязать к любой реляционной базе данных; l автоматически создает веб-приложение с функциональными возможностями просмотра и изменения данных на основе схемы данных.

Шаблоны Web-приложений Net. Beans

Шаблоны Web-приложений Net. Beans JSTL(Java. Server Pages Standard Tag Library) — «стандартная библиотека тегов JSP» . Она расширяет спецификацию JSP, добавляя библиотеку JSP тегов для общих нужд: l разбор XML данных, l условная обработка, l создание циклов, l поддержка интернационализации.

Шаблоны Web-приложений Net. Beans Приложение CRUD (Create, Read, Update, and Delete) − простейший шаблон программирования, позволяет читать и управлять данными в источнике. IDE обеспечивает поддержку этих общих задач программирования путем быстрой генерации кода для функциональности CRUD, основанной на классах сущностей проекта приложения.

Технология Ajax AJAX (от англ. Asynchronous Javascript and XML — «асинхронный Java. Script и XML» ) — подход к построению интерактивных пользовательских интерфейсов веб-приложений, заключающийся в «фоновом» обмене данными браузера с вебсервером. В результате, при обновлении данных, веб-страница не перезагружается полностью и веб-приложения становятся более быстрыми и удобными

Технология Ajax AJAX основана на двух основных принципах: 1. Динамическое обращение к серверу «на лету» , без перезагрузки всей страницы полностью, например: l l l 2. . с использованием XMLHttp. Request (основной объект); через динамическое создание дочерних фреймов; через динамическое создание тега <script>. Использование DHTML для динамического изменения содержания страницы;

Технология Ajax. Достоинства: Экономия трафика. Часто вместо загрузки всей страницы достаточно загрузить только изменившуюся часть, как правило довольно небольшую. l Уменьшение нагрузки на сервер. Например, на странице с почтой, когда отмечают прочитанные письма, серверу достаточно внести изменения в базу данных и отправить клиенту сообщение о выполнении операции без повторного создания страницы и передачи её клиенту. l Ускорение реакции интерфейса Поскольку нужно загрузить только изменившуюся часть, пользователь видит результат действий быстрее. l

Технология Ajax. Недостатки: Отсутствие интеграции со стандартными инструментами браузера Динамически создаваемые страницы не регистрируются в истории посещения страниц, не работает кнопка «Назад» , но есть сценарии для решения этой проблемы. Другой недостаток − невозможность сохранения закладки. l Динамически загружаемое содержимое недоступно поисковикам (если не проверять запрос, обычный он или XMLHttp. Request) Поисковики не могут выполнять Java. Script, поэтому разработчики должны позаботиться об альтернативных способах доступа к содержимому сайта. l

Технология Ajax. Недостатки: Старые методы учёта статистики сайтов становятся неактуальными Для сайтов, страницы которых широко используют AJAX, статистика просмотра новых страниц теряет актуальность. l Усложнение проекта Перераспределяется логика обработки данных — происходит выделение и частичный перенос на сторону клиента процессов первичного форматирования данных. Это усложняет контроль целостности форматов и типов. l

Библиотека j. Query Это библиотека Java. Script для поддержки взаимодействия Java. Script и HTML. Помогает получать доступ к любому элементу DOM, обращаться к атрибутам и содержимому элементов DOM, манипулировать ими. Предоставляет удобный API по работе с Ajax. Использование. j. Query, как правило, включается в веб-страницу как один внешний Java. Scriptфайл: <head> <script type="text/javascript" src="путь/к/j. Query. js"></script> </head>

Библиотека j. Query Вся работа с j. Query ведётся с помощью функции $. Если на сайте применяются другие Java. Script библиотеки, где $ может использоваться для своих нужд, то можно использовать её синоним — j. Query. Второй способ считается более правильным, а чтобы код не был громоздким можно писать его так: j. Query(function($) { // код скрипта, где в $ будет находиться объект, предоставляющий доступ к функциям j. Query })

Объектная модель документа DOM (от англ. Document Object Model ) — это не зависящий от платформы и языка программный интерфейс, позволяющий программам и сценариям получить доступ к содержимому HTML, XHTML и XML-документов, а также изменять содержимое, структуру и оформление таких документов. Любой документ с помощью DOM можно представить в виде дерева узлов, каждый узел которого представляет собой элемент, атрибут, текстовый, графический или другой объект. Узлы связаны отношениями родительский-дочерний.

Объектная модель документа DOM Пример иерархии объектов в HTML DOM

Объектная модель документа DOM Изначально различные браузеры имели собственные модели документов, не совместимые с остальными. Чтобы обеспечить взаимную и обратную совместимость, специалисты международного консорциума W 3 C классифицировали эту модель по уровням, для каждого из которых была создана своя спецификация. Все эти спецификации объединены в общую группу W 3 C DOM.

Объектная модель документа DOM Уровни W 3 C DOM. Текущим уровнем спецификаций DOM является Уровень 2, но некоторые части спецификаций Уровня 3 являются рекомендуемыми W 3 C. Уровень 0 Включает в себя все специфические модели DOM, которые существовали до появления Уровня 1, например document. images, document. forms, document. layers и document. all. Эти модели не являются спецификациями W 3 C DOM, а являются информацией о том, что было до начала стандартизации.

Объектная модель документа DOM Уровень 1 Базовые функциональные возможности DOM (HTML и XML) в документах, такие как получение дерева узлов документа, возможность изменять и добавлять данные. Уровень 2 Поддержка пространства имён XML <-filtered views--> и событий. Уровень 3 Состоит из шести различных спецификаций: l DOM Level 3 Core; l DOM Level 3 Load and Save;

Объектная модель документа DOM Level 3 XPath; l DOM Level 3 Views and Formatting; l DOM Level 3 Requirements; l DOM Level 3 Validation. Эти спецификации являются дополнительными расширениями DOM. См. http: //www. w 3. org/TR/1998/REC-DOM-Level-119981001/level-one-core. html l

Разработка через тестирование TDD Разрабо тка че рез тести рование (англ. test-driven development) — техника программирования, при которой модульные тесты для программы или её фрагмента пишутся до самой программы и, по существу, управляют её разработкой. Является одной из основных практик экстремального программирования. Разработка в стиле TDD состоит из коротких циклов в зависимости от опыта и стиля работы программиста.

Разработка через тестирование TDD Каждый цикл состоит из следующих шагов: 1. Из репозитория извлекается программная система в согласованном состоянии, когда весь набор модульных тестов выполняется успешно. 2. Добавляется новый тест. Он может состоять в проверке, реализует ли система некоторое новое поведение или содержит ли некоторую ошибку, о которой недавно стало известно. 3. Успешно выполняется весь набор тестов, кроме нового теста, который выполняется неуспешно.

Разработка через тестирование TDD Шаг необходим для проверки самого теста — включён ли он в систему тестирования и верно ли отражает новое требование к системе. 4. Программа изменяется, чтобы выполнялись все тесты. Нужно простое решение, удовлетворяющее новому тесту, и не испортить существующие тесты. Большая часть нежелательных эффектов от изменений отслеживается на этом этапе, с помощью достаточно полного набора тестов. 5. Весь набор тестов выполняется успешно.

Разработка через тестирование TDD Теперь, когда требуемая в этом цикле функциональность достигнута самым простым способом, программа подвергается рефакторингу для улучшения структуры и устранения избыточного, дублированного кода. 7. Весь набор тестов выполняется успешно. 8. Комплект изменений, сделанных в этом цикле в тестах и программе заносится в репозиторий, после чего программа снова находится в согласованном состоянии и содержит улучшение по сравнению с предыдущим состоянием. 6.

Спасибо за внимание ! ПГУПС, каф. «ИВС» Зав. кафедрой Хомоненко Анатолий Дмитриевич khomon@mail. com 2010 г.