Автор Анна Евкова
Преподаватель который помогает студентам и школьникам в учёбе.

РАЗРАБОТКА ТУРИСТИЧЕСКОГО САЙТА

Содержание:

ВВЕДЕНИЕ

Влияние глобальной компьютерной сети Internet на современный мир не имеет исторических аналогов. Его сегодняшний день – это начало эпохи электронного проникновения во все сферы человеческой жизни, это нечто большее, чем просто маркетинговая кампания, это основа новой философии и новой деловой стратегии.

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

Web-технология полностью перевернула представления о работе с информацией, да и с компьютером вообще. Оказалось, что традиционные параметры развития вычислительной техники - производительность, пропускная способность, емкость запоминающих устройств - не учитывали главного "узкого места" системы - интерфейса с человеком. Устаревший механизм взаимодействия человека с информационной системой сдерживал внедрение новых технологий и уменьшал выгоду от их применения. И только когда интерфейс между человеком и компьютером был упрощен до естественности восприятия обычным человеком, последовал беспрецедентный взрыв интереса к возможностям вычислительной техники.

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

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

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

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

Разработка веб-приложений-это создание прикладных программ, которые находятся на удаленных серверах и доставляются на устройство пользователя через Интернет. Веб-приложение (web app) не требуется загружать, а доступ к нему осуществляется через сеть. Конечный пользователь может получить доступ к веб-приложению через веб-браузер, такой как Google Chrome, Safari, Opera или Mozilla Firefox. Большинство веб-приложений могут быть написаны на JavaScript, CSS и HTML.

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

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

База данных, такая как MySQL, может использоваться для хранения данных при разработке веб-приложений.

Веб-приложения имеют большой объем информации, который может содержать ошибки, поэтому процесс тестирования для веб-приложений, как правило, более углубленного, чем другие формы программного обеспечения. Тесты разработки веб-приложений могут включать тесты безопасности, производительности, нагрузки, стресса, доступности, удобства использования и обеспечения качества. Другие тесты, которые могут быть выполнены для веб-приложений, включают проверку HTML/CSS или кросс-браузерные тесты. Многие из этих тестов могут и должны быть автоматизированы, когда это возможно.

Полезные инструменты разработки веб-приложений включают:

  • Bootstrap: платформа автоматизации, которая управляет HTML и CSS.
  • jQuery и Ruby on Rails: для библиотек JavaScript и фреймворков соответственно.
  • js: среда выполнения JavaScript используется в качестве внутреннего инструмента программирования.
  • VS нативные и гибридные приложения

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

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

Задачей данного курсового проекта является разработка сайта с помощью веб- технологий: HTML , CSS. PHP, Javascript, My SQL и Apache.

Приложение должно удовлетворять следующим требованиям:

Скрывать от конечного пользователя информацию о том, откуда получаются данные о сетевой активности узлов предприятия;

Выполнять масштабирование страниц, на которых отображаются картинки с графиками сетевой активности, в зависимости от разрешения монитора;

Позволять редактирование страниц, на которых отображаются картинки с графиками сетевой активности;

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

  1. Техническое задание и выбор средств реализации.

В качестве предметной области выступает сайт туристической компании. На сайте будут отражаться информационные разделы в меню:

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

Сайт реализован на нескольких языках програмирования HTML , CSS. PHP и JavaScript .

Разрабатываемый сайт и его система управления являются веб-приложением. Веб-приложение – приложение, в котором клиентом выступает браузер, а сервером – веб-сервер. Браузер способен отображать веб-страницы и, как правило, входит в состав операционной системы. Логика приложения сосредотачивается на сервере, а функция браузера заключается в основном в отображении информации, загруженной по сети с сервера, и передаче обратно данных, введенных пользователем. Одним из преимуществ такого подхода является тот факт, что клиентская часть приложения не зависит от конкретной операционной системы пользователя, и веб-приложения, таким образом, являются межплатформенными сервисами.

Web-страницы могут существовать в любом формате, но в качестве стандарта принят Hyper Text Markup Language (язык гипертекстовой разметки) – это основной язык, с помощью которого создаются веб-страницы. Страница, которую пользователь видит в своем браузере, может состоять из множества разных файлов – например, изображений, анимационных роликов, сценариев JavaScript, апплетов и т. д. – но основой страницы практически всегда является документ HTML.

Документ HTML представляет собой файл типа html, находящийся на сервере Интернета, в локальной сети или на жестком диске. Этот файл содержит обычный текст и текстовые команды разметки, называемые тегами. С помощью тегов можно решить две основные задачи:

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

- управлять связями документа с другими ресурсами (изображениями, таблицами стилей, внешними программами, сторонними Web-страницами).

Теги HTML не задают определенные и точные атрибуты форматирования документа, как, например, Microsoft Word. Конкретный вид документа окончательно определяет только программа-браузер на компьютере. Необходимость такого подхода связана с разнородностью аппаратного и программного обеспечения устройств, подключенных к Интернету. HTML – не язык программирования, хотя Web-страницы могут как сами являться результатом работы серверных программ, так и включать в себя специально подготовленные клиентские программы – скрипты и апплеты.

Для оформления веб-приложения некоторых других видов документов используется преимущественно язык CSS (каскадные таблицы стилей). CSS используется создателями веб-страниц для задания цветов, шрифтов, расположения отдельных блоков и других аспектов представления внешнего вида этих веб-страниц.

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

В области программирования для сети Internet PHP – один из популярнейших языков благодаря своей простоте, скорости выполнения, богатой функциональности и распространению исходных кодов на основе лицензии PHP. Именно по этим причинам было принято решение создавать динамический сайт на PHP. PHP (англ. PHP: Hypertext Preprocessor – "PHP: препроцессор гипертекста") – скриптовый язык программирования, созданный для генерации HTML-страниц на веб-сервере и работы с базами данных. В настоящее время поддерживается подавляющим большинством хостинг-провайдеров. PHP отличается наличием ядра и подключаемых модулей, "расширений": для работы с базами данных, сокетами, динамической графикой, криптографическими библиотеками, документами формата PDF и т. п. Существуют сотни расширений, но в стандартную поставку входит лишь несколько десятков хорошо зарекомендовавших себя.

PHP обладает рядом преимуществ, в числе которых:

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

- Традиционность. Язык РНР будет казаться знакомым программистам, работающим в разных областях. Многие конструкции языка позаимствованы из Си, Perl. Код РНР очень похож на тот, который встречается в типичных программах на С или Pascal. Это заметно снижает начальные усилия при изучении РНР. PHP – язык, сочетающий достоинства Perl и Си и специально нацеленный на работу в Интернете, язык с универсальным (правда, за некоторыми оговорками) и ясным синтаксисом.

Простота. Сценарий РНР может состоять из 10 000 строк или из одной строки – все зависит от специфики вашей задачи.

PHP – язык, который может быть встроен непосредственно в html -код страниц, которые, в свою очередь будут корректно обрабатываться PHP -интерпретатором. Мы можем использовать PHP для написания CGI-сценариев и избавиться от множества неудобных операторов вывода текста. Мы можем привлекать PHP для формирования HTML-документов, избавившись от множества вызовов внешних сценариев.

разрабатывался на текстовый редакторе Notepad++ отвечающий всем требованиям профессиональных веб-разработчиков. Многочисленные панели инструментов позволяют быстро набирать исходный код будущей страницы практически без помощи клавиатуры, а внутренний анализатор проверяет корректность документа. Главная же особенность Notepad++ – поддержка плагинов, которые способствуют расширению базового функционала редактора. В программу интегрируются дополнительные плагины, позволяющие настроить проверку орфографии, автоматическое сохранение документов, симметричное и асимметричное шифрование текста и многое другое.

2. Описание модулей серверной части программы и их взаимодействие.

Сначала создаю базу данных и таблицу для регистрации на сайте:

Рисунок №1

Создаю соединение с этой таблицей. Давайте создадим файл bd.php:

Рисунок №2

3. Описание структуры базы данных и ее функций.

По умолчанию сама БД сайта находится в каталоге data на веб-сервере интернет-проекта. К примеру, если БД имеет название bd, то все ее значения находятся в data/bd. Как правило, на хостинге доступ к файлам БД закрыт, их следует “вытягивать” посредством запросов SQL через консоль. Упрощает работу с запросами именно MySQL. Для того чтобы попасть в MySQL, необходимо зайти по ссылке, которую дает хостинг-провайдер, и ввести логин-пароль от базы.

4. Описание структуры клиентской части.

Чаще всего веб-приложения состоят как минимум из трёх основных компонентов:

  • Клиентская часть веб приложения - это графический интерфейс. Это то, что вы видите на странице. Графический интерфейс отображается в браузере. Пользователь взаимодействует с веб-приложением именно через браузер, кликая по ссылкам и кнопкам.
  • Серверная часть веб-приложения - это программа или скрипт на сервере, обрабатывающая запросы пользователя (точнее, запросы браузера). Чаще всего серверная часть веб-приложения программируется на PHP. При каждом переходе пользователя по ссылке браузер отправляет запрос к серверу. Сервер обрабатывает этот запрос, вызывая некоторый PHP-скрипт, который формирует веб-страничку, описанную языком HTML, и отсылает клиенту по сети. Браузер тут же отображает полученный результат в виде очередной веб-страницы.
  • База данных (БД, или система управления баазми данных, СУБД) - программное обеспечение на сервере, занимающееся хранением данных и их выдачей в нужный момент. В случае форума или блога, хранимые в БД данные - это посты, комментарии, новости, и так далее. База данных располагается на сервере. Серверная часть веб-приложения (то есть, PHP скрипт) обращается к базе данных, извлекая данные, которые необходимы для формирования страницы, запрошенной пользователем.

Это, пожалуй, основные компоненты большинства веб-приложиний. Графически схему их взаимодействия можно представить так:

Рисунок №3

4.1. Описание интерфейса «Обычный пользователь».

Пользовательская часть сайта состоит из шести основных блоков:

  • шапка сайта;
  • блок навигации;
  • блок авторизации;
  • блок поиска;
  • блок основного содержания;

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

Шапка сайта одинаковая для всех страниц сайта, она содержит в себе небольшое изображение, и текст, наиболее полно отражающий идею сайта.

В блок навигации выводятся из базы данных все категории сайта в виде ссылок, на них.

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

Блок поиска предназначен для отправки ключевого слова по которому будет, происходит поиск в новостях сайта. Этот запрос отправляется в GET переменной search в файл обработчик search.php.

Описанные выше блоки не меняют своё содержание на всех страницах сайта, при посещении пользователем сайта. В процессе перехода по ссылкам меняется только блок с основным содержанием.

Блок с основным содержанием формируется в файлах, которые непосредственно производят вывод информации в браузер, на всех страницах сайта, изменяются только файлы: index.php, login.html, profile.html, recover_password.php, registration.php, search.php, view_cat.php, view_post.php.

На главной странице index.php в блоке основного содержания выводится краткое описание 5 последних новостей, с ссылками на них, количество просмотров, дата добавление, автор и категория.

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

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

На странице восстановления пароля recover_password.php в блоке основного содержания отображается форма с одним полем и кнопкой. Полем для ввода логина или пароля и кнопкой для активации формы. После ввода логина или пароля если они есть в базе данных, на этой же странице открывается другая форма над которой отображается секретный вопрос который указал пользователь при регистрации при правильном ответе на данный вопрос генерируется новый пароль и отображается в браузере.

На странице регистрации registration.php в блоке основного содержания отображается форма, состоящая из семи полей: логин, проль, имя, email, секретный вопрос, и поля для ввода кода с картинки. При правильном заполнении этих полей в браузер выводится сообщение об успешной регистрации пользователя.

На странице поиска search.php в блоке основного содержания отображаются новости которые соответствуют указанному в блоке поиска поисковому запросу.

На странице вывода новостей категории view_cat.php в блоке основного содержания отображаются новости выбранной категории.

На странице вывода полной новости view_post.php в блоке основного содержания отображается полная новость. Кроме этого отображаются и все комментарии к этой новости с формой добавления комментариев. В этом блоке для отправки комментариев, не зарегистрированным пользователям нужно ввести код с картинки, имя и email, а зарегистрированным пользователям заполнять эти поля не нужно, так как они уже идентифицированы.

4.2. Описание интерфейса «Администратор».

Административная часть сайта в чем то похожа на пользовательскую. Её можно условно поделить на 3 части:

  • шапка сайта;
  • меню редактирования;
  • динамическая часть;

Две первые части на всех страницах остаются неизменными, а вот третья постоянно изменяется в зависимости от выбранного в меню пункта.

Меню редактирования находится с левой стороны ниже шапки сайта и состоит из ссылок, которые ведут на php файлы, позволяющие редактировать, удалять, и добавлять контент сайта и пользователей.

Динамическая часть сайта находится ниже шапки сайта и правее меню редактирования. В нем и происходит редактирование, удаление, и добавление информации.

C:\Users\Никита\AppData\Local\Microsoft\Windows\INetCache\Content.Word\novosti.png

Рисунок 4.

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

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

Рисунок 5.

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

4.3. Инструкция пользователя.

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

Рисунок 6.

С этой страница через гиперссылки пользователь может попасть в любую категорию сайта, через навигационное меню.

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

Рисунок 7.

Рисунок 8.

Заключение

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

  • Язык программирования PHP;
  • Язык программирования Html;
  • Язык программирования CSS;
  • Веб-сервер Denwer;
  • Реляционная система управления БД MySQL;
  • Приложение PHPMyAdmin;
  • Язык программирования JavaScript;
  • Текстовой редактор Notepad++.

СПИСОК ИСПОЛЬЗОВАННОЙ ЛИТЕРАТУРЫ

  1. Зарохин, Л.З. PHP для начинающих / Л.З. Зарохин - СПб.: БХВ -Петербург, 2016.
  2. Овицкий, Н.Ф. PHP как инструмент для работы с MySQL базой данных / Л.З Овицкий - М. : Вильямс, 2018.
  3. Морозов, Б.С. MySQL для начинающих / Б.С. Морозов - СПб. : Корона-принт, 2017.
  4. Демидов, С.Д. Технологии разработки WEB приложений / С.Д. Демидов, Н.А. Ерохин - СПб.: БХВ-Петербург, 2014.
  5. Колесниченко, Д.С. CSS для начинающих WEB разработчиков / Д.С. Колесниченко - М. : ДНК, 2017.
  6. Беклешов, В.К. Технико-экономическое обоснование дипломных проектов / В.К. Беклешов - М.: Высшая школа, 2016.
  7. Орлов, С.А. Технология разработки программ / С. А. Орлов - СПб. : Питер, 2018.
  8. Федорчук, Д. А. Разработка WEB приложений на PHP и MySQL / Д.А. Федорчук - СПб. : Корона-принт, 2016.
  9. Прохоров, В.В. Разработка WEB приложений с нуля / В.В. Прохоров - Мн.: БГУИР, 2017.
  10. Семич, А.В. Охрана труда при работе на персональных электронно-вычислительных машинах и другой офисной технике. Практическое пособие / А.В. Семич - Мн.: ЦОТЖ, 2018.
  11. Сорокин, А.В. Приёмы работы с MySQL базой данных / А.В. Сорокин - М.: 2019.
  12. Нестереноко, А.В. PHP Практикум / А.В. Нестеренко - СПб.: Питер, 2019.
  13. Федоров, Н.З. PHP и MySQL для начинающих / Н.З. Федоров - СПб.: БХВ-Петербург, 2017.

ПРИЛОЖЕНИЕ