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

Разработка сайта кондитерского комбината «Лакомка

Содержание:

Введение

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

Целью данного курсового проекта является разработка web-сайта кондитерского предприятия «Лакомка».

Для достижения поставленной цели необходимо решить следующие задачи:

  • сформировать список требований к разрабатываемому сайту;
  • проанализировать исходные данные;
  • выбрать технологии реализации (язык программирования и СУБД);
  • разработать сайт.

Конечным итогом курсового проекта является созданный сайт, удовлетворяющий всем предъявленным к нему требованиями.

1. Требования к приложению

1.1 Назначение программы

Целью данной работы является разработка электронного представительства кондитерского комбината «Лакомка» с возможностью последующего размещением в сети Интернет.

1.2 Требования к функциональному наполнению

Функции разрабатываемого приложения:

  1. Предоставление посетителям сайта исчерпывающей информации о компании, а именно:
    1. общее описание деятельности компании;
    2. контактные данные;
    3. новости;
    4. ассортимент товаров.
  2. Возможность оставить гостям сайта отзыв о работе компании.
  3. Возможность оставлять комментарии к новостям.
  4. Возможность отправки вопроса к компании посетителями сайта.
  5. Возможность управления содержимым сайта через панель администрирования. Необходимы следующие функции администрирования:
    1. модерация отзывов;
    2. добавление/изменение новостей сайта;
    3. редактирование каталога товаров;
    4. изменение контактных данных и другой информации о компании, представленной на сайте.
  6. Защита от несанкционированного доступа панели администрирования.
  7. Возможность проведения голосования по различным вопросам.

1.3 Формат входных данных

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

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

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

Таблица 1.1 Характеристика входных данных

Наименование

Атрибуты

Отзыв клиента

  • email пользователя;
  • имя пользователя;
  • текст отзыва;
  • оценка по пятибалльной шкале.

Комментарии к новостям

  • email пользователя;
  • имя пользователя;
  • текст отзыва.

Вопросы к компании

  • email пользователя;
  • телефон пользователя
  • имя пользователя;
  • текст вопроса.

Данные о компании

  • название;
  • адрес;
  • телефон;
  • слога;
  • логотип;
  • текст с описанием компании

Товары

  • название;
  • описание товара;
  • изображения товара

1.4 Формат выходных данных

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

  1. отчет об отзывах;
  2. отчет о комментариях к новостям;
  3. отчет о комментариях к товарам;
  4. отчет о количество просмотров новостей и товаров;
  5. результаты проведения опросов.

Более полная характеристика выходных данных приведена в виде таблица 1.2

Таблица 1.2 Характеристика выходных данных

Наименование

Атрибуты

Отчет об отзывах

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

Отчет о комментариях к новостям

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

Отчет о комментариях к товарам

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

Отчет о количестве просмотров новостей

  • наименование новости;
  • количество просмотров.

Отчет о количестве просмотров товаров

  • наименование товара;
  • количество просмотров.

Результаты проведения опросов

  • наименование вопроса;
  • общее количество участников;
  • наименование ответа;
  • процент проголосовавших.

1.5 Требования к пользовательскому интерфейсу

Сайт должен быть оптимизирован для просмотра при разрешении 1024*768, 1280*1024 без горизонтальной полосы прокрутки и без пустых (белых) полей для основных типов разрешения.

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

Шрифты, используемые в графических элементах сайта, могут выбираться произвольно при условии непротиворечия корпоративному стилю. Шрифты, используемые в текстовых материалах сайта, должны соответствовать стандартным шрифтам браузеров: Helvetica/Arial, Times New Roman, Courier.

Допустимо использование иных распространенных шрифтов (Verdana, Tahoma и др.) в том случае, если их замена на стандартные шрифты не приведет к визуальному искажению текста. Размер (кегль) шрифтов должен обеспечивать удобство восприятия текста при минимально допустимом размере экрана.

Слова, наиболее полно характеризующие стилистику сайта: вкусный, аппетитный, кондитерский.

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

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

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

1.6 Требования к структуре сайта

Схематическое изображение структуры разделов и подразделов сайта изображено на рисунке 1.1.

Рисунок 1.1 – Схема структуры разделов и подразделов сайта

1.7 Требования к информационной безопасности

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

2. Анализ исходных данных

Работа web-сайта основана на протоколе HTTP.

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

Как следует из его названия, первоначально HTTP предназначался для передачи между приложениями так называемого гипертекста (hypertext), представляющего собой особый вид данных, созданный в соответствии со стандартом HTML (HyperTextMarkupLanguage – язык разметки гипертекста). Гипертекстовый документ состоит из данных, размеченных с помощью тегов (tag) языка HTML, и представляет собой комбинацию текста, изображений, гиперссылок и прочих средств представления данных. Гиперссылки – одна из важнейших составляющих HTML-документа – представляют собой интерактивные области, воздействие на которые приводит к получению связанных с гиперссылкой данных. Это позволяет пользователю, работающему с гипертекстовой информацией, осуществлять навигацию в пределах набора документов или даже всей сети Интернет, получая интересующую его информацию с помощью контекстных гиперссылок.

Протокол HTTP является надстройкой над протоколом TCP и является средством контроля содержания передаваемых данных. В отличие от TCP, который не учитывал структуру передаваемых пакетов, HTTP внедряет в данные метаинформацию, позволяющую получателю корректно интерпретировать полученные данные. На основе HTTP функционирует глобальная сеть Интернет (называемая также WorldWideWeb или WWW). Первая версия протокола – HTTP/0.9 – обладала достаточно ограниченными возможностями, но с активным развитием всемирной сети появились новые версии: HTTP/1.0 и HTTP/1.1, позволяющие контролировать передачу по вычислительным сетям не только гипертекстовой информации, но и произвольные бинарные файлы: звуковые, графические, архивные и пр.

В силу того, что HTTP является надстройкой над протоколом TCP, при передачи данных также выделяются две стороны: клиент и сервер.

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

Сервер при передаче данных через HTTP называют веб-сервером (web-server). Эта программа осуществляет обработку запросов от клиентов, передавая запрошенные данные в виде ответов (response), содержащих помимо искомых данных метаинформацию, их описывающую.

Получение пользователем интересующих его данных состоит из следующих этапов:

  1. Пользователь вводит в строке браузера адрес интересующего его ресурса.
  2. Браузер на основе информации, полученной от пользователя, а также учитывая свои настройки и конфигурацию операционной системы, формирует запрос.
  3. Браузер подключается к серверу, расположенном, возможно, на удаленном компьютере, и передает ему запрос.
  4. Сервер, анализируя запрос, выполняет необходимые действия: формирует ответ, включая в него тело запрошенного документа. Если это гипертекстовый документ, он загружается из файла или же генерируется динамически посредством сценария. В ответ также включается информация о содержащихся в нем данных.
  5. Сервер передает ответ браузеру.
  6. Браузер анализирует ответ и либо сохраняет полученные данные в файл, либо, в случае гипертекстового документа, анализирует теги HTML и отображает документ на экране.

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

Строка состояния состоит из трех полей, разделенных символами SP, и содержит в конце последовательность символов CR, LF. Элементы строки состояния:

  1. Версия протокола HTTP – разработанный сайт всегда использует строку «HTTP/1.1».
  2. Код состояния (statuscode) – трехсимвольный цифровой код, который идентифицирует результат выполнения запроса. Хотя стандартом определен достаточно большой набор кодов состояния, в приложении используются следующие коды:
    1. 200 – успешное выполнение;

    2. 400 – некорректный запрос;
    3. 401 – несанкционированный доступ;
    4. 404 – ресурс не найден;
    5. 405 – неприменимый метод;
    6. 505 – неподдерживаемая версия HTTP.
  3. Фраза состояния (reasonphrase) – короткая фраза, поясняющая код состояния выполнения запроса.

Раздел заголовков оканчивается двумя парами символов CR и LF, после чего следует произвольный набор символов – объект. При работе сайта такими объектами могут являться только гипертекстовые документы в формате HTML, динамически генерируемые программным кодом приложения.

В качестве языка программирования был выбран язык php.

3. Разработка приложения

3.1 База данных

Разработка базы данных осуществлялась в следующей последовательности:

  1. создание концептуальной модели;
  2. создание логической модели;
  3. создание физической модели.

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

  1. пользователи ИС, которые управляют контентным содержимым сайта;
  2. разделы сайта;
  3. категории в разделах;
  4. материалы в категориях;
  5. комментарии (или отзывы) к материалам;
  6. голосования;
  7. варианты ответов к голосованиям.

Выделенные сущности связаны друг с другом связями один-ко-многим. Концептуальная модель с выделенными сущностями и связями между ними изображена на рисунке 3.1

Рисунок 3.1 – Концептуальная модель предметной области

Следующий шаг создания базы данных – построение логической модели данных на основе концептуальной. Для этого необходимо выделить атрибуты каждой сущности. Атрибутами сущности называются характеристики, присущие экземплярам данной сущности.

Для пользователя характерны следующие атрибуты:

  1. имя;
  2. пароль;
  3. email.
  4. Раздел характеризуется следующими атрибутами:
  5. автор – пользователь, который создал данный раздел;
  6. название – название, выводимое в списке разделов в панели администрирования;
  7. заголовок – заголовок раздела, выводимый пользователям на сайте;
  8. описание – текст описания в формате html;
  9. url – постоянный адрес раздела (на латинице);
  10. ключевые слова – meta-тэг keywords;
  11. дата создания – дата и время, когда раздел был создан;
  12. дата изменения – дата и время последнего внесения изменения в какие-то атрибуты раздела;
  13. активность – включено ли отображение раздела на сайте;
  14. главный – пометка о том, что данный раздел необходимо выводить по умолчанию;
  15. порядок сортировки – числовое значение, обозначающее порядковый номер раздела в списке разделов сайта.

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

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

Конечная логическая модель со всеми сущностями и атрибутами изображена на рисунке 3.2.

Рисунок 3.2 – Логическая модель

3.2 Пользовательский интерфейс

Для создания красивого пользовательского интерфейса использовался язык гипертекстовой разметки html и создание css-стилей для элементов страницы. Весь сайт выполнен в белом и розовом тонах.

После перехода на сайт компании открывается главная страниц.

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

Под шапкой сайта расположены три основных раздела: торты, начинки и сладости.

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

1.jpg

Рисунок 3.1 – главная страница сайта

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

При переходе в раздел «Торты» открывается текст из описания данного раздела, а в левом меню открывается список категорий данного раздела.

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

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

В разделе «Отзывы» располагаются отзывы клиентов о компании, которые были одобрены администраторами сайта.

Для того, чтобы перейти к управлению сайтом, необходимо после адреса сайта добавить/admin, после этого откроется форма авторизации (Рисунок 3.2), на которой необходимо ввести логин и пароль.

Рисунок 3.2 – Форма авторизации

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

Рисунок 3.3 – Домашняя страница панели администрирования

Управление всеми страница сайта осуществляется с помощью специальных форм, полями которых являются все атрибуты редактируемого объекта. Для полей «описание» разделов, категорий и материалов подключен визуальный редактор, Который также имеет возможность отображения исходного html-кода отформатированного текста (Рисунок 3.4).

C:\Users\Mixa\YandexDisk\Скриншоты\2016-09-09_19-12-05.png

Рисунок 3.4 – Поле для редактирования текста описания

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

C:\Users\Mixa\YandexDisk\Скриншоты\2016-09-10_00-37-42.png

Рисунок 3.5 – Страница просмотра результатов опроса

Заключение

В ходе проделанной работы были достигнуты следующие результаты:

  1. был составлен список требований к разрабатываемому приложения: требования к функциональному наполнению, были выделены входные и выходные данных, сформулированы требования к пользовательскому интерфейсу, структуре сайта и информационной безопасности;
  2. был проведен анализ исходных данных, в ходе которого был изучен http-протокол.
  3. было разработано приложение в виде web-сайта с использованием скриптового языка программирования php и фреймфорка Symfony, а также системы управления базами данных MySQL. Решающим факторов выбора этих средств разработки приложения стало их бесплатность, а также простота изучения и использования.

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

Список литературы

  1. Гагарина Л.Г. Разработка и эксплуатация автоматизированных информационных систем: учебное пособие. М.: ИД «ФОРУМ»: ИНФРА-М, 2013. 384 с.
  2. Горбаченко В.И., Убиенных Г.Ф. Бобрышева Г.В. Проектирование информационных систем с СА Erwin Modeling Suite 7.3. Пенза: Изд-во ПГУ, 2012, 154 c.
  3. Колисниченко Д. PHP и MySQL. Разработка WEB-приложений / Д. Колисниченков – Спб: БХВ-Петербург, 2013. – 560 с.
  4. Документация Symfony: http://symfony.com
  5. Документация php: http://php.net
  6. Документация mysql: http://dev.mysql.com/doc/
  7. Материала сайта-справочника по html, css: http://htmlbook.ru

Приложение

Приложение 1

код1.jpgкод2.jpg