Файл: Основы алгоритмизации при разработке WEB-приложений.pdf

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

Как видно из рисунка, работа серверных приложений происходит в три основных этапа:

Запрос. Клиент, используя web - браузер, инициирует запрос к серверу.
Обработка запроса, подготовка ответа. После получения запроса web - сервер
проводит обработку запрашиваемого ресурса. В случае, если запрашивается
статический ресурс, такой как HTML страница, рисунок, документ, эта
информация форматируется для протокола HTTP и передается клиенту в
качестве ответа. Если же запрашивается динамический ресурс, запрос
передается на обработку соответствующему контейнеру web - приложений, где
и происходит дальнейшая работа.
После формирования, данные передаются клиенту посредством протокола
HTTP в качестве ответа. Ответ содержит данные (обычно HTML код, либо
двоичные данные), а также дополнительные параметры, передаваемые в
заголовках HTTP ответа.

Работа приложений серверной стороны всегда происходит по описанному выше сценарию. Очевидно, что такой подход создает сложности при создании web-приложений, основной из которых является отсутствие состояния у web-приложения (так называемое stateless programming). Это означает, что приложение работает исключительно в режиме запрос-ответ, не имея данных о предыдущих шагах пользователя или какой-либо иной постоянной информации. Для решения этой проблемы применяется понятие пользовательской сессии, которая позволяет хранить данные на сервере в течение сеанса работы пользователя.

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

1. Определение целей и задач проекта

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

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

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

Когда цели определены, приступают к составлению расширенного плана проекта, отражающего сколько времени, денег и иных средств понадобится для выполнения работ на каждом из последующих этапов. Такой план часто содержит информацию о бюджете проекта, график работ (с соответствующим распределением ролей между web-разработчиками), техническую документацию, а также раздел «деталей и уточнений», где оговорены конкретные аспекты возможных спорных вопросов. В этот раздел также включают предложения о готовых разработках и шаблонах.

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

1.1 Разработка структуры сайта

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

Карту сайта представляют в виде чертёжа (блок-схемы), на котором каждая страница отображается отдельным прямоугольником. Связи между ними показывают схему переходов по страницам.

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

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

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

1.2 Разработка дизайн-макетов

Дизайн-макет — это графическое, наглядное изображение основных элементов сайта. Дизайн-макет полностью воплощает визуальную концепцию сайта. Его разработка выполняется в одной из графических программ (в подавляющем большинстве случаев — в Adobe Photoshop). В процессе разработки дизайнер руководствуется письменным соглашением (брифом) на создание дизайн-макета, который заполняется заказчиком и содержит пожелания к дизайну: тип, предпочтительные цвета, наличие тех или иных графических элементов и пр.

На этой стадии создаются все элементы web-дизайна в соответствии со стилем подачи информации и общей концепцией. Главным при дизайне сайта является умение разработать графические объекты, которые бы быстро загружались и хорошо смотрелись, независимо от используемого Internet-браузера.

Часто прибегают к использованию готовых дизайн-шаблонов, которые широко представлены в сети Internet или являются встроенными в различные графические редакторы, такие как, Microsoft Front Page или Adobe PhotoShop. С помощью подобных шаблонов сайт создаётся за максимально сжатое время. Однако следует отметить, что у такого решения имеется ряд существенных недостатков, главный из которых — повторяемость и не уникальность дизайна. Шаблон является оболочкой с минимальным количеством интерактивных элементов и полезных модулей. Поэтому при выборе шаблона стоит обращать внимание не только на дизайн, но и на функциональность.

Важным элементом web-дизайна является графика, которую условно можно разделить на три категории:

 иллюстрированная графика — пояснительные изображения, схемы и чертежи, фотографии;

 функциональная графика — кнопки навигации, счётчики и другие элементы управления сайтом;

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

Такая классификация предполагает использование различных мультимедийных форматов. Например, для чётких, контрастных изображений с мелкими деталями и тонкими линями используются jpeg-файлы, а для красочных изображений с мягкими переходами цветов — gif-файлы.

1.3 Html-вёрстка

Html-вёрстка макета является следующим шагом после разработки дизайна сайта. Вёрстка — это преобразование созданных дизайнером графических макетов страниц в html-код, который бы отображался в Internet-браузере в точном соответствии с исходным макетом. Сложность вёрстки зависит от сложности дизайна.

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

 корректность отображения страниц сайта при разных разрешениях экрана;

 кросбраузерность — единообразность отображения страниц сайта в наиболее популярных браузерах Internet Explorer, Mozilla Firefox, Opera, Chrome.

1.4. Программирование и контроль качества

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

Статический Internet-сайт представляет собой совокупность html-файлов, каждый из которых представляет отдельную страницу (или её часть). Такой подход используется, в основном, для размещения файловых архивов и медиа-коллекций. Статические сайты программирования, как такового, не требуют.

Страницы динамического Internet-сайт формируются сервером в ответ на запрос пользователя (передаваемый в виде URL-адреса страницы). Такие сайты требуют больше затрат на разработку и техническую поддержку, чем статические, но эти затраты окупаются за счёт снижения финансирования на редактирование материалов и развитие информационной структуры.

2. Системы поддержки процесса разработки

Создание web-приложения, как и любого другого программного продукта, подразумевает работу с постоянно меняющейся информацией, данными, файлами. Контроль за вносимыми в проект изменениями помогают обеспечить системы управления версиями (Version Control System — VCS), которые хранят предыдущие версии исходных файлов проекта, отслеживают производимые в файлах изменения, обеспечивают совместную командную работу над проектом и пр. К наиболее популярным на текущий момент VCS относятся: SVN, GIT, Microsoft VSS. Использование системы контроля версий поднимает общий уровень качества разработки.

Кроме того, создание любого программного продукта (в том числе и web-приложения) сопровождается новыми требованиями к продукту, предложениями по его улучшению, необходимостью исправлять ошибки и пр. Для управления перечисленными аспектами разработки и улучшения качества менеджмента используются системы отслеживания ошибок (Bug Tracking System — BTS). Главный компонент BTS представляет собой базу данных с удаленным доступом, обеспечивающую централизованный доступ ко всем необходимым файлам, спецификациям, графикам, планам, замечаниям и т.п.

Существует широкое разнообразие систем отслеживания ошибок: Basecamp, Bugzilla, Trac, MantisBT, Redmine и пр.

По завершении этапа активного программирования начинается этап тестирования корректности функционирования созданного web-приложения: проверки на наличие грамматических ошибок, пропущенных картинок, неработающих ссылок и т.д., а также проверки функционирования сайта в различных web-браузерах. Данный этап может быть автоматизирован с помощью средств автоматического тестирования таких, как IBM Rational AppScan, Empirix E-TEST Suite, XSpider, WAS и др.

2.1. Запуск и сопровождение

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