Пояснительная записка (1231610), страница 3
Текст из файла (страница 3)
В настоящее время web-сайты имеют четкую структуру: за клиентскую и серверную части отвечают отдельные взаимодействующие между собой модули [18].
При разработке клиентской части используются следующие средства:
– HTML – для разметки web-страниц;
– CSS – для оформления web-страниц;
– JavaScript – для динамического изменения web-страницы на стороне клиента.
При реализации серверной части используют:
– PHP – для функционирования сервера и его взаимодействия с базами данных;
– MySQL – для настройки сервера с базой данных.
2.2.1 Hyper Text Markup Language
HTML (от англ. Hyper Text Markup Language – «язык гипертекстовой разметки») – стандартный язык разметки документов в сети Интернет [19]. Большинство web-страниц содержат описание разметки на языке HTML. Язык HTML интерпретируется браузерами; полученный в результате интерпретации форматированный текст отображается на экране мониторе компьютера или мобильного устройства.
Язык HTML является приложением SGML (стандартного обобщённого языка разметки) и соответствует международному стандарту ISO 8879.
В сети Интернет HTML-страницы, как правило, передаются браузерам от сервера по протоколам HTTP или HTTPS, в виде простого текста или с использованием шифрования.
Изначально язык HTML был задуман и создан как средство структурирования и форматирования документов без их привязки к средствам воспроизведения (отображения). В идеале, текст с разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на оборудовании с различной технической оснащённостью (цветной экран современного компьютера, монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или устройства и программы голосового воспроизведения текстов). Однако современное применение HTML очень далеко от его изначальной задачи. Например, тег <TABLE> предназначен для создания в документах таблиц, но часто используется и для оформления размещения элементов на странице. С течением времени основная идея платформо-независимости языка HTML была забыта в связи с современными потребностями в мультимедийном и графическом оформлении.
2.2.2 Cascading Style Sheets
CSS (от англ. Cascading Style Sheets – каскадные таблицы стилей) – формальный язык описания внешнего вида документа, написанного с использованием языка разметки [21].
Преимущественно используется как средство описания, оформления внешнего вида web-страниц, написанных с помощью языков разметки HTML и XHTML, но может также применяться к любым XML-документам.
CSS используется создателями web-страниц для задания цветов, шрифтов, расположения отдельных блоков и других аспектов представления внешнего вида этих web-страниц. Основной целью разработки CSS являлось разделение описания логической структуры web-страницы от описания внешнего вида этой web-страницы. Такое разделение может предоставить большую гибкость и возможность управления его представлением, а также уменьшить сложность и избыточность в структурном содержимом.
Кроме того, CSS позволяет представлять один и тот же документ в различных стилях или методах вывода, таких как экранное представление, печатное представление, чтение голосом (специальным голосовым браузером или программой чтения с экрана), или при выводе устройствами, использующими шрифт Брайля.
Таблицы стилей содержат в себе правила CSS [22]. Эти таблицы стилей могут располагаться как в самом web-документе, внешний вид которого они описывают, так и в отдельных файлах, имеющих формат CSS. По сути, формат CSS – это обычный текстовый файл. В файле .css не содержится ничего, кроме перечня правил CSS и комментариев к ним.
2.2.3 JavaScript
JavaScript (аббр. JS) – прототипно-ориентированный сценарный язык программирования [23].
JavaScript обычно используется как встраиваемый язык для программного доступа к объектам приложений. Наиболее широкое применение он находит в браузерах, как язык сценариев, позволяющий создавать интерактивные web-страницы.
Основные архитектурные черты JavaScript:
– динамическая типизация;
– слабая типизация;
– автоматическое управление памятью;
– прототипное программирование.
JavaScript является объектно-ориентированным языком, но используемое в языке прототипирование обуславливает отличия в работе с объектами, по сравнению с традиционными класс-ориентированными языками.
В языке отсутствуют такие полезные вещи, как [24]:
– модульная система: JavaScript не предоставляет возможности управлять зависимостями и изоляцией областей видимости;
– стандартная библиотека: в частности, отсутствует интерфейс программирования приложений по работе с файловой системой, управлению потоками ввода-вывода, базовых типов для бинарных данных;
– стандартные интерфейсы к web-серверам и базам данных;
– система управления пакетами, которая бы отслеживала зависимости и автоматически устанавливала их.
При рассмотрении JavaScript следует обратить внимание на библиотеку jQuery и технологию AJAX.
Библиотека jQuery
jQuery – библиотека JavaScript, фокусирующаяся на взаимодействии JavaScript и HTML [25]. Библиотека jQuery помогает легко получать доступ к любому элементу DOM, обращаться к атрибутам и содержимому элементов DOM, манипулировать ими. Также библиотека jQuery предоставляет удобный API для работы с AJAX. Сейчас разработка jQuery ведётся командой jQuery во главе с Джоном Резигом.
Возможности jQuery:
– переход по дереву DOM, включая поддержку XPath как плагина;
– события;
– визуальные эффекты;
– AJAX-дополнения;
– JavaScript-плагины.
Точно так же, как CSS отделяет визуализацию от структуры HTML, jQuery отделяет поведение от структуры HTML [26]. Например, вместо прямого указания на обработчик события нажатия кнопки, управление передаётся jQuery, которая идентифицирует нажатие и затем преобразует его в обработчик события клика. Такое разделение поведения и структуры также называется принципом ненавязчивого JavaScript.
Библиотека jQuery содержит функционал полезный для широкого круга задач. Тем не менее, разработчиками библиотеки не ставилась задача совмещения в jQuery максимально универсальных функций, поскольку это привело бы к избыточности кода. Поэтому была реализована архитектура компактного универсального ядра библиотеки и плагинов.
Технология Asynchronous JavaScript and XML
AJAX (от англ. Asynchronous Javascript and XML – «асинхронный JavaScript и XML») – подход к построению интерактивных пользовательских интерфейсов web-приложений, заключающийся в «фоновом» обмене данными браузера с web-сервером [27]. В результате, при обновлении данных web-страница не перезагружается полностью, увеличивается скорость работы web-приложений.
Без использования AJAX web-приложения работают следующим образом:
– пользователь заходит на web-страницу и нажимает на какой-нибудь её элемент;
– браузер формирует и отправляет запрос серверу, для обработки данного события;
– в ответ сервер генерирует совершенно новую web-страницу и отправляет её браузеру и т.д. После чего браузер полностью перезагружает всю страницу.
При использовании AJAX алгоритм работы web-приложения изменяется следующим образом [28]:
– пользователь заходит на web-страницу и нажимает на какой-нибудь её элемент;
– скрипт (на языке JavaScript) определяет, какая информация необходима для обновления страницы;
– браузер отправляет соответствующий запрос на сервер;
– сервер возвращает только ту часть документа, на которую пришёл запрос;
– скрипт вносит изменения с учётом полученной информации (без полной перезагрузки страницы).
AJAX – не самостоятельная технология, а концепция использования нескольких смежных технологий.
2.2.4 PHP: Hypertext Preprocessor
PHP (от англ. PHP: Hypertext Preprocessor – «PHP: препроцессор гипертекста») – скриптовый язык общего назначения, интенсивно применяемый для разработки web-приложений [29]. В настоящее время поддерживается подавляющим большинством хостинг-провайдеров и является одним из лидеров среди языков, применяющихся для создания динамических web-сайтов.
В области web-программирования, в частности серверной части, PHP – один из популярных сценарных языков.
Популярность в области построения web-сайтов определяется наличием большого набора встроенных средств для разработки web-приложений. Основные из них:
– автоматическое извлечение POST и GET-параметров, а также переменных окружения web-сервера в предопределённые массивы;
– взаимодействие с большим количеством различных систем управления базами данных, например, MySQL;
– автоматизированная отправка HTTP-заголовков;
– работа с HTTP-авторизацией;
– работа с cookies и сессиями;
– работа с локальными и удалёнными файлами, сокетами;
– обработка файлов, загружаемых на сервер;
– работа с XForms.
PHP-скрипты обычно обрабатываются интерпретатором в порядке, обеспечивающем кроссплатформенность разработанного приложения [30]:
– лексический анализ исходного кода и генерация лексем;
– синтаксический анализ полученных лексем;
– генерация байт-кода;
– выполнение байт-кода интерпретатором (без создания исполняемого файла).
Для увеличения быстродействия приложений возможно использование специального программного обеспечения – так называемых акселераторов. Принцип их работы заключается в кэшировании однажды сгенерированного байт-кода в памяти и/или на диске. Таким образом, из процесса работы приложения исключаются этапы 1-3, что в общем случае ведёт к значительному ускорению работы.
Важной особенностью PHP является отсутствие необходимости заботиться о распределении и освобождении памяти. Ядро PHP реализует средства для автоматического управления памятью; вся выделенная память возвращается системе после завершения работы сценария.
2.2.5 Система управления базами данных MySQL
MySQL – свободная реляционная система управления базами данных [31]. Обычно MySQL используется в качестве сервера, к которому обращаются локальные или удалённые клиенты, однако в дистрибутив входит библиотека внутреннего сервера, позволяющая включать MySQL в автономные программы.
Гибкость СУБД MySQL обеспечивается поддержкой большого количества типов таблиц. Более того, СУБД MySQL поставляется со специальным типом таблиц EXAMPLE, демонстрирующим принципы создания новых типов таблиц.
Обращение к СУБД MySQL из сторонних программ осуществляется посредством языка SQL.
SQL (от англ. structured query language – «язык структурированных запросов») – формальный непроцедурный язык программирования, применяемый для создания, модификации и управления данными в произвольной реляционной базе данных, управляемой соответствующей СУБД [32].
С развитием лексический состав SQL усложняется посредством добавления новых конструкций, управляемых объектов (например, индексов, представлений, триггеров и хранимых процедур) – приобретает черты, свойственные языкам программирования.
При всех своих изменениях SQL остаётся единственным механизмом связи между прикладным программным обеспечением и базой данных. В то же время современные СУБД, а также информационные системы, использующие СУБД, предоставляют пользователю развитые средства визуального построения запросов.
Использование SQL сводится к формированию всевозможных выборок строк и совершению операций над всеми записями, входящими в выбранный набор.
Выводы по разделу
Для разработки модуля подведения итогов соревнований по программированию выбраны описанные выше средства, так как их взаимодействие на текущий момент достигло очень высокого уровня.
Модуль, реализованный средствами PHP, взаимодействует с базой данных на MySQL сервере, в то время как пользователь через web-интерфейс, реализованный средствами HTML и CSS, взаимодействует с сервером, посредством JavaScript, jQuery и AJAX.
Иные средства разработки так же способны обеспечить подобное взаимодействие, но с некоторыми недостатки, например, низким быстродействием системы или ограниченностью возможных функций.
2.3 Требования, предъявляемые к модулю подведения итогов
Исходя из рассмотренных ранее технологий для создания web-сайтов, отображать модуль подведения итогов можно посредством одной web-страницы, содержащей таблицу с результатами и меню настроек.
Помимо отображения таблицы с результатами необходимо добиться так называемой «разморозки» этой таблицы, то есть последовательного заполнения таблицы результатами в том порядке, в котором они получались по ходу соревнования.
Меню настроек должно включать в себя следующий перечень функций:
![](https://s.studizba.com/z.php?f=/templates/si/i/noavatar.png&w=100&h=100&t=1"){kind=avatar}
