Сайт-портфолио создан для демонстрации разработанных проектов + ведение блога. Для добавления, редактирования и удаления записей разработана панель администратора. попасть в нее могут только зарегистрированные пользователи.
Разработать сайт средствами PHP. Основные разделы:
- Портфолио (описание разработанных проектов);
- Блог (полезная информация, структурированная по категориям);
- Информационные страницы (статические страницы с текстом);
- Главная страница с информацией о владельце блога;
- Админ-панель для управления сайтом.
Для реализации поставленной задачи использовался стек технологий:
- PHP 5.6 для написания основной логики сайта;
- HTML5 для формирования шаблонов;
- CSS3 и Less для стилизации элементов сайта;
- JavaScript ES6 для обработки событий в админке на клиенте, jQuery для обработки событий на фронтенде;
- Ajax для смены статуса записи в админке без перезагрузки страницы;
- Плагин Syntax Highlighter для реализации подсветки синтаксиса;
- Плагин CKEditor 4 для реализации визуального редактора в админке.
Для работы сайта была создана база данных MySQL со следующими таблицами:
| № | Название | Описание |
|---|---|---|
| 1 | blog_category | Список категорий блога. Содержит данные: id, ссылку, название, описание, title, description. |
| 2 | blog_posts | Список записей блога. Содержит данные: id, название, текст, анонс, дату, id категории, ссылку на картинку, ссылку на пост, статус, title, description. |
| 3 | content | Список страниц. Содержит данные: id, id ссылки, текст страницы, дату, title, description. |
| 4 | links | Список ссылок. Содержит данные: id, ссылку, название и id модуля. |
| 5 | modules | Список модулей сайта. Содержит данные: id, название, название на русском. |
| 6 | options | Список опций сайта. Переменные, которые используются в шаблонах сайта. Содержит данные: id, ключ, значение. |
| 7 | portfolio | Список работ в портфолио. Содержит данные: id, название, ссылку, ссылку на картинку, анонс, title, description, текст, дату, ссылку на github, список id технологий, статус, завершен ли проект. |
| 8 | submenu | Список ссылок на подменю. Содержит данные: id, ссылку, название. |
| 9 | technologies | Список технологий. Содержит данные: id, название. |
| 10 | top_menu | Верхнее меню. Содержит данные: id, ссылку, текст, заголовок блока. |
| 11 | users | Список пользователей. Содержит данные: id, логин, пароль, электронную почту, статус. |
Структура сайта:
- backend (админка сайта);
- core (ядро сайта);
- css (стили фронтенда);
- img (изображения);
- js (скрипты фронтенда);
- modules (модули сайта);
- templates (шаблоны фронтенда);
- user-files (пользовательские файлы).
В корне сайта лежит файл index.php. Он подключает файл из ядра - common.php. В файле common.php определяются модули сайта, подключается файл с настройками подключения к базе данных. Правила формирования URL-ов прописаны в файле .htaccess, который лежит в корне сайта.
Для работы сайта определено 5 видов модулей:
404.php- отвечает за страницу 404 ошибки;blog.php- отвечает за вывод категорий и записей блога;main.php- отвечает за вывод содержимого главной страницы;page.php- отвечает за статические страницы;portfolio.php- отвечает за вывод записей портфолио.
В каждом модуле подключаются шаблоны из папки template.
Пример страницы блога:
Пример блока портфолио на главной странице сайта:
На главной странице добавлен слайдер сертификатов и дипломов:
Чтобы попасть в админку, надо авторизоваться.
После авторизации пользователь попадает в панель управления.
Пример раздела редактирования страниц:
Раздел с записями блога:
Раздел добавления технологий в портфолио:
В админке можно создавать папки для загрузки изображений и файлов pdf и загружать файлы.