Материал: Интернет-магазин

Интернет-магазин

Некоммерческое акционерное общество

«АЛМАТИНСКИЙ УНИВЕРСИТЕТ ЭНЕРГЕТИКИ И СВЯЗИ»

ФАКУЛЬТЕТ Радиотехники и связи

Кафедра Компьютерных технологий

КУРСОВАЯ РАБОТА

По дисциплине «Моделирование систем безопасности интернет-технологий»

На тему «Интернет-магазин»

Выполнил: Аманжолов Т.К. Группа: СИБ-12-2

Приняла: ст. пр. Ельчибаева Р.Б.

Алматы, 2015

Содержание

Введение

. Обзор используемых технологий

.1 HTML

.2 Java Script

.3 PHP

.4 Mysql запросы

.5. Denwer

. Проектирование сайта

.1 Постановка задач и функционал сайта

.2 Внешняя структура сайта

.3 Внутрення структура сайта

. Разработка сайта

.1 Диаграмма прецендентов

.2 ER-диаграмм

.3 Руководство пользователя

Заключение

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

Приложение А

Введение

Проектирование сайта - один из процессов, которому уделяют несправедливо мало внимания. Стоит отдавать себе отчет в том, что процесс проектирования будущего web сайта, это процедура экономии денег и времени. Чем более подробно и удовлетворительно сформулированы задачи, чем меньше нераскрытых вопросов, тем точнее будет бюджет и тем меньше времени уйдет на реализацию проекта, а так же на рекламу, в дальнейшем и продвижение сайта в поисковых системах. Кстати, если говорить о полном цикле, то проектирование и разработка интернет сайта под ключ, поспециальному тарифу <#"783778.files/image001.jpg">

Рисунок 1 - Внешняя структура сайта

Теперь остановимся на нашем сайте который рекламируют продукцию комнапии LIQUIMOLY которая занимается распространеим продукции для автомобилей.

Рисунок 2 - Главная страница интернет-магазина

Шапка сайта - это титульная верхняя часть дизайн-макета веб-страницы. Соответственно, нижняя часть страницы называется подвалом или футером сайта <#"783778.files/image003.jpg">

Рисунок 3 - Шапка интернет магазина

Баннер - графическое <https://ru.wikipedia.org/wiki/%D0%93%D1%80%D0%B0%D1%84%D0%B8%D0%BA%D0%B0> изображение рекламного характера, аналогичное рекламному модулю в прессе. Может быть как статичным изображением или даже текстом, так и содержать анимированные элементы (вплоть до видео и интерактивных объектов). Как правило, содержит гиперссылку на сайт рекламодателя или страницу с дополнительной информацией.

Рисунок 4 - Баннер интернет-магазина

Меню - наиболее распространенная навигационная система, она похожа на оглавление к книге. Меню состоит из коротких текстовых активных ссылок на определенные страницы сайта. Отметим, что меню должно быть видно с любой страницы ресурса тогда пользователь сможет воспользоваться им в любой момент. Составление полного меню, благодаря которому будет осуществляться быстрый переход на искомые страницы, для больших сайтов (свыше 50 страниц) практически невыполнимая задача. Тогда на помощь приходит раскрывающееся меню, т.е. когда человек кликает на какую либо ссылку, открывается несколько дополнительных ссылок, характеризующих подразделы. Можно размещать несколько меню: одно под шапкой два других по бокам - справа и слева. В том случае, если сайт небольшой, то лучше ограничиться формированием меню в правой колонке сайта, т.к. это очень удобно и привычно для пользователя. В общем, справа лучше располагать самые важные ссылки на разделы, поскольку данная зона наиболее активна на сайте (на этот угол посетитель чаще всего смотрит, наверное, приноравливаясь нажать на крестик «закрыть» в правом верхнем углу браузера <#"783778.files/image005.jpg">

Рисунок 5 - Основное меню сайта

Рисунок 6 - Меню продукции

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

Рисунок 7 - Основной блок

Теперь разберем каждый часть меню по отдельности. Вкладка-Главная при нажатии на эту вкладку у нас появляется окно с приветствием и логотипом компании.

Рисунок 8 - Главная вкладка

Вкладка о доставке и оплате. Данная часть меню отвечает за то как клиент сможет забрать или получить свою покупку. Здесь указывается также цены за доставку. Одно из главных удобст интернет-магазина является то, что вы можете совершить покупку даже не выходя из дома.

Рисунок 9 - Доставка и оплата

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

Рисунок 10 - Контакты

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

Рисунок 11 - Виды присадок

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

Рисунок 12 - Присадки к маслам

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

Рисунок 13 - Смазочные материалы

Рисунок 14 - Средства для ремонта

Остался единственный элемент который мы не разобрали - корзина. При покупки товара он сохраняется в корзине где мы можем просмотреть что мы купили и в каком количестве.

Рисунок 15 - Корзина

Внутренняя структура сайта показывает структуру работа движка. Данный сайт был построен на подобии структуры которой показана ниже. (Рис 16).

Рисунок 16 - Внутренняя структура сайта

Класс для работой с БД занимается импортированием и записью данных в бд.

Асбтрактный класс для работы с таблицами

Этот класс дает возможность для ускоренной разработки интерфейса для работы с БД. Класс JTable поможет в осуществлении таких действий, как блокировка, создание или удаление содержимого таблиц базы данных. Функции, которые поддерживает класс JTable, приведены ниже:

Возможность копирования информации к JTable;

Запись данных в XML;

Полное управление записями;

Возможность сопоставить запись с набором заранее определенных правил;

Блокировка пользователя в любое время

Возможность сортировки записей таблиц;

Создание активной записи;

Создание счетчика количества просмотров записи;

Для того, чтобы можно было работать с записями таблицы БД, позволяет осуществить выполнение всех основных функций при работе с таблицей - CRUD (Create Read Update Delete). Но для работы класс необходимо расширить, то есть - создать новый класс для каждой таблицы, которая будет работать в классе JTable. Если при создании подкласса строго придерживаться определенных правил, то это позволит нам вставить созданное расширение в framework Joomla. Каждое новое имя класса должно быть с префиксом table, и этот класс должен располагаться в каталоге tables, каждый в новом отдельном файле в административном разделе компонента. Работа с классом JTable показана на примере ниже.

Классы для работы с таблицами. Данный класс занимается любыми манипуляциями с таблицами.

Классы страниц генерирует HTML страницы

Шаблонизатор это программное обеспечение, позволяющее использовать html-шаблоны <https://ru.wikipedia.org/wiki/%D0%92%D0%B5%D0%B1-%D1%88%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD> для генерации конечных html <https://ru.wikipedia.org/wiki/Html>-страниц. Основная цель использования шаблонизаторов - это отделение представления данных от исполняемого кода. Часто это необходимо для обеспечения возможности параллельной работы программиста и дизайнера-верстальщика. Использование шаблонизаторов часто улучшает читаемость кода и внесение изменений во внешний вид, когда проект целиком выполняет один человек.

Конфигурация содержит информацию о количестве страниц, паролях, логинах

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

Класс управления схема использования нескольких шаблонов проектирования <https://ru.wikipedia.org/wiki/%D0%A8%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD_%D0%BF%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D1%8F>, с помощью которых модель приложения, пользовательский интерфейс <https://ru.wikipedia.org/wiki/%D0%9F%D0%BE%D0%BB%D1%8C%D0%B7%D0%BE%D0%B2%D0%B0%D1%82%D0%B5%D0%BB%D1%8C%D1%81%D0%BA%D0%B8%D0%B9_%D0%B8%D0%BD%D1%82%D0%B5%D1%80%D1%84%D0%B5%D0%B9%D1%81> и взаимодействие с пользователем разделены на три отдельных компонента таким образом, чтобы модификация одного из компонентов оказывала минимальное воздействие на остальные. Данная схема проектирования часто используется для построения архитектурного каркаса <https://ru.wikipedia.org/wiki/%D0%9A%D0%B0%D1%80%D0%BA%D0%B0%D1%81_(%D0%BF%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5)>, когда переходят от теории к реализации в конкретной предметной области.

3. Разработка сайта

.1 Диаграмма прецендентов

Диаграмма прецедентов (англ. <https://ru.wikipedia.org/wiki/%D0%90%D0%BD%D0%B3%D0%BB%D0%B8%D0%B9%D1%81%D0%BA%D0%B8%D0%B9_%D1%8F%D0%B7%D1%8B%D0%BA> use case diagram, диаграмма вариантов использования) в UML <https://ru.wikipedia.org/wiki/UML> - диаграмма, отражающая отношения между актёрами <https://ru.wikipedia.org/wiki/%D0%90%D0%BA%D1%82%D1%91%D1%80_(UML)> и прецедентами <https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%B5%D1%86%D0%B5%D0%B4%D0%B5%D0%BD%D1%82_(UML)> и являющаяся составной частью модели прецедентов, позволяющей описать систему на концептуальном уровне

Прецедент - возможность моделируемой системы (часть её функциональности), благодаря которой пользователь может получить конкретный, измеримый и нужный ему результат. Прецедент соответствует отдельному сервису системы, определяет один из вариантов её использования и описывает типичный способ взаимодействия пользователя с системой. Варианты использования обычно применяются для спецификации внешних требований <https://ru.wikipedia.org/wiki/%D0%A2%D1%80%D0%B5%D0%B1%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D1%8F_%D0%BA_%D0%BF%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%BD%D0%BE%D0%BC%D1%83_%D0%BE%D0%B1%D0%B5%D1%81%D0%BF%D0%B5%D1%87%D0%B5%D0%BD%D0%B8%D1%8E> к системе.

Основное назначение диаграммы - описание функциональности и поведения, позволяющее заказчику <https://ru.wikipedia.org/wiki/%D0%97%D0%B0%D0%BA%D0%B0%D0%B7%D1%87%D0%B8%D0%BA>, конечному пользователю <https://ru.wikipedia.org/wiki/%D0%9A%D0%BE%D0%BD%D0%B5%D1%87%D0%BD%D1%8B%D0%B9_%D0%BF%D0%BE%D0%BB%D1%8C%D0%B7%D0%BE%D0%B2%D0%B0%D1%82%D0%B5%D0%BB%D1%8C> и разработчику <https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%B8%D1%81%D1%82> совместно обсуждать проектируемую или существующую систему <https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D0%B3%D1%80%D0%B0%D0%BC%D0%BC%D0%B0_(%D0%BA%D0%BE%D0%BC%D0%BF%D1%8C%D1%8E%D1%82%D0%B5%D1%80)>.

При моделировании системы с помощью диаграммы прецедентов системный аналитик <https://ru.wikipedia.org/wiki/%D0%A1%D0%B8%D1%81%D1%82%D0%B5%D0%BC%D0%BD%D1%8B%D0%B9_%D0%B0%D0%BD%D0%B0%D0%BB%D0%B8%D1%82%D0%B8%D0%BA> стремится:

чётко отделить систему от её окружения;

определить действующих лиц (актёров), их взаимодействие с системой и ожидаемый функционал системы;

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

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

Рисунок 16 - Диаграмма прецендентов

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

.2 ER-диаграмма

Модель сущность-связь (ER-модель) (англ. <https://ru.wikipedia.org/wiki/%D0%90%D0%BD%D0%B3%D0%BB%D0%B8%D0%B9%D1%81%D0%BA%D0%B8%D0%B9_%D1%8F%D0%B7%D1%8B%D0%BA> entity-relationship model, ERM) - модель данных <https://ru.wikipedia.org/wiki/%D0%9C%D0%BE%D0%B4%D0%B5%D0%BB%D1%8C_%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D1%85>, позволяющая описывать концептуальные схемы <https://ru.wikipedia.org/wiki/%D0%9A%D0%BE%D0%BD%D1%86%D0%B5%D0%BF%D1%82%D1%83%D0%B0%D0%BB%D1%8C%D0%BD%D0%B0%D1%8F_%D1%81%D1%85%D0%B5%D0%BC%D0%B0> предметной области <https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%B5%D0%B4%D0%BC%D0%B5%D1%82%D0%BD%D0%B0%D1%8F_%D0%BE%D0%B1%D0%BB%D0%B0%D1%81%D1%82%D1%8C>.модель используется при высокоуровневом (концептуальном) проектировании баз данных <https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5_%D0%B1%D0%B0%D0%B7_%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D1%85>. С её помощью можно выделить ключевые сущности и обозначить связи, которые могут устанавливаться между этими сущностями.

Во время проектирования баз данных <https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5_%D0%B1%D0%B0%D0%B7_%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D1%85> происходит преобразование ER-модели в конкретную схему базы данных <https://ru.wikipedia.org/wiki/%D0%A1%D1%85%D0%B5%D0%BC%D0%B0_%D0%B1%D0%B0%D0%B7%D1%8B_%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D1%85> на основе выбранной модели данных (реляционной <https://ru.wikipedia.org/wiki/%D0%A0%D0%B5%D0%BB%D1%8F%D1%86%D0%B8%D0%BE%D0%BD%D0%BD%D0%B0%D1%8F_%D0%BC%D0%BE%D0%B4%D0%B5%D0%BB%D1%8C_%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D1%85>,объектной <https://ru.wikipedia.org/w/index.php?title=%D0%9E%D0%B1%D1%8A%D0%B5%D0%BA%D1%82%D0%BD%D0%B0%D1%8F_%D0%BC%D0%BE%D0%B4%D0%B5%D0%BB%D1%8C_%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D1%85&action=edit&redlink=1>, сетевой <https://ru.wikipedia.org/wiki/%D0%A1%D0%B5%D1%82%D0%B5%D0%B2%D0%B0%D1%8F_%D0%BC%D0%BE%D0%B4%D0%B5%D0%BB%D1%8C_%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D1%85> или др.).модель представляет собой формальную конструкцию, которая сама по себе не предписывает никаких графических средств её визуализации. В качестве стандартной графической нотации, с помощью которой можно визуализировать ER-модель, была предложена диаграмма сущность-связь (ER-диаграмма).

Рисунок 17 - ER диаграмма

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

.3 Руководство пользователя

интернет магазин сайт

Главная

Главная страница админ панели является в основе своей информативной. Здесь вы можете просмотреть динамически изменяющиеся показатели работы вашего интернет магазина, последние новости от SellBe, а также статистику посещений интернет магазина (по умолчанию, статистика посещений считается hit.ua, существует возможность подключить Google Analitics).

На графике посещаемости изображены следующие характеристики:

"Хосты" - число уникальных адресов (IP), с которых были обращения;

"Пользователи" - число уникальных идентификаторов компьютеров, с которых были обращения;

"Хиты" - общее кол-во обращений.

Товары

Раздел "Товары" позволяет непосредственно управлять номенклатурой интернет магазина.

Список товаров

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

Если отметить флаг напротив товара, то можно выполнить групповые действия над отмеченными позициями:

Категоризировать - указать категорию с каталога SellBe, к которой относятся выбранные товары;

Переместить - указать категорию из дерева категорий магазина;

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

Архивировать/Разархивировать - изменить состояние товаров;

Удалить - безвозвратно удалить товары.

Добавление/Редактирование товара

Для добавления товара нажмите на кнопку добавить, которая отображается на странице со списком товаров.

Для редактирования товара наведите на товар в списке и нажмите на кнопку "Редактировать" или на название товара или дважды кликните по подсветившейся строке.