Проекта: Разработка Web-приложений
Скачать 180.07 Kb.
|
Федеральное агентство по образованию Государственное образовательное учреждение высшего профессионального образования ТОМСКИЙ ГОСУДАРСТВЕННЫЙ УНИВЕРСИТЕТ СИСТЕМ УПРАВЛЕНИЯ И РАДИОЭЛЕКТРОНИКИ(ТУСУР) Кафедра компьютерных систем в управлении и проектировании(КСУП) ОТЧЁТ о выполнении _____ этапа работ группы проектного обучения КСУП – 0901. Название проекта: Разработка Web-приложений За период с «__» _____ 20__г. по «__» _____ 20__г. Руководитель группы __________ФИО Томск 2010 СПИСОК ИСПОЛНИТЕЛЕЙ Руководитель группы, Ассистент кафедры КСУП _______ Д.А.Звонков Исполнители: _______ А.А.Бахарев, студент гр.517 _______ В.О.Казарский, студент гр.517 _______ Ю.М.Мубаракова, студент гр.517 _______ В.С.Стёпин, студент гр.517 _______ С.В.Ступаков, студент гр.517 _______ Е.А.Черноусов, студент гр.517 _______ О. А. Варфоломеева, студент гр. 517 Реферат РАЗРАБОТКА WEB-ПРИЛОЖЕНИЙ, БИЗНЕС ПРОЦЕСС РАЗРАБОТКИ WEB-ПРИЛОЖЕНИЯ, CMS DRUPAL, СОЗДАНИЕ САЙТА КАФЕДРЫ. Объектом исследования являются новые технологии веб-разработки. Цель работы – разработка сайта кафедры. В течении семестра участники нашей группы углубились в знании CMS DRUPAL и реализовали и подготовили функционал сайта к запуску. Оглавление Определения 6 Введение 7 Основная часть 8 Заключение 20 Cписок использованных источников 22 Приложения 23 ОпределенияВ настоящем отчёте по ГПО применяют следующие термины с соответствующими определениями: Верстка – процесс перенесения дизайна на язык понимаемый браузерами (html+css+js). Язык разметки – набор символов или последовательностей, вставляемых в текст для передачи информации о его выводе или строении. CSS – технология описания внешнего вида документа, написанного языком разметки. Контент – информационное (содержательное) наполнение ресурса. Кэш — промежуточный буфер с быстрым доступом, содержащий информацию, которая может быть запрошена с наибольшей вероятностью. Нода – узел. Нода является единицей материала (контента) в Drupal. jQuery – бесплатный javascript-фреймворк. Framework – набор готовых функций для облегчения решения типовых задач. ВведениеВ данный момент кафедра КСУП имеет официальный сайт, однако это решение имеет следующие проблемы:
Так как доработка текущего сайта кафедры является нерациональным решением, перед нами была поставлена задача, разработать новый сайт, обладающий следующими характеристиками:
Также должны быть разработаны следующие специальные модули:
Основная частьИнформационная архитектура и потенциальные возможности сайтаПервое мероприятие, которое должно быть произведено при разработке сайта – это создание его информационной архитектуры. В прошлом семестре шли подготовительные работы и мы по отдельности создавали разные модули для сайта (новости, статьи, библиотека). Компоновка этих модулей в единую структуру (карту) сайта – это и есть создание информационной архитектуры. Drupal предоставляет гибкий и простой механизм создания структуры сайта. Для этого необходимо выделить его основные разделы, придумать для них адрес (например, “/library”) и затем закрепить его как пункт меню. Также должны быть настроены гиперссылки, связывающие между собой различные разделы сайта. Ниже приводится структура нового сайта кафедры:
Вторичное меню:
Легенда: * - обычная страница # - коллекция обычных страниц - ссылка на соответствующий раздел сайта m – стандартный модуль CMS Drupal имеет множество стандартных модулей, которые могут повысить функциональность сайта. Мы исследовали, какие из этих модулей могут помочь нам в дальнейшей разработке. Ниже приводится список из некоторых выбранных модулей и, то какие потенциальные возможности для будущего они предоставляют: Content Profile – сохранение различной информации о пользователях и поиск по ней; Gallery – фотогалерея; Lightbox – просмотр фото во всплывающих окнах; SWFTools – поддержка добавления видео и аудио к материалам; WebCams – вывод изображений с веб-камер; WebForm – поддержка опросов и форм обратной связи. ОптимизацияСпособы оптимизации сильно зависят от конкретной задачи. Свою роль в выборе способов оптимизации играют набор используемых на сайте модулей и соотношение трафика от анонимных и зарегистрированных посетителей. Обычно окончательно определиться с методом можно только после тестирования сайта. По умолчанию Drupal ориентирован на хранение максимума информации в базе данных. Контент, служебные переменные и настройки сайта, кэш — все это складывается в БД. Не всегда такая схема может быть эффективна, и Drupal предлагает ряд альтернатив. Методы оптимизации «из коробки»Сначала рассмотрим, что предлагает Drupal в стандартной поставке. В настройках мы можем определиться с режимом страничного кэша. В Drupal эта разновидность кэширования отвечает за показ страниц анонимным посетителям сайта. При включении нормального режима кэширования полностью сгенерированная страница сохраняется в кэше (по умолчанию это таблица БД) и отдается анонимным посетителям, пока в кэш не будут помещены новые данные. Число запросов к СУБД при этом уменьшается многократно. Агрессивный режим работы кэша страниц обеспечивает более высокую производительность, чем нормальный, но он несовместим с некоторыми модулями. Именно данное обстоятельство не позволяет использовать агрессивный режим кэширования на большинстве сайтов. Следует помнить, что кэш страниц не действует для вошедших под своим логином пользователей — они будут всегда видеть актуальную информацию. Если же на сайте большую часть составляют зарегистрированные посетители, то кэш страниц даже в агрессивном режиме не даст значимого эффекта. Тем не менее, практически всегда стоит включать нормальный режим кэширования. Отметим, что полностью выключить кэширование в Drupal нельзя. Функция в настройках производительности отвечает только за страничный кэш, но Drupal также кэширует меню, фильтры ввода, блоки; дополнительные модули могут создавать свои кэши — все эти данные сохраняются в отдельных таблицах БД. Также в настройках можно включить компрессию страниц, что позволит браузеру сократить объем получаемой информации до 8 раз. При активации этого режима сжатие выполняется на уровне Drupal, то есть средствами PHP. Другой раздел настроек оптимизации — оптимизация трафика. Здесь можно включить слияние CSS и Javascript, отдаваемых сайтом. Различные модули сайта могут добавлять свои стили и скрипты на страницы, в результате запрос страницы браузером влечет за собой десятки мелких файлов со стилями. Эффективнее объединять все файлы в один и отдавать его один раз, что и делает Drupal при включении опций на этой закладке. Держать настройки слияния выключенными имеет смысл только во время разработки сайта, когда стили и скрипты часто меняются и дополняются новыми. Дополнительные модули для оптимизацииDrupal позволяет подменять стандартный механизм кэширования альтернативными реализациями, что и предлагается несколькими модулями, предоставляющими свои методы кэширования данных. Обычно суть всех этих модулей сводится к подмене механизма хранения кэша — вместо БД используются хранение в файлах или в оперативной памяти. Наиболее комплексное решение предоставляет модуль cacherouter. Он реализует механизмы кэширования в файлы, в память через «демон» memcached либо использование памяти акселераторов APC и XCache. Как уже отмечалось, Drupal использует в БД разные таблицы под кэши различного назначения. Удобство модуля cacherouter в том, что можно указать для каждого вида кэша, где он должен храниться, что позволит выполнить «тонкую» настройку под необходимые задачи сайта. Перенесение библиотекиОдной из задач при разработки сайта кафедры было перенесение материалов библиотеки. Материалы представляют собой различные учебно-методические разработки. С точки зрения веб-разработчика на Drupal материал библиотеки является нодой, имеющей заголовок, такие поля, как авторы, год издания, предмет, описание, и прикрепленный файл. На старом сайте кафедры было порядка 150 учебно-методических разработок. С целью получения навыков написания скриптов с использованием API Drupal было принято решение перенести библиотеку с помощью php-скрипта, суть которого заключается в автоматическом создании нод с соответствующей информацией. Информация со старого сайта (авторы, описание, заголовок) была взята напрямую из БД mysql, файлы скачены через FTP. Перенос пользователей с использованием файлов excel и функций phpРабота с excel-файлами в phpЯзык php позволяет программистам взаимодействовать с excel-файлами, что становится полезным для решений многих задач. В качестве примера можно привести возникшую проблему, при разработке сайта кафедры КСУП. Старый сайт имеет базу студентов, которую необходимо перенести на новый сайт. Задача заключается в том, как именно это сделать. Можно перенести данные «руками», но этот способ слишком трудоёмкий и рутинный, вторым, же методом является – написание алгоритма, который смог бы переносить и одновременно проверять правильность данных. Суть алгоритма, разработчики попытаются донести в этом разделе. Посмотрим простой пример, который будет реализовывать считывание данных из таблицы excel в переменные php: $doc = "c:\www/4meals/_prs/lnks.xls"; $xls = new COM("Excel.Application"); // Создаем новый COM-объект $xls->Workbooks->Open($doc); $i='2'; $rangeValue = $xls->Range("C".$i); while($rangeValue){ if($i>1600){echo "В бесконечность..."; break;} $xls->Range("F".$i)->Value='значение в F'.$i; $i++; $rangeValue = $xls->Range("C".$i); } echo " $xls->Workbooks[1]->Save(); $xls->Workbooks[1]->Close(false); $xls->Quit(); echo 'end of end.'; $xls = null; unset($xls); Из данного примера мы видим, как производится запись из таблицы в переменную php. Далее мы сможем сравнивать данные, удалять, а также добавлять новые записи. СинхронизацияСинхронизация в данном случае представляет из себя сравнение, удаление и добавление данных с учетом информации из каждой таблицы. Для начала нам потребуется создать нового пользователя. Сделать это можно с помощью следующих команд в друпале: $form_state = array(); $form_state['values']['name'] = 'robo-user'; $form_state['values']['mail'] = 'robouser@example.com'; $form_state['values']['pass'] = 'password'; $form_state['values']['op'] = t('Create new account'); drupal_execute('user_register', $form_state); После чего в базу данных добавится запись о новом пользователе и мы сможем уже по приведённому выше алгоритму загружать excel-файл, затем загружать данные из excel в переменные php, а дальше сможем их сравнивать и делать выводы о дальнейшей их пригодности. Меню администратораВся работа, которая будет проделана выше станет ещё более эффективной, если администратор сможет просто взаимодействовать с загрузкой новых пользователей из excel-файла, т.е. ему не придётся искать в коде, где это было реализовано, а соответственно не тратить на это лишнее время. Для этой цели было решено сделать модуль, который бы позволял администратору загружать excel-файлы с данными, после чего друпал сам стал бы синхронизовать информацию и выводить сообщение об успешном или неудачном завершении работы. ДизайнВ начале этого семестра было решено пересмотреть старый дизайн проект, так как в результате опроса выявились большие недостатки прежнего проекта: избыточность элементов, недоработанность, слишком большая и ненужная сложность отрисовки. В результате появился данный дизайн (см. приложения). В основу данного дизайн-проекта закладывалась концепция не на обилие графики, а, прежде всего на удобство использования. Для удобства восприятия, решено было не делать сайт слишком ярким. В цветовой гамме преобладают нейтральные цвета серой гаммы, с добавлением цвета факультета – оранжевого. Современные концепции дизайна как раз переходят из стадии всеобщего увлечения многочисленными графическими элементами в стадию лаконичности полиграфического стиля, отличающегося гармоничностью и неизбыточностью. Подробнее о преимуществах данного дизайна:
Так как сайт кафедры КСУП изначально задумывался как портал, где у каждого студента и преподавателя будет рабочий кабинет с индивидуальным расписанием, дизайн направлен на долгое время работы с сайтом без каких-либо отвлекающих элементов. Также сайт понравится и абитуриентам, так как всю интересующую информацию о кафедре и специальностях можно получить без какого-либо труда. На данный момент дизайн «календаря-расписания», а также некоторых мелких графических элементов (иконки, шапка) находится в стадии разработки и доработки. Дизайн приведён в приложении 1. Вёрстка и шаблонизацияОсновные идеологии вёрстки веб-страницПо принципам использования средств разметки HTML различают логическую разметку и презентационную (физическую). Например, курсивный текст можно получить как с помощью тэга , так и с помощью тэга . В первом случае курсив задаётся явным образом, а во втором на текст производится логическое ударение, которое обычно отображается курсивом. Иными словами при первом подходе ориентируются на внешний вид, а во втором — на логическое предназначение. Преимуществом второго подхода является независимость вёрстки от используемого типа устройств и дизайна веб-страниц. Если придерживаться логической разметки, то можно использовать один и тот же вариант вёрстки для экрана, печати и КПК регулируя внешний вид с помощью отдельных файлов стилей. Способы версткиСуществует три типа верстки страниц: Раньше фреймы и таблицы считались основными способами верстки. Но время не стоит на месте, и с выходом нового поколения веб-браузеров, поддерживающих современные технологии, ситуация изменилась. Использование слоев, наподобие тех, что можно встретить в программе Adobe Photoshop, для верстки документов предоставило веб-мастерам поистине неограниченные возможности. Но, если фреймы уже не используются, то выбор верстки слоями или таблицами – сложный вопрос, требующий обдуманного подхода. Дело в том, что у таблиц хоть и существуют недостатки, но из-за простоты освоения этот метод верстки пользуется неизменной популярностью у начинающих веб-мастеров. Слои являются элементами HTML-кода, которые можно внедрять в веб-страницу путем размещения одного на другом с точностью до пикселя. Изменения в параметры слоя вносятся с использованием языка JavaScript или VBScipt, благодаря чему становится возможным применение на страницах сайта различных эффектов: плавающие окна, вращающиеся надписи, выпадающее меню и другие. Слой задается контейнером Достоинства слоев:
К недостаткам слоев относятся:
Слои практически не ограничивают фантазию дизайнера, но вместе с тем сложны в исполнении. К тому же единый стандарт восприятия веб-браузерами в них отсутствует. Поэтому не гарантировано, что сверстанный сайт будет идентично выглядеть в различных браузерах. Вот почему до сих пор не отказываются от использования таблиц. Однако стоит заметить, что в плане верстки у слоев большое будущее, если устранятся разночтения веб-браузеров. Верстка сайта кафедры производится с помощью слоев, поскольку данный тип верстки используется в шаблоне «Zen» CMS Drupal. Этот шаблон был выбран основным, так как, во-первых, он удобен для создания фундамента для новых шаблонов - в коде шаблона множество комментариев, разъяснены основные моменты и приёмы построения тем - регионы, темизация, переменные и т.д. Так же тема резиновая (созданная на слоях), раскладка вынесена в отдельный файл (layout.css) для быстрого и лёгкого изменения. Во-вторых, шаблон оптимально подходит под дизайн – присутствует тема с двухколоночным дизайном, шапкой и футером. Разработка КалендаряОдной из задач по разработке сайта кафедры стоит Разработка Календаря. Календарь должен включать в себя возможность выводить расписание занятий для студентов и преподавателей, отображать события и объявления, происходящие на кафедре, и кроме того возможность использовать его как планировщик собственных событий по аналогии с Google календарём. Расписание не должно быть статичной таблицей, создание и обновление которой производится руками это долго, неудобно и неэффективно. Заполнение полей расписания должно производиться из базы данных, таким образом, что бы расписание для группы и расписание для преподавателя воспроизводились из одних таблиц данных. Примерная структура базы данных приведена в приложении 2. Изначально предполагалось, что объявления и расписание будут отдельными элементами сайта, но в процессе их разбора мы пришли к выводу, что объявления и расписание станут частью более глобального модуля “Календарь” и будут являться лишь отдельными способами его отображения. Так же в процессе разбора была выдвинута идея добавить календарю возможность индивидуального планирования событий для каждого из владельцев аккаунта на сайте, будь то преподаватель или студент. Иными словами реализовать на сайте кафедры возможности “Google календарь”. Для возможности выполнения всех поставленных задач недостаточно использовать готовые решения, и поэтому необходима самостоятельная разработка модуля. Первым шагом был выбор jquery-календаря, на основе которого и будет выводиться наш календарь. Наш выбор пал на jquery-календарь “fullcalendar”. Его вид приведён в приложении 3. Данный календарь был частично внедрён на сайт. На следующий семестр поставлены следующие задачи:
ЗаключениеВ течении всего семестра мы продолжали разработку сайта кафедры и в общем достигли следующих результатов:
Проделанная работа каждого участника ГПО за семестр:Бахарев А. А. Изучение возможностей CMS, выбор модулей для улучшения функциональности сайта. Координирование разработки сайта. Исследование проблем и нахождение путей их решения в разработке. Написание и отправка статьи «Полный цикл разработки продукта» на научную конференцию «Современные проблемы и пути их решения в науке, транспорте, производстве и образовании'2010». Казарский В. О. Создание и поддержание хостинга для сайта. Решение различных серверных задач (настройка крона, настройка БД). Перенесение библиотеки со старого сайта. Частично вёрстка дизайна. Написание и отправка статьи «Проблемы информатизации современного общества.» на научную конференцию «Современные проблемы и пути их решения в науке, транспорте, производстве и образовании'2010». Мубаракова Ю. М. Создание нового дизайна для сайта. Создание различных графических элементов. Написание и отправка статьи «Разработка дизайна. Руководство для начинающего дизайнера» на научную конференцию «Современные проблемы и пути их решения в науке, транспорте, производстве и образовании'2010». Степин В. С. Установка и настройка различных модулей для CMS. Подготовка к перенесению студентов из БД ТУСУРа на сайт. Написание и отправка статьи на научную конференцию «Современные проблемы и пути их решения в науке, транспорте, производстве и образовании'2010». Ступаков С. В. Перенесение раздела «О кафедре» со старого сайта. Доработка раздела сайта «библиотека». Создание прототипа календаря. Написание и отправка статьи на научную конференцию «Современные проблемы и пути их решения в науке, транспорте, производстве и образовании'2010». Черноусов Е. А. Оптимизация быстродействия сайта. Доработка раздела «сотрудники и студенты». Создание фотогалереи. Обновление ядра CMS и её модулей. Создание раздела «веб-камеры». Написание и отправка статьи на научную конференцию «Современные проблемы и пути их решения в науке, транспорте, производстве и образовании'2010». Варфоломеева О. А. Перенесение контента со старого сайта. Вёрстка и шаблонизация дизайна. Написание и отправка статьи на научную конференцию «Современные проблемы и пути их решения в науке, транспорте, производстве и образовании'2010». Cписок использованных источников
Приложения
 
  |
Добавить документ в свой блог или на сайт
Похожие:
 | Проекта: Разработка Web-приложений В течении семестра участники нашей группы закончили разработку нового сайта кафедры на cms drupal | | Проекта: Разработка Web-приложений В течении семестра участники нашей группы ознакомились с основными возможностями системы управления контентом (cms) Drupal, а так... |
| Программа по формированию навыков безопасного поведения на дорогах... Целями освоения дисциплины «Создание Интернет-проектов. Уровень Разработка Web-приложений с помощью php и Mysql» являются | | Курсовая работа На тему: «Разработка системного проекта типовой платформы... На тему: «Разработка системного проекта типовой платформы для web порталов муниципальных образований Пермского края» |
| Рефератов (ргр) по дисциплине «Разработка приложений в среде Oracle» Разработка Delphi-приложений для Oracle. Визуальные компоненты для работы с набором данных | | Рабочая программа дисциплины «Интернет- технологии» ... |
 | Программа по формированию навыков безопасного поведения на дорогах... Факультативный курс " Web конструирование" для учащихся 8 класса является расширением темы "Разработка Web сайтов" | | Проект по теме: Разработка учебного проекта «Геометрия вокруг нас» Разработка проекта «Геометрические кружева» по курсу геометрии для учащихся 7 класса общеобразовательных школ |
| «Динамическое Web-Программирование» Целью курса "Динамическое Web-Программирование" является изучение принципов разработки приложений, работающих в среде Интернет и... | | Программа по формированию навыков безопасного поведения на дорогах... Обучающая: дать представление основных понятий Web – сервер, Web – сайт, Web – страница, гиперссылка, тег, структура html – документа,... |
| Лекция к уроку №6 Более того, во всех этих случаях наибольший объем работ по подготовке проекта ложится на плечи web-мастера, или, как еще называют... | | Кафедра системного программирования Разработка программного интерфейса... Разработка программного интерфейса для мэшап-приложений на базе платформы Ubiq Mobile |
| Дипломная работа по специальности 230201. 65 «Информационные системы... Разработка информационного web-сайта на основе системы «1с-битрикс: Управление сайтом» | | План урока по теме: «Web-страницы и web-сайты. Структура web-страницы.»... Обучающая организовать деятельность учащихся по изучению новой темы; ознакомить учащихся с понятием сайта, структурой web- страницы,... |
| Московский энергетический институт (технический университет) Целью дисциплины является изучение технологии разработки Windows и Web приложений для решения задач обработки, хранения и передачи... | | Интернет-технологии и Web-дизайн ... |
