File - Fotokarp "Autoaed"

Ida-Virumaa Kutsehariduskeskus
IT-õppe valdkond
Eriala: Tarkvara ja andmebaaside haldus
Deniss Jegorov
Kodulehekülg „Fotokarp Autoaed“
Lõputöö
Juhatajad:
Olga Popova
Jelena Olikainen
Jõhvi 2014
1
СОДЕРЖАНИЕ
Введение ....................................................................................................................... 4
О проекте ....................................................................................................................................4
1.
Постановка задачи ............................................................................................... 5
2.
Программное обеспечение ................................................................................. 6
3.
2.1.
XAMPP .............................................................................................................................6
2.2.
ADOBE DREAMWEAVER CS5.5 .................................................................................6
2.3.
ADOBE PHOTOSHOP CS5.5 .........................................................................................6
2.4.
GOOGLE CHROME ........................................................................................................6
2.5.
WEEBLY.COM ................................................................................................................6
Описание проекта ................................................................................................. 7
3.1.
Оформление .....................................................................................................................7
3.2.
Структура и данные таблиц ...........................................................................................8
3.2.1.
Marki .........................................................................................................................8
3.2.2.
Gall ............................................................................................................................8
3.2.3.
Comm ........................................................................................................................9
3.3.
Веб-сайт проекта .............................................................................................................9
3.3.1.
Навигация .................................................................................................................9
3.3.2.
Главная .....................................................................................................................9
3.3.3.
Галерея ....................................................................................................................11
3.3.4.
Контакты ................................................................................................................12
3.3.5.
Написать комментарий .........................................................................................13
3.3.6.
Прочитать комментарии .......................................................................................13
3.3.7.
Администратор ......................................................................................................14
3.3.8.
Добавить .................................................................................................................15
3.3.9.
Изменить/Удалить .................................................................................................16
2
Выводы ....................................................................................................................... 18
Литература .................................................................................................................. 19
Приложения ................................................................................................................ 20
Приложение 1. Список иллюстраций ....................................................................................20
3
ВВЕДЕНИЕ
Разработка проекта «Fotokarp Autoaed» проект, выполненный на PHP с использованием
базы данных MySQL, HTML и CSS-стилей.
О проекте
Название проекта: "Erialade õppeainete kaardistamise andmebaas"
Автор проекта: Deniss Jegorov
Учебное заведение: Ida-Virumaa Kutsehariduskeskus
Специальность: Tarkvara ja andmebaaside haldus
Предметы: Andmebaaside kasutamine, andmebaaside haldus, dokumenteerimine
Преподаватели: Olga Popova, Jelena Olikainen
4
1. ПОСТ АНОВКА З АД АЧИ
Тема проекта «Fotokarp Autoaed» - создать веб сайт «Моя галерея». Информация хранится
в базе данных. Изображения представлены по категориям.Ключевым наполнением сайта
являются изображения.
В проект входят три таблицы :
1. Marki – таблица, содержащая название марки и её логотип
2. gall – содержит автомобили(их фото и название модели автомобиля)
3. comm – содержит данные об комментариях: номер комментария, имя/никнейм
написавшего, его э-почта и сам текс комментария.
Структура сайта:

Список марок

Каждый автомобиль относится к определенной марке
Администратор сайта имеет возможность добавлять марки (название, эмблема),
изменить или удалить автомобиль (модель, марка, фото)
5
2. ПРОГР АМ МНОЕ ОБЕСПЕЧЕНИЕ
2.1. XAMPP
Кроссплатформенная сборка веб-сервера, содержащая Apache, MySQL, интерпретатор
скриптов PHP, язык программирования Perl и большое количество дополнительных
библиотек, позволяющих запустить полноценный веб-сервер.
2.2. ADOBE DREAMWEAVER CS5.5
Конструктор интернет сайта. Позволяет создавать объекты и страницы с использованием
языка HTML, поддерживает каскадные таблицы стилей, а также слои и действия
JavaScript.
2.3. ADOBE PHOTOSHOP CS5.5
Многофункциональный графический редактор. В основном работает с растровыми
изображениями, однако имеет некоторые векторные инструменты. Продукт является
лидером рынка в области коммерческих средств редактирования растровых изображений,
и наиболее известным продуктом фирмы Adobe.
2.4. GOOGLE CHROME
Для тестирования и отладки скрипта использовался браузер Google Chrome с его
встроенным css / javascript отладчиком.
2.5. WEEBLY.COM
Сервис по визуальному (WYSIWYG) созданию сайтов и последующему их размещению
на серверах компании.
6
3. ОПИСАНИЕ ПРОЕКТА
3.1. Оформление
Рис. 1 Главная страница сайта
В шапке сайта логотип сайта, ниже расположено меню навигации по сайту. Весь контент
располагается ниже меню.
База данных:
База данных состоит из трех таблиц:

Marki

gall

comm
7
3.2. Структура и данные таблиц
3.2.1.
Marki
Рис. 2 Таблица marki
Таблица состоит из трех полей:

Id_mark - номер марки

m_name - название марки

znak - логотип марки
3.2.2.
Gall
Таблица содержит четыре поля:
Рис. 3 Таблица gall

Id_zap - номер записи
8

id_mark - Номер марки (связано с Id_mark из таблицы "marki")

foto - Фотография автомобиля

f_text - Подпись к картинке(модель автомобиля)
3.2.3.
Comm
Рис. 4 Таблица comm
В таблице содержится пять полей

Id_com - номер комментария

com_name - Имя комментирующего

com_mail - почтовый адресс комментирующего

com_text - Текст комментария

com_date - дата написания комментария
3.3. Веб-сайт проекта
3.3.1.
Навигация
Рис. 5 Главное меню
Навигация по сайту происходит с помощью главного меню.
3.3.2.
Главная
9
Рис. 6 Главная
На главной странице написано немного основной информации о появлении первых
автомобилей.
10
3.3.3.
Галерея
Рис. 7 Галерея - выбор марки
На данной странице нас встречает список марок представленных на сайте, перейти к
галереи можно кликнув на эмблему нужной марки.
После выбора марки появляются автомобили выбранной марки, здесь подключен скрипт,
скрипт находится в свободном доступе.
11
3.3.4.
Контакты
На странице контакты можно увидеть контактные данные с разработчиком и карту, на
которой изображено место, где разрабатывается сайт.
Рис. 8 Контакты
Чуть ниже карты можно выбрать написать или прочитать комментарии
12
3.3.5.
Написать комментарий
Рис. 9 Написать комментарий
Заполнив данную форму, вы оставите комментарий.
3.3.6.
Прочитать комментарии
Тут выводятся уже написанные комментарии, начиная с новых.
Рис. 10 Прочитать комментарии
13
3.3.7.
Администратор
Здесь представлена форма входа для администратора.
Рис. 11 Форма входа
После входа, в верхнем меню, появляются две новые страницы: Добавить и
Изменить/Удалить.
Рис. 12 Изменившееся меню
14
3.3.8.
Добавить
Рис. 13 Добавить
На странице "добавить" мы можем добавить как новую марку так и фотографии в уже
существующей, заполнив простую форму.
15
3.3.9.
Изменить/Удалить
Рис. 14 Изменение/Удаление автомобилей
На странице "Изменить/Удалить" мы видим перечень марок и кнопку "Изменить" и
"Удалить" под каждой маркой.
При нажатии на
"Изменить" появится
форма, позволяющая
изменить марку, модель
автомобиля или его
фото.
Рис. 15 Форма изменения
16
При удалении требуется подтвердить намерение удалить данный автомобиль .
Рис. 16 Удаление автомобиля
17
ВЫВОДЫ
Для реализации поставленных задач был создан сайт «Car online». Данный сайт четко
отражает структуру и все элементы базы данных.
Управление сайтом осуществляется через аккаунт администратора, войти в который
можно через
специальную
форму входа,
введя
правильный логин и пароль.
Администратор сайта может добавлять на сайт и в базу данных новые марки и
автомобили
Проект «Car online» можно развивать и дальше, совершенствовать, вводя новые опции для
решения задач.
18
ЛИТЕР АТУРА

http://ru.wikipedia.org/wiki/%D0%98%D1%81%D1%82%D0%BE%D1%80%D0%B8%
D1%8F_%D0%B0%D0%B2%D1%82%D0%BE%D0%BC%D0%BE%D0%B1%D0%B
8%D0%BB%D1%8F

http://all-free-download.com/free-website-templates/css-website-template.html

https://www.google.ru/?gws_rd=ssl

http://www.php.su/
19
ПРИЛОЖЕНИЯ
Приложение 1. Список иллюстраций
Рис. 1 Главная страница сайта......................................................................................................7
Рис. 2 Таблица marki .....................................................................................................................8
Рис. 3 Таблица gall .........................................................................................................................8
Рис. 4 Таблица comm .....................................................................................................................9
Рис. 5 Главное меню ......................................................................................................................9
Рис. 6 Главная ..............................................................................................................................10
Рис. 7 Галерея - выбор марки .....................................................................................................11
Рис. 8 Контакты ...........................................................................................................................12
Рис. 9 Написать комментарий ....................................................................................................13
Рис. 10 Прочитать комментарии ................................................................................................13
Рис. 11 Форма входа ....................................................................................................................14
Рис. 12 Изменившееся меню ......................................................................................................14
Рис. 13 Добавить ..........................................................................................................................15
Рис. 14 Изменение/Удаление автомобилей ...............................................................................16
Рис. 15 Форма изменения ...........................................................................................................16
Рис. 16 Удаление автомобиля.....................................................................................................17
20