Добавлен: 18.05.2023
Просмотров: 416
Скачиваний: 4
СОДЕРЖАНИЕ
1. Техническое задание и выбор средств реализации.=
2. Описание модулей серверной части программы и их взаимодействие.
2.1. Описание пользовательской части
2.1.1. Структура пользовательской части промо-сайта
2.1.2. Основные программные модули
2.2. Описание административной части
2.2.1. Структура административной части промо-сайта
2.1.2. Основные программные модули
3. Описание структуры базы данных и ее функций
3.1. Описание структуры базы данных
3.2. Пользовательские функции и запросы к базе данных
4. Описание структуры клиентской части
4.1. Описание интерфейса «Обычный пользователь»
4.2 Описание интерфейса «Администратор»
4.3.1. Инструкция простого пользователя
Виды каскадных таблиц стилей и их специфика
Внешняя таблица стилей – это текстовый файл с расширением .css, который содержит в себе набор CSS-стилей элементов. Файл создается в текстовом редакторе кода подобно HTML-странице. Внутри файла содержатся только стили, исключая HTML-разметку. Внешняя таблица стилей присоединяется к веб-странице при помощи тега <link>, который расположен внутри раздела <head></head>.
К одной веб-странице можно присоединить несколько внешних таблиц стилей, добавляя несколько тегов <link>, указав параметром тега media назначение данной таблицы стилей. Параметр rel="stylesheet" указывает тип ссылки (это ссылка на таблицу стилей).
<head>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/assets.css" media="all">
</head>
Атрибут type="text/css" не является обязательным согласно стандарту HTML5, следовательно, его можно не указывать. Если этот атрибут не указан, то по умолчанию используется значение type="text/css".
<head>
<style>
h1,
h2 {
color: red;
font-family: "Times New Roman", Georgia, Serif;
line-height: 1.3em;
}
</style>
</head>
<body>
...
</body>
Внутренние стили можно встраивать в раздел <head></head> HTML-страницы и определить внутри тега <style></style>. Внутренние стили имеют приоритет над внешними таблицами, но уступают встроенным (которые заданы через атрибут style).
Встроенные стили
Когда используются встроенные стили, CSS-код пишется прямо в HTML-файл, непосредственно внутри тега элемента с помощью атрибута style:
Такие стили действуют непосредственно на тот элемент, внутри которого они заданы.
<p style="font-weight: bold; color: red;">Обратите внимание на этот текст.</p>
PHP
Проект выполняется с помощью языка программирования PHP (англ. PHP: Hypertext Preprocessor — «PHP: препроцессор гипертекста»; изначально Personal Home Page Tools — «Инструменты для создания персональных интернет-страниц»; произносится «пи-эйч-пи») - язык программирования общего назначения, в главным образом применяемый для разработки веб-приложений. Сегодня поддерживается подавляющим большинством провайдеров и является одним лидером среди языков программирования, которые применяющихся для разработки динамических веб-сайтов.
«Применение языка, подобного PHP и такой базы данных, как MySQL, позволяет делать сайты динамическими: они могут настраиваться и содержать информацию, изменяющуюся в реальном времени». [11, с. 27]
PHP специально создан для веб-разработок, и его код может внедряться непосредственно в HTML.
Простой ответ, но что же он может означать? Вот пример PHP кода:
<!DOCTYPE HTML>
<html>
<head>
<title>Пример</title>
</head>
<body>
<?php echo "Привет, я - скрипт PHP!"; ?>
</body>
</html>
PHP отличается от языка JavaScript тем, что его скрипты выполняются на сервере и генерируют код HTML, посылаемый клиенту. Если на сервере размещен вышеприведенный скрипт, клиент получает только результат его выполнения, но не может выяснить, какой именно код его создал.
PHP весьма прост для изучения, но, вместе с тем, способен удовлетворить запросы даже профессиональных программистов. Пусть Вас не пугает длинный список возможностей PHP. Вы можете быстро начать его изучать, и уже в течение первых часов сможете создавать простые PHP-программы.
Хотя PHP, главным образом, предназначается для работы в среде интернет-серверов, область его применения не ограничивается только этим.
MYSQL
MySQL - это популярный сервер баз данных, который используется в различных приложениях. Аббревиатура SQL означает «язык структурированных запросов» - (S)tructured (Q)uery (L)anguage, который MySQL использует для взаимодействия с другими программами. Более того, MySQL имеет свои собственные встроенные функции для того, чтобы обеспечить разработчикам дополнительный функционал.
MySQL включает в себя базы данных, таблицы, записи, и поля. Таблицы объединяются в базы данных, записи – в таблицы, сами же записи состоят из полей, которые содержат актуальную информацию. Подобная структура позволяет разработчикам выбирать, каким образом они хотят обращаться к информации в базе данных.
Особую помощь проекту оказала CSS–библиотека BOOTSTRAP, которая отвечает за адаптивный дизайн сайта.
Bootstrap (или же Twitter Bootstrap) – библиотека вмещающая в себе набор стилей, классов и скриптов для создания сайтов. В библиотеке можно найти массу шаблонов, использование которых не составит особого труда.
Bootstrap (также известен как Twitter Bootstrap) — свободный набор инструментов для создания сайтов и веб-приложений. Включает в себя HTML- и CSS-шаблоны оформления для типографики, веб-форм, кнопок, меток, блоков навигации и прочих компонентов веб-интерфейса, включая JavaScript-расширения.
«Адаптивная вёрстка сайта позволяет веб-страницам автоматически подстраиваться под экраны планшетов и смартфонов. Мобильный интернет-трафик растёт с каждым годом и чтобы эффективно обрабатывать этот трафик, нужно предлагать пользователям адаптивные сайты с удобным интерфейсом». [2]
2. Описание модулей серверной части программы и их взаимодействие.
2.1. Описание пользовательской части
2.1.1. Структура пользовательской части промо-сайта
Промо-сайт торговой компании «Галактика» содержит следующие разделы:
- Главная;
- О компании;
- Каталог;
- Форма обратной связи;
- Контакты;
- Новости;
- Авторизация;
- Админпанель (доступно только авторизованному администратору);
Организационная структура промо-сайта представлена на Диаграмма 1.
Диаграмма 1 – Организационная диаграмма промо-сайта
2.1.2. Основные программные модули
Основные программные модули пользовательской части сайта и их описание представлены в Таблица 1.
Таблица 1 – Описание программных модулей пользовательской части.
|
Имя файла |
Описание |
|
index.php |
Основной вызываемый программный файл. В этом программном модуле производится загрузка всех необходимых функций и библиотек, скриптов и файлов стилей. Также из этого программного модуля вызываются все остальные модули посредством гиперссылок. |
|
include/cart.php |
Функции работы с корзиной |
|
include/catalog.php |
Функции работы с каталогом категорий и товаров |
|
include/contacts.php |
Контактные данные компании |
|
include/footer.php |
Футер сайта |
|
include/functions.php |
Пользовательские функции |
|
include/main.php |
Контент главной страницы |
|
include/menu.php |
Контент меню |
|
include/new.php |
Модуль отображения новости целиком |
|
include/news.php |
Модуль отображения списка новостей |
|
include/open_db.php |
Модуль октратия и инициализации базы данных |
|
include/order.php |
Функции работы с заказами |
|
include/product.php |
Модуль отображения товара целиком |
|
include/request.php |
Модуль обратной связи |
|
include/search.php |
Модуль обображения содержимого поиска |
|
include/user.php |
Функции работы с пользователями |
Далее будет представлена иерархическая структура пользовательской части промо-сайта с подключение вышеописанных модулей (см. Диаграмма 2).
Диаграмма 2 - Иерархическая структура вызова программных модулей пользовательской части промо-сайта
2.2. Описание административной части
2.2.1. Структура административной части промо-сайта
Административная часть промо-сайта торговой компании «Галактика» содержит следующие разделы:
- Главная
- Меню
- Категории
- Товары
- Новости
- Слайды
- Заказы
- Пользователи
- Изменить пароль
- Выйти!
Организационная структура административной части промо-сайта представлена на Диаграмма 3.
Диаграмма 3 – Организационная диаграмма административной части промо-сайта
2.1.2. Основные программные модули
Основные программные модули административной части сайта и их описание представлены в Таблица 2.
Таблица 2 – Описание программных модулей административной части
|
Имя файла |
Описание |
|
admin.php |
Основной вызываемый программный файл. В этом программном модуле производится загрузка всех необходимых функций и библиотек, скриптов и файлов стилей. Также из этого программного модуля вызываются все осталные модули посредством гиперссылок. |
|
include/register.php |
Функции работы с регистрацией |
|
include/passwordfunctions.php |
Функции работы с паролями |
|
include/login.php |
Функции работы с авторизацией |
|
include/adminfunctions.php |
Административные функции |
|
include/user.php |
Функции работы с пользователями |
|
admin/Category.php |
Модуль добавления, редактирования и удаления категорий |
|
admin/Menu.php |
Модуль добавления, редактирования и удаления меню |
|
admin/News.php |
Модуль добавления, редактирования и удаления новостей |
|
admin/Order.php |
Модуль просмотра и обработки заказов |
|
admin/Product.php |
Модуль добавления, редактирования и удаления товаров |
|
admin/Slide.php |
Модуль добавления, редактирования и удаления слайдов |
|
admin/User.php |
Модуль просмотра пользователей и изменения их ролей |
Далее будет представлена иерархическая структура административной части промо-сайта с подключением вышеописанных модулей (см. Диаграмма 4).
Диаграмма 4 - Иерархическая структура вызова программных модулей административной части промо-сайта
3. Описание структуры базы данных и ее функций
3.1. Описание структуры базы данных
В базе данных проекта насчитывается 11 таблиц. Их названия и описание полей вместе с описанием индексов и связей представлены в Таблица 3.
Таблица 3 – Таблицы базы данных
|
Таблица |
Поле |
Тип |
Описание |
Индекс |
Ключ |
Связи |
|---|---|---|---|---|---|---|
|
Cart «Корзина» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
user_id |
int(11) |
Код пользователя |
INDEX |
Foreign Key |
user -> id |
|
|
product_id |
int(11) |
Код товара |
INDEX |
product -> id |
||
|
kol |
int(5) |
Количество товара |
||||
|
Category «Категории» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
name |
varchar(191) |
Наименование |
||||
|
image |
varchar(191) |
Файл изображения |
||||
|
parent_id |
int(11) |
Код родителя |
INDEX |
Foreign Key |
category -> id |
|
|
Menu «Меню» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
name |
varchar(191) |
Наименование |
||||
|
image |
varchar(191) |
Файл изображения |
||||
|
url |
varchar(191) |
Ссылка |
||||
|
content |
text |
Содержимое |
||||
|
News «Новости» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
name |
varchar(191) |
Наименование |
||||
|
image |
varchar(191) |
Файл изображения |
||||
|
content |
text |
Содержимое |
||||
|
Order «Заказы» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
date |
timestamp |
Дата и время заказа |
||||
|
user_id |
int(11) |
Код пользователя |
INDEX |
Foreign Key |
user -> id |
|
|
fio |
varchar(191) |
ФИО |
||||
|
phone |
varchar(191) |
Телефон |
||||
|
|
varchar(191) |
|
||||
|
comment |
text |
Комментарий |
||||
|
orderstatus_id |
int(11) |
Код статуса заказа |
INDEX |
Foreign Key |
orderstatus -> id |
|
|
Ordуrstatus «Статусы заказов» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
name |
varchar(191) |
Наименование |
||||
|
Userstatus «Статусы пользователей» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
name |
varchar(191) |
Наименование |
||||
|
Order_product «Таблица связка заказов с товарами» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
product_id |
int(11) |
Код товара |
INDEX |
Foreign Key |
product -> id |
|
|
order_id |
int(11) |
Код заказа |
INDEX |
Foreign Key |
order -> id |
|
|
kol |
int(11) |
Количество |
||||
|
Product «Товары» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
name |
varchar(191) |
Наименование |
||||
|
image |
varchar(191) |
Имя файла изображения |
||||
|
description |
text |
Описание |
||||
|
price |
double |
Цена |
||||
|
category_id |
int(11) |
Код категории |
INDEX |
Foreign Key |
category -> id |
|
|
Slide «Слайды» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
image |
varchar(191) |
Имя файла изображения |
||||
|
header |
varchar(191) |
Заголовок |
||||
|
url |
varchar(191) |
Ссылка |
||||
|
User «Пользователи» |
id |
int(11) |
Идентификатор |
PRIMARY |
||
|
lastname |
varchar(191) |
Фамилия |
||||
|
firstname |
varchar(191) |
Имя |
||||
|
fname |
varchar(191) |
Отчество |
||||
|
phone |
varchar(191) |
Телефон |
||||
|
password |
varchar(191) |
Пароль |
||||
|
|
varchar(191) |
|
||||
|
userstatus_id |
int(11) |
Код статуса пользователя |
Foreign Key |
userstatus -> id |