ChSTU repository
ChSTU repository preserves and enables easy and open access to all types of digital content including text, images, moving images, mpegs and data sets
Learn More
Please use this identifier to cite or link to this item:
https://er.chdtu.edu.ua/handle/ChSTU/6184| Title: | Онлайн-ресурс спортивних новин |
| Authors: | Підгорний, Микола Володимирович Баштан, Роман Віталійович |
| Keywords: | ПРЕДМЕТНА ОБЛАСТЬ;ОНЛАЙН-РЕСУРС;ПРОЄКТУВАННЯ;БАЗА ДАНИХ;FIGMA;HTML. |
| Issue Date: | 12-Jun-2024 |
| Abstract: | У сучасному світі інформаційні технології зробили значний вплив на всі сфери життя людини, в тому числі і на спорт. Стрімкий темп сучасного суспільного життя супроводжується високим попитом на інформацію. Світ спорту не став винятком, можна навіть сказати, що він став однією з найактивніших і популярних сфер. У цьому контексті інтернет-ресурси, які поширюють спортивні новини, стали основним засобом отримання найсвіжішої інформації для мільйонів людей у всьому світі. Мета кваліфікаційної роботи бакалавра – створення онлайн-ресурсу спортивних новин. Об’єкт дослідження: перегляд спортивних новин. Предмет дослідження: онлайн-ресурс спортивних новин. |
| URI: | https://er.chdtu.edu.ua/handle/ChSTU/6184 |
| Appears in Collections: | 122 Комп’ютерні науки (Комп’ютерні науки та прикладне програмування) |
Files in This Item:
| File | Description | Size | Format | |
|---|---|---|---|---|
| Пояснювальна записка_Баштан Роман_КНС-2201_2023-2024.pdf Restricted Access | 3.93 MB | Adobe PDF | View/Open Request a copy |
Items in DSpace are protected by copyright, with all rights reserved, unless otherwise indicated.
Extracted text
МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ
ЧЕРКАСЬКИЙ ДЕРЖАВНИЙ ТЕХНОЛОГІЧНИЙ УНІВЕРСИТЕТ
Факультет інформаційних технологій і систем
Кафедра комп’ютерних наук та системного аналізу
Пояснювальна записка
до кваліфікаційної роботи
бакалавра
(освітньо-кваліфікаційний рівень)
на тему: «Онлайн – ресурс спортивних новин»
Виконав: студент 4 курсу, групи КНС-2201
спеціальності 122 «Комп’ютерні науки»
(шифр і назва спеціальності)
освітня програма «Комп’ютерні науки та
(назва освітньої програми)
прикладне програмування
Баштан Роман Віталійович
Керівник __________ Підгорний М.В.
(прізвище та ініціали)
Рецензент __________ Мельник В.П.
(прізвище та ініціали)
Черкаси 2024 року
Бланк завдання на кваліфікаційну роботу бакалавра студенту
Черкаський державний технологічний університет
Факультет Інформаційних технологій і систем
Кафедра Комп’ютерних наук та системного аналізу
Освітньо-кваліфікаційний рівень Бакалавр
Спеціальність 122 – Комп’ютерні науки
Освітня програма Комп’ютерні науки та прикладне програмування
ЗАТВЕРДЖУЮ
Завідувач кафедри КНСА
_______________ Юрій ТРИУС
«____» _____________ 2024 р.
ЗАВДАННЯ
на кваліфікаційну роботу бакалавра студенту
Баштану Роману Віталійовичу
(прізвище, ім’я, по батькові)
1. Тема роботи Онлайн – ресурс спортивних новин
Керівник роботи Підгорний М.В., к.т.н., доцент
(прізвище, ім’я, по батькові, науковий ступінь, вчене звання)
затверджені наказом університету від «24» лютого 2024 р. №43/04.
2. Строк подання студентом роботи до 12 червня 2024 року
3. Вихідні дані до роботи:
Практичні навики роботи з інформаційними ресурсами. Робота з базами даних.
Звіт з виробничої практики. Звіт з переддипломної практики.
4. Зміст пояснювальної записки (перелік питань, що їх належить розробити):
Вступ
4.1. Дослідження предметної області.
4.2. Проєктування та розробка онлайн – ресурсу спортивних новин «Sport.Live».
4.3. Програмна реалізація.
Висновки.
5. Перелік додатків (з точним зазначенням назв додатків):
5.1. Додаток А. Специфікація 482.ЧДТУ. 32283-01.
5.2. Додаток Б. Текст програми.
5.3. Додаток В. Інструкція користувача.
5.4. Презентація
6. Консультанти розділів роботи
Прізвище, ініціали та Підпис, дата
Розділ посада
завдання видав завдання прийняв
консультанта
7. Дата видачі завдання 11.01.2024
КАЛЕНДАРНИЙ ПЛАН
Строк виконання
№ з/п Назва етапів кваліфікаційної роботи бакалавра Примітка
етапів роботи
1 Видача завдання на кваліфікаційну роботу
11.01.2024 Виконано
бакалавра.
2 Аналіз літературних джерел, об’єкту та предмету
до 13.02.2024 Виконано
дослідження.
3 Написання теоретичного розділу кваліфікаційної
до 15.03.2024 Виконано
роботи бакалавра.
4 Написання аналітичного розділу кваліфікаційної
до 01.04.2024 Виконано
роботи бакалавра.
5 Написання практичних розділів й висновків до
до 01.05.2024 Виконано
кваліфікаційної роботи бакалавра.
6 Передзахист кваліфікаційної роботи бакалавра
01.06.2024 Виконано
на засіданні кафедри КНСА.
7 Подання роботи завідувачу кафедри КНСА. до 12.06.2024 Виконано
8 Захист кваліфікаційної роботи бакалавра. 12.06.2024 Виконано
Студент _____________________________ Баштан Р. В.
(підпис)
Керівник роботи ____________________________ Підгорний М. В.
(підпис)
РЕФЕРАТ
Кваліфікаційна робота бакалавра містить: 50 с., 44 рис., 5 таблиць, 10
використаних джерел, 4 додатки.
Актуальність теми. У сучасному світі інформаційні технології зробили
значний вплив на всі сфери життя людини, в тому числі і на спорт. Стрімкий темп
сучасного суспільного життя супроводжується високим попитом на інформацію. Світ
спорту не став винятком, можна навіть сказати, що він став однією з найактивніших
і популярних сфер. У цьому контексті інтернет-ресурси, які поширюють спортивні
новини, стали основним засобом отримання найсвіжішої інформації для мільйонів
людей у всьому світі.
Мета роботи і задачі дослідження. Мета кваліфікаційної роботи бакалавра –
створення онлайн-ресурсу спортивних новин.
Для досягнення поставленої мети були поставлені такі завдання:
дослідити предметну область;
виконати порівняльний аналіз існуючих онлайн-ресурсів про спортивні новини;
розробити базу даних;
обрати засоби для реалізації онлайн-ресурсу «Sport.Live»;
розробити онлайн-ресурс для перегляду спортивних новин «Sport.Live» та
виконати його тестування.
Об’єкт дослідження: перегляд спортивних новин.
Предмет дослідження: онлайн-ресурс спортивних новин.
Методи дослідження. Для вирішення поставлених завдань були застосовані
наступні методи дослідження: теоретичний (аналіз літератури з проблеми
дослідження); емпіричний – полягав у спостереженні та налаштуванні онлайн-
ресурсу спортивних новин; порівняльний – для здійснення порівнянь існуючих
аналогів для перегляду новин.
Перелік ключових слів: ПРЕДМЕТНА ОБЛАСТЬ, ОНЛАЙН-РЕСУРС,
ПРОЄКТУВАННЯ, БАЗА ДАНИХ, FIGMA, PHP, MYSQL, JS, CSS, HTML.
5
ABSTRACT
Master’s work contains. 50 pages, 44 figures, 5 table, 10 used sources, 4 appendices.
Actuality of theme. In the modern world, information technologies have had a
significant impact on all spheres of human life, including sports. The rapid pace of modern
social life is accompanied by a high demand for information. The world of sports has not
become an exception, it can even be said that it has become one of the most active and
popular spheres. In this context, internet resources that distribute sports news have become
the main means of obtaining the latest information for millions of people around the world.
Purpose and tasks of the research. The purpose of the bachelor's thesis is to create
an online resource about sports news.
To achieve the goal, the following tasks were set:
research the subject area;
perform a comparative analysis of existing online resources about sports news;
develop a database;
choose means for the implementation of the online resource "sport.live";
to develop an online resource for viewing sports news "sportl.ive" and perform its
testing.
The object of the study: watching sports news.
The subject of research: online resource about sports news.
Research methods. The following research methods were used to solve the tasks:
theoretical (analysis of the literature on the research problem); empirical - consisted in
observing and setting up an online resource about sports news; comparative - for making
comparisons of existing analogues for viewing news.
The list of keywords: SUBJECT FIELD, ONLINE RESOURCE, DESIGN,
DATABASE, FIGMA, PHP, MYSQL, JS, CSS, HTML.
6
ЗМІСТ
ПЕРЕЛІК УМОВНИХ ПОЗНАЧЕНЬ, СИМВОЛІВ, СКОРОЧЕНЬ І ТЕРМІНІВ ........ 8
ВСТУП .................................................................................................................................. 9
1 ДОСЛІДЖЕННЯ ПРЕДМЕТНОЇ ОБЛАСТІ .......................................................... 11
1.1 Аналіз сучасного стану онлайн – ресурсів спортивних новин ........................... 11
1.2 Огляд існуючих аналогів онлайн-ресурсів спортивних новин ........................ 12
1.2.1Аналіз онлайн-ресурсу «Спорт.UA». .............................................................. 12
1.2.2 Аналіз онлайн-ресурсу «Sport24.ua». ............................................................. 14
1.2.3. Аналіз онлайн-ресурсу «META.ua» .............................................................. 15
1.2.4. Аналіз онлайн-ресурсу «iSport.ua» ................................................................ 16
1.3 Аналіз порівнянь існуючих рішень розглянутих реалізацій та постановка
завдання .......................................................................................................................... 17
Висновки до розділу 1 ....................................................................................................... 18
2 ПРОЄКТУВАННЯ ТА РОЗРОБКА ОНЛАЙН - РЕСУРСУ СПОРТИВНИХ
НОВИН «SPORT.LIVE» ............................................................................................... 19
2.1 Опис програмного середовища для розробки онлайн-ресурсу ......................... 19
2.1.1 Опис мови розмітки гіпертексту HTML ........................................................ 19
2.1.2 Опис каскадних таблиць CSS. ......................................................................... 21
2.1.3 Опис мови програмування PHP. ..................................................................... 21
2.1.4 Опис серверної платформи Ampps ................................................................. 23
2.1.5 Опис веб-серверу Apache ................................................................................ 24
2.2 Розробка діаграми варіантів використання .......................................................... 27
2.3 Проєктування структури бази даних .................................................................... 29
Висновки до розділу 2................................................................................................... 30
7
3 ПРОГРАМНА РЕАЛІЗАЦІЯ ТА ТЕСТУВАННЯ ОНЛАЙН – РЕСУРСУ
СПОРТИВНИХ НОВИН .................................................................................................. 32
3.1 Постановка завдання .............................................................................................. 32
3.2 Підготовка до розробки онлайн-ресурсу .............................................................. 32
3.3 Розробка головної сторінки .................................................................................... 35
3.4 Розробка сторінки «Вхід» ....................................................................................... 37
3.5 Розробка сторінки «Реєстрація» ............................................................................ 39
3.6 Розробка сторінки «Контакти» .............................................................................. 42
3.7 Розробка сторінки категорії та пошуку ................................................................. 43
3.8 Розробка форми для коментарів ............................................................................ 44
3.9 Розробка адміністративної панелі ......................................................................... 47
3.10 Тестування онлайн-ресурсу «Sport.Live» ........................................................ 50
Висновки до розділу 3................................................................................................... 51
ВИСНОВКИ ....................................................................................................................... 52
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ ......................................................................... 53
ДОДАТОК А ..................................................................................................................... 54
ДОДАТОК Б ..................................................................................................................... 56
ДОДАТОК В ................................................................................................................... 121
ДОДАТОК Г ..................................................................................................................... 124
8
ПЕРЕЛІК УМОВНИХ ПОЗНАЧЕНЬ, СИМВОЛІВ, СКОРОЧЕНЬ І ТЕРМІНІВ
СУБД — система управління базами даних.
HTML — Hypertext Markup Language.
CSS — Cascading Style Sheets.
URL — Uniform Resource Locator.
FTP — File Transfer Protocol.
ПЗ — програмне забезпечення.
SQL — Structured Query Language
9
ВСТУП
У сучасному цифровому світі спорт є однією з найпопулярніших тем для
обговорень. Завдяки розвитку інтернет-технологій спортивні новини стали
надзвичайно доступними для широкої аудиторії. Онлайн-ресурси, присвячені спорту,
стали важливим джерелом інформації для фанатів, спортсменів та журналістів.
Створення власного онлайн-ресурсу спортивних новин відкриває безліч можливостей
для висвітлення найцікавіших подій, аналізу спортивних змагань та розвитку
спортивної спільноти.
Актуальність кваліфікаційної роботи бакалавра. Онлайн-ресурс спортивних
новин є надзвичайно важливою і актуальною. З розвитком інтернет-технологій
спортивні новини стали однією з найпопулярніших тем для обговорень. Люди
постійно шукають оновлення про свої улюблені команди, гравців та події. Створення
онлайн-ресурсу спортивних новин дозволить продемонструвати навички у розробці
веб-сайтів, SEO, аналітиці та контент-маркетингу. Такий проєкт також має великий
потенціал для монетизації через рекламу, спонсорські угоди та інші механізми. Крім
того, онлайн-ресурс може стати важливим ресурсом для спортивної спільноти,
надаючи корисні та актуальні новини, аналізи та іншу інформацію. Звісно, онлайн –
ресурси можуть мати й недоліки, наприклад, не достовірна інформація.
Мета кваліфікаційної роботи бакалавра – створити онлайн-ресурс спортивних
новин.
Для досягнення поставленої мети були поставлені такі завдання:
провести дослідження в галузі предметної області;
провести порівняльний огляд наявних онлайн-ресурсів, що присвячені
спортивним новинам;
розробити базу даних;
обрати засоби для реалізації онлайн-ресурсу «Sport.Live»;
розробити онлайн-ресурс для перегляду спортивних новин «Sport.Live» та
виконати його тестування.
10
Об’єкт і предмет дослідження.
Об’єктом дослідження є перегляд спортивних новин.
Предметом дослідження є онлайн-ресурс спортивних новин.
Для вирішення поставлених завдань були застосовані наступні методи
дослідження: теоретичний (аналіз літератури з проблеми дослідження); емпіричний –
полягав у спостереженні та налаштуванні онлайн-ресурсу про спортивні новини;
порівняльний – для здійснення порівнянь існуючих аналогів для перегляду новин.
Онлайн-ресурс спортивних новин розроблений на мові PHP. Створення та
робота з базою даних (БД) відбувалась із застосуванням MySQL. Написання коду
проводилось в програмному середовищі Visual Studio Code.
11
1 ДОСЛІДЖЕННЯ ПРЕДМЕТНОЇ ОБЛАСТІ
1.1 Аналіз сучасного стану онлайн – ресурсів спортивних новин
У сучасному світі зростає популярність сервісів спортивної інформації, а
користувачі стають все вимогливішими, виявляючи потребу в розширенні
функціоналу та підвищенні зручності використання. Онлайн-ресурси спортивних
новин стають ключовими для багатьох,
Розробка онлайн-ресурсу спортивних новин може стати стратегічним кроком
для підприємств, що управляють спортивними медіа. Це має декілька причин:
− Підвищення лояльності. Швидкий та зручний доступ до спортивних новин
збільшує відданість користувачів медіа-бренду.
− Збільшення швидкості окупності. Інтеграція нових технологій дозволяє
привернути більше аудиторії та оптимізувати процес отримання новин, що веде до
зростання прибутковості.
Принцип роботи онлайн-ресурсу спортивних новин може бути представлений
у трьох форматах, кожен з яких має свої особливості та переваги:
Агрегатор спортивних новин. Онлайн-ресурс, що агрегує новини з різних
джерел і надає їх користувачам в єдиному форматі. Це дозволяє швидко та зручно
отримувати інформацію з різних джерел.
Платформа для спортивних медіа. Онлайн-ресурс, який надає користувачам
доступ до ексклюзивного контенту, включаючи відеоматеріали, інтерв'ю та
аналітику.
Онлайн-ресурс спортивного медіа. Онлайн-ресурс, що присвячений
конкретному спортивному медіа-бренду, який надає доступ до власного контенту та
ексклюзивних пропозицій.
Етапи розробки онлайн-ресурсу спортивних новин включає:
1. Аналіз спортивного ринку новин. Щоб випередити конкурентів, потрібно
бути відомим про найактуальніші тенденції у світі спортивних новин.
12
2. Вибір моделі бізнесу. Після ретельного аналізу ринкової ситуації ми повинні
визначитися з оптимальною бізнес-моделлю. Важливо розглянути особливості
агрегаторів новин, платформ для спортивних медіа та онлайн-ресурс спортивного
медіа для вибору найбільш ефективного підходу.
3. Дослідження цільової аудиторії. Для успішного розвитку онлайн-ресурс
спортивних новин необхідно зрозуміти потреби цільової аудиторії.
4. Функціонал онлайн-ресурсу. Склад функцій ресурсу залежить від обраної
бізнес-моделі. Якщо обираємо агрегатор новин, ми маємо забезпечити зручний
інтерфейс для користувачів та адміністраторів.
5. Вибір технологій. Для успішної реалізації онлайн-ресурсу ми повинні обрати
найбільш оптимальні технології.
Створення онлайн-ресурсі про спортивні новини — це складний та
трудомісткий процес, але він може стати ключовим для успіху спортивних медіа-
брендів у сучасному цифровому середовищі.
1.2 Огляд існуючих аналогів онлайн-ресурсів спортивних новин
У кваліфікаційній роботі бакалавра проведено огляд існуючих онлайн-ресурсів
спортивних новин, таких як: «Спорт.UA», «Sport24.ua», «META.ua», «iSport.ua».
1.2.1 Аналіз онлайн-ресурсу «Спорт.UA». Першим розглянемо онлайн-
ресурс новин «Спорт.UA», є одним з провідних спортивних інформаційних порталів
в Україні та має вагому позицію на ринку спортивних новин. На рис. 1.1
представлено головну сторінку онлайн-ресурсу спортивних новин «Спорт.UA» та
вигляд сторінки «Всі новини спорту», що на рис. 1.2.
13
Рисунок 1.1 – Головна сторінка онлайн-ресурсу «Спорт.UA»
Рисунок 1.2 – Загальний вигляд сторінки «Всі новини спорту» онлайн-ресурсу
«Спорт.UA»
Недоліки онлайн-ресурсу «Спорт.UA»:
Іноді інформація може бути не такою актуальною, як на інших сайтах, через
затримки у публікації новин або оновлень.
Менше популярних видів спорту або команд, можливо, не знайти достатньо
інформації на сайті
Переваги онлайн-ресурсу «Спорт.UA»:
Спорт.UA пропонує новини і аналітику з різних видів спорту, задовольняючи
інтереси широкої аудиторії.
14
Сайт ставиться до роботи з достовірними джерелами, що дозволяє забезпечити
високу якість інформації для користувачів.
Інтуїтивно зрозумілий дизайн і легка навігація роблять сайт зручним у
використанні.
1.2.2 Аналіз онлайн-ресурсу «Sport24.ua». Другим в роботі проаналізовано
онлайн ресурс «Sport24.ua». Головна сторінка сервісу «Sport24.ua» представлена на
рис. 1.3.
Рисунок 1.3 – Головна сторінка спортивного ресурсу «Sport24.ua»
Це український спортивний онлайн-ресурс, який надає широку палітру
інформації про спортивні події в Україні та за кордоном.
Недоліки сервісу «Sport24.ua»:
Деякі користувачі скаржаться що сайт має багато реклами.
Деякі користувачі скаржаться, що не можна коментувати пости.
Деякі користувачі нарікають на неякісний сервіс підтримки клієнтів.
Переваги онлайн-ресурсу «Sport24.ua»:
Сайт охоплює різні види спорту, а також має розділи для фанів різних команд.
Sport24.ua відомий своєю швидкістю оновлення новин і результатів, що робить
його популярним серед фанатів спорту.
15
1.2.3. Аналіз онлайн-ресурсу «META.ua». Наступним в роботі проаналізовано
онлайн-ресурс «META.ua».Один з найбільших та найпопулярніших українських
інтернет-порталів, що надає широкий спектр інформаційного контенту для своїх
користувачів. Основна місія порталу - забезпечити доступ користувачам до
актуальних новин, цікавої інформації та розважального контенту у різних сферах
життя. Головна сторінка онлайн-ресурсу «META.ua» на рис. 1.4.
Рисунок 1.4 – Головна сторінка спортивного ресурсу «META.ua»
Недоліки сервісу «META.ua»:
Спортивні новини на META.ua можуть бути не такою повною або актуальною,
як на спеціалізованих спортивних ресурсах.
Сайт може бути менш орієнтованим на аналітичний контент, що може не
задовольняти вимоги користувачів, які шукають глибокі аналізи подій.
Переваги онлайн-ресурсу «META.ua»:
"META.ua" часто надає можливість читачам висловлювати свою думку під
матеріалами, що стимулює дискусії та обмін думками.
Інтерфейс сайту "META.ua" зручний та інтуїтивно зрозумілий, що полегшує
навігацію і пошук необхідної інформації.
16
1.2.4. Аналіз онлайн-ресурсу «iSport.ua». Також в кваліфікаційні роботі
бакалавра проаналізовано онлайн-ресурс «iSport.ua». Головна сторінка сайту
«iSport.ua» представлена на рис. 1.5.
Рисунок 1.5 – Головна сторінка спортивного ресурсу «iSport.ua»
Недоліки сервісу «iSport.ua»:
Деякі користувачі можуть вважати, що обмежений фокус сайту на спортивних
новинах зводить його цінність.
Якщо інформація або коментарі схильні до підтримки одного погляду або
команди, це може порушити об'єктивність.
Переваги онлайн-ресурсу «iSport.ua»:
Сайт фокусується виключно на спортивних новинах і аналітиці, що дозволяє
йому надавати більш детальну та глибоку інформацію. Зручний інтерфейс програми
з можливістю відстеження замовлення.
Сайт відомий своєю якісною аналітикою та експертними оглядами спортивних
подій.
17
1.3 Аналіз порівнянь існуючих рішень розглянутих реалізацій та
постановка завдання
Після аналізу існуючих рішень, в кваліфікаційній роботі бакалавра містяться
пропозиції щодо виправлення обмежень, що існують у вже наявних онлайн-ресурсах.
1. Навігація для полегшення по сайту пошуку необхідних матеріалів.
2. Потрібно уникнути рекламних анотацій.
3. Зробити нові та головні новини на головній сторінці сайту.
4. Більше категорій про спорт.
У таблиці 1.1 представлено порівняльний аналіз розглянутих онлайн-ресурсів
про спортивні новини, а саме: «Спорт.UA», «Sport24.ua», «META.ua», «iSport.ua».
Таблиця 1.1 – Таблиця порівнянь існуючих рішень розглянутих реалізацій
Назва ресурсів
Критерії
порівняння
«Спорт.UA» «Sport24.ua» «META.ua» «iSport.ua»
ресурсів
Дизайн
5 4 3 4
(0-5)
Швидкість
завантаження 4 3 4 4
(0-5)
Оновлення новин 4 4 3 4
Як показано в Таблиці 1.1, було вибрано наступні критерії для порівняння:
дизайн та швидкість завантаження, оновлення новин.
Підсумовуючи аналіз та оцінку наведених вище онлайн-ресурсів, важливо
відзначити, що кожен з них має такі особливості:
− Зрозумілий дизайн;
− Швидке завантаження онлайн-ресурсу;
− Часте оновлення новин.
Під час аналізу існуючих рішень у кваліфікаційній роботі бакалавра про
створення онлайн-ресурсу зі спортивними новинами важливо врахувати наступні
аспекти:
18
− онлайн-ресурс повинен мати зручний, зрозумілий та приємний дизайн;
− онлайн-ресурс про спортивні новини важливо забезпечити швидкість
завантаження, яка буде оцінена на рівні 4 з можливих 5 балів.
− онлайн-ресурс, повинен мати часте оновлення новин.
Постановка завдання
1) Дослідження бізнес-моделі, функціональних вимог і використаних технологій
для ресурсу спортивних новин
2) Дослідження та вибір найактуальніших технологій розробки онлайн-ресурсу
про спортивні новини.
3) Розробка онлайн-ресурсу про спортивні новини, що задовольняє таким
функціональним вимогам:
− процес ідентифікації та реєстрації користувачів;
− можливість перегляду новин згрупованих за категоріями;
− пошук новин;
− додавання коментарів до посту;
− додавати пости, редагувати коментарі, додавати та редагувати категорії,
керувати та редагувати інформацію про користувача (для адміністратора).
Висновки до розділу 1
У цьому розділі проведено аналіз області дослідження, а саме: онлайн-ресурс
спортивних новин; основні проблеми створення онлайн-ресурсу спортивних новин;
огляд аналогів онлайн-ресурсів про спортивні новини.
Виконано порівняльний аналіз існуючих онлайн-ресурсів спортивних новин:
«Спорт.UA», «Sport24.ua», «META.ua», «iSport.ua»
У цьому розділі наведено таблицю, що порівнює наявні рішення та розглянуті
варіанти втілення, а також сформульовано постановку завдання.
19
2 ПРОЄКТУВАННЯ ТА РОЗРОБКА ОНЛАЙН - РЕСУРСУ СПОРТИВНИХ
НОВИН «SPORT.LIVE»
2.1 Опис програмного середовища для розробки онлайн-ресурсу
Процес створення онлайн-ресурсу для спортивних новин розбито на дві основні
складові: розробка програмної бази та реалізація дизайну та оформлення. Для
розробки програмної частини було обрано мову програмування PHP, яка забезпечує
динамічний та інтерактивний контент. Для створення структури та стилю веб-
сторінок використовували HTML та CSS відповідно. Як середовище розробки було
обрано Visual Studio Code, який надає потужні інструменти для кодування та
налагодження. Для створення бази даних новин використовувалась MySQL, яка
забезпечує надійне та ефективне управління даними. Інтерфейс ресурсу був
створений за допомогою HTML, що забезпечує структуру сторінок, та CSS, що
відповідає за стиль та візуальну привабливість. Було використано адаптивний дизайн,
що дозволяє коректно відображати сайт на різних пристроях, включаючи мобільні
телефони та планшети.
2.1.1 Опис мови розмітки гіпертексту HTML. HTML, або "Мова розмітки
гіпертексту", — це код, що використовується для створення веб-сторінок і веб-
додатків, доступних в Інтернеті. HTML був розроблений на початку всесвітньої
павутини наприкінці 1980-х - початку 1990-х років. Ця мова дозволяє веб-
розробникам вказувати браузерам, як відображати елементи, такі як зображення,
текст, форми та інтеративні функції.
Веб-розробники часто використовують HTML разом із каскадними таблицями
стилів (CSS) та JavaScript для створення веб-сайтів та додатків, до яких користувачі
отримують доступ через браузери, такі як Chrome, Firefox, Safari та Edge. Стандарти
для HTML і CSS підтримуються консорціумом World Wide Web (W3C).
Тім Бернерс-Лі, працюючи в Європейській організації ядерних досліджень,
почав розробку HTML у 1980 році. До кінця десятиліття він створив мову, а також
браузер і серверне програмне забезпечення. W3C продовжував розробляти HTML як
міжнародний стандарт. У 1995 році була опублікована друга версія HTML, після якої
20
з’явилося кілька додаткових оновлень. HTML базується на правилах SGML
(стандартна узагальнена мова розмітки), тоді як XHTML базується на правилах XML,
більш суворої підмножини SGML.
Документи XHTML повинні бути коректними XML-документами, що дозволяє
їх обробку стандартними інструментами XML, на відміну від HTML, який потребує
складніших синтаксичних аналізаторів. XHTML можна розглядати як перетин HTML
і XML, оскільки це переформулювання HTML за допомогою XML. XHTML 1.0 став
рекомендацією W3C 26 січня 2000 року, а XHTML 1.1 – 31 травня 2001 року.
HTML інтерпретується браузером і відображається у вигляді документа,
зручного для читання людиною. HTML-документ є текстовим файлом, розміченим за
допомогою спеціальних команд, званих тегами. Вибір текстового формату для веб-
документів був обумовлений вимогами до простоти, універсальної інтерпретації в
будь-якій операційній системі, мінімального розміру файлу та зручності редагування.
HTML дозволяє визначати різні типи елементів, що забезпечують функціональність
документа, таких як текстові фрагменти, списки, таблиці, зображення та
гіперпосилання.Мови розмітки, як-от HTML та XML, читаються людьми і
відрізняються від машинних мов, які використовують шістнадцятковий чи двійковий
код. Створюючи сторінку за допомогою HTML, автор використовує ключові
компоненти або атрибути, які розпізнаються будь-яким браузером. Багато з цих
атрибутів поєднуються з «початковим тегом» і «кінцевим тегом». Наприклад, для
позначення абзацу використовуються теги <p> і </p>.
HTML 5 — це найсучасніший стандарт мови розмітки, який використовується
для більшості веб-сторінок в Інтернеті. HTML 5 підтримує мультимедіа (аудіо та
відео). Він є основою сучасних веб-сторінок, а стилі та функції додаються за
допомогою CSS, PHP і JavaScript. Тому перед вивченням цих мов варто опанувати
HTML. HTML — це базовий будівельний блок веб-розробки, і всі сучасні сервіси
створення веб-сайтів, такі як WordPress, Wix, Weebly, використовують HTML 5.
.
21
2.1.2 Опис каскадних таблиць CSS. CSS (Cascading Style Sheets, каскадні
таблиці стилів) - це мова, яка використовується для оформлення веб-сторінок, де
можна налаштувати вигляд та розташування елементів. Вона дає можливість
встановлювати параметри форматування, такі як кольори, шрифти, розміри, відступи,
рамки та інші стилістичні атрибути, що стосуються вмісту сторінки.Поділ
оформлення та змісту: CSS дозволяє відокремити стилі від HTML-коду, що полегшує
роботу розробників та сприяє більш чіткій організації коду. Це також дозволяє вести
роботу над оформленням та вмістом сторінки паралельно.
Основні переваги використання CSS включають:
Єдине оформлення документів: За допомогою CSS можна легко застосовувати
однакове оформлення до різних елементів сторінок, що створює єдність в дизайні та
полегшує сприйняття сайту користувачами.
Централізоване зберігання стилів: Стилі можуть бути збережені у окремих CSS-
файлах, що дозволяє зручно керувати оформленням всього сайту. Зміни в одному
файлі автоматично відображаються на всіх сторінках сайту, що зменшує час і зусилля
при редагуванні.
Розширені можливості оформлення: CSS надає широкі можливості для
стилізації веб-елементів, включаючи анімацію, трансформації, градієнти, тіні,
границі та інші ефекти, що дозволяють створювати більш креативний та привабливий
вигляд сторінок.
Швидка робота та кешування: CSS-файли можуть бути кешовані браузером, що
дозволяє зберігати їх локально на пристрої користувача. Це зменшує час
завантаження сторінок при повторних відвідуваннях і поліпшує загальний досвід
користувача.
2.1.3 Опис мови програмування PHP. PHP, або "Hypertext Preprocessor", є
скриптовою мовою програмування, спеціально створеною для генерації HTML-
сторінок на стороні веб-сервера. PHP є однією з найпоширеніших мов у сфері веб-
розробки, поруч з Java, .NET, Perl, Python і Ruby.
22
Переважна більшість хостинг-провайдерів підтримують PHP. Ця мова є
проєктом з відкритим вихідним кодом, що сприяє її широкому поширенню та
популярності.
PHP-код інтерпретується веб-сервером і перетворюється на HTML-код, який
потім передається на сторону клієнта. Це означає, що користувач не бачить вихідний
PHP-код, що підвищує безпеку, але зменшує інтерактивність сторінок порівняно з
мовами, які виконуються на стороні клієнта, такими як JavaScript.
PHP має вбудовані бібліотеки для роботи з різними системами управління
базами даних, такими як MySQL, PostgreSQL, Oracle, і багатьма іншими. Завдяки
стандарту відкритого інтерфейсу зв'язку з базами даних, PHP може підключатися до
будь-яких баз даних, для яких існує відповідний драйвер.
Однією з причин популярності PHP у створенні веб-сайтів є наявність великого
набору вбудованих інструментів для розробки веб-додатків. До основних
можливостей PHP належать:
– Автоматичне отримання POST і GET параметрів, а також змінних оточення веб-
сервера в зумовлені масиви.
– Взаємодія з багатьма системами управління базами даних, включаючи MySQL,
SQLite, PostgreSQL, Oracle, Microsoft SQL Server та інші.
– Автоматизована відправка HTTP-заголовків.
– Підтримка HTTP-авторизації.
– Робота з cookies і сесіями.
– Обробка локальних і віддалених файлів, сокетів.
– Обробка файлів, що завантажуються на сервер.
– Підтримка XForms.
PHP починає виконувати код після зустрічі першої екрануючої послідовності
(<?) і продовжує до зустрічі парної екрануючої послідовності (?>). Ця мова
здаватиметься знайомою програмістам, які мають досвід роботи з мовами C та Perl,
оскільки багато конструкцій PHP запозичено саме з цих мов. Код PHP дуже схожий
на той, який зустрічається у програмах, написаних на C або Pascal, що значно
полегшує його вивчення.
23
PHP поєднує переваги Perl і C, спеціально орієнтуючись на роботу в Інтернеті.
Мова має універсальний і зрозумілий синтаксис. Незважаючи на свою відносну
молодість, PHP швидко здобула популярність серед веб-розробників і стала однією з
найпопулярніших мов для створення веб-застосунків (скриптів).
Широкий набір функцій PHP дозволяє уникнути необхідності писати
багаторядкові користувацькі функції на C або Pascal. PHP – це мова з універсальним
і зрозумілим синтаксисом, спеціально спрямована на роботу в Інтернеті. Додатковою
перевагою є відкритий вихідний код та безкоштовність використання. PHP належить
до інтерпретованих мов, що дозволяє обробляти сценарії з високою швидкістю.
Одним із застосувань PHP є розробка парсерів – синтаксичних аналізаторів, які
виконують аналіз і обробку HTML-сторінок за заданим списком URL-посилань.
Програма переходить на зазначений сайт, завантажує HTML-сторінку, проводить її
розбір і обробляє дані відповідно до поставлених завдань.
Ефективність є ключовим фактором у програмуванні для середовищ,
розрахованих на багато користувачів, таких як веб. PHP є достатньо продуктивною
для створення серйозних веб-додатків. Хоча виконувані файли, отримані за
допомогою компіляції, працюють швидше, продуктивність PHP достатня для
багатьох завдань. За деякими оцінками, більшість PHP-сценаріїв обробляються
швидше, ніж аналогічні програми, написані на Perl.
2.1.4 Опис серверної платформи Ampps. Ampps представляє собою потужне
програмне середовище для веб-розробників, яке включає в себе не лише серверне
програмне забезпечення, але й інструменти для налагодження та тестування веб-
проєктів. Ця платформа є портативною, що означає, що вона може бути легко
встановлена та використана на різних комп'ютерах, не вимагаючи складних
налаштувань.
Основна перевага Ampps полягає у його розширеному наборі інструментів,
який включає в себе такі компоненти, як веб-сервер Apache та nginx, мова
програмування PHP, система управління базами даних MySQL та адміністративний
24
інтерфейс phpMyAdmin. Ці інструменти працюють разом для забезпечення стабільної
та ефективної роботи над веб-проєктами.
Окрім цього, Ampps має зручний та інтуїтивно зрозумілий інтерфейс, який
спрощує процес адміністрування та налаштування компонентів. Це дозволяє
розробникам швидко налаштовувати середовище для роботи над своїми проєктами та
ефективно вирішувати завдання веб-розробки.
Крім того, Ampps підтримує безліч розширень та модулів, які розширюють його
функціональність. Наприклад, він може підтримувати різні мови програмування, такі
як Perl, Python та Tcl, що робить його універсальним інструментом для розробки веб-
додатків на різних платформах та з використанням різних технологій.
2.1.5 Опис веб-серверу Apache. Веб-сервер Apache переважно
використовується для передачі статичних і динамічних веб-сторінок через Всесвітню
павутину за протоколом HTTP. Він може працювати як кешувальний проксі-сервер,
що значно підвищує продуктивність користувачів локальної мережі при доступі до
Інтернет-ресурсів. Проксі-сервер можна налаштувати з такими параметрами:
– типи файлу, який потрібно кешувати або навпаки, тип файлу, який не
знаходиться в кеші;
– максимальний обсяг дискового простору, виділеого для кеша;
– Регулярний перегляд та індексація бази даних кешу для видалення застарілих
об'єктів і звільнення дискового простору.
Ядро Apache включає основні функції, такі як обробка конфігураційних файлів,
підтримка протоколу HTTP та система завантаження модулів. Ядро, на відміну від
модулів, було повністю розроблено Apache Software Foundation без участі сторонніх
програмістів. Теоретично, ядро Apache може працювати самостійно, без
використання модулів, проте його функціональність буде дуже обмежена. Ядро
Apache повністю написано мовою програмування C.
Система конфігурації Apache базується на текстових конфігураційних файлах.
Веб-сервер має власну мову конфігураційних файлів, що базується на блоках
директив. Практично всі параметри ядра можуть бути змінені за допомогою
25
конфігураційних файлів. Більшість модулів також мають свої власні параметри
налаштування. Деякі модулі використовують конфігураційні файли операційної
системи під час роботи, наприклад, /etc/passwd та /etc/hosts. Крім того, параметри
можна задати за допомогою командного рядка.
Apache підтримує безліч моделей симетричного багатопроцесорного
оброблення:
− worker: Гібридна багатопроцесорна багатопотокова модель, яка дозволяє
обслуговувати велику кількість клієнтів з мінімальним використанням ресурсів,
зберігаючи стабільність багатопроцесорних рішень.
− prefork: Симетрична багатопроцесорна модель, заснована на попередньому
створенні окремих процесів.
− perchild: Гібридна модель з фіксованою кількістю процесів.
− netware: Багатопотокова модель, оптимізована для роботи в середовищі
NetWare.
− winnt: Багатопотокова модель, створена для операційної системи Microsoft
Windows.
− Apache-ITK: Симетрична багатопроцесорна модель, заснована на моделі
prefork, яка дозволяє запуск кожного віртуального хоста під окремими UID та GID.
− Peruser: Модель, заснована на MPM perchild, яка дозволяє запуск кожного
віртуального хоста під окремими UID та GID. Вона не використовує потоки.
Apache забезпечує високу гнучкість та масштабованість завдяки своїй
модульній архітектурі, що дозволяє легко розширювати його функціональність за
допомогою додаткових модулів, що робить його одним з найпопулярніших веб-
серверів у світі.
2.1.6 Опис бази даних MySQL. MySQL є безкоштовною системою управління
реляційними базами даних (РБД) та компактним багатопотоковим сервером баз
даних, відомим своєю високою швидкістю, надійністю та простотою використання.
У реляційній базі даних інформація зберігається в окремих таблицях, що забезпечує
виграш у швидкості та гнучкості. Таблиці пов'язані між собою через відносини, що
дозволяє об'єднувати дані з різних таблиць при виконанні запитів.
26
SQL, як складова частина MySQL, є мовою структурованих запитів, яка
використовується для доступу до баз даних. MySQL вважається оптимальним
рішенням для малих і середніх застосувань. Сервіс компілюється на багатьох
платформах, але найкраще його можливості розкриваються в UNIX-системах, де
підтримується багатопоточність, що підвищує загальну продуктивність системи.
Серед можливостей сервера MySQL варто відзначити:
− Простоту установки та використання.
− Підтримку необмеженої кількості користувачів, які можуть одночасно
працювати з базою даних.
− Можливість обробки таблиць, що містять до 50 мільйонів рядків.
− Високу швидкість виконання команд.
− Просту та ефективну систему безпеки.
MySQL є програмним забезпеченням з відкритим кодом, що дозволяє будь-
якому користувачу змінювати та адаптувати його відповідно до своїх потреб. Вона
складається з серверної та клієнтської частин. Сервер MySQL постійно працює на
комп'ютері, тоді як клієнтські програми (наприклад, скрипти PHP) надсилають
серверу MySQL SQL-запити через механізм сокетів, які обробляються сервером, а
результати повертаються клієнту.
Структура MySQL трирівнева: бази даних, таблиці, записи. Бази даних і таблиці
в MySQL фізично представлені файлами з розширеннями .frm, .MYD, .MYI. Логічно
таблиця являє собою сукупність записів, а запис – це сукупність полів різного типу.
Ім'я бази даних у MySQL унікальне в межах системи, таблиці мають унікальні імена
в межах бази даних, а поля – в межах таблиці. Один сервер MySQL може
підтримувати кілька баз даних, доступ до яких розмежовується за допомогою логіна
та пароля. З точки зору MySQL, база даних – це звичайний каталог, що містить файли
певного формату.
Основною функцією для з'єднання з сервером MySQL є mysql_connect(), яка
підключає скрипт до сервера баз даних MySQL та виконує авторизацію користувача
базою даних. Синтаксис цієї функції такий: mysql_connect ([string $hostname] [, string
$user] [, string $password]). Для закриття з'єднання використовується функція
27
mysql_close (int $connection_id). Хоча з'єднання можна не закривати, оскільки воно
автоматично закривається після завершення роботи PHP-скрипта, проте закриття
з'єднання вручну вважається гарною практикою. Якщо з'єднань декілька, вказується
ідентифікатор $connection_id того з'єднання, яке потрібно закрити. Функція
mysql_pconnect() використовується для постійних з'єднань, які не закриваються після
завершення роботи скрипта.
Усі запити до бази даних надсилаються функцією mysql_query(), якій потрібно
передати текст запиту. Запит повинен бути складений за правилами синтаксису SQL.
Якщо запит виконується успішно, клієнт отримує набір записів, який може бути
оброблений функціями PHP, такими як mysql_fetch_row(), mysql_fetch_array() тощо.
Функція mysql_fetch_row (int $res) повертає масив з даними обробленого рядка або
FALSE, якщо більше рядків немає. Вона повертає один ряд результату в масиві, де
кожна колонка розташована в наступній комірці масиву.
Функція mysql_fetch_array (int $res [, int $result_type]) повертає асоціативний
масив, заданий параметром $result_type, який може приймати такі значення:
− MYSQL_ASSOC: повертає асоціативний масив.
− MYSQL_NUM: повертає масив з числовими індексами, як у функції
mysql_fetch_row().
− MYSQL_BOTH: повертає масив з подвійними індексами, тобто масив можна
використовувати як асоціативний масив і як список (значення за замовчуванням для
$result_type).
Таким чином, MySQL забезпечує потужний та гнучкий інструмент для
управління реляційними базами даних з багатим набором функцій для роботи з
даними та їх обробки.
2.2 Розробка діаграми варіантів використання
Створення діаграми варіантів(Use Case Diagram) використання є ключовим
етапом при проєктуванні системи, оскільки вона ілюструє взаємодію між акторами та
28
прецедентами. Це простий спосіб показати функціональність системи та способи
взаємодії акторів з нею.
У кваліфікаційній роботі бакалавра була розроблена діаграма варіантів
використання на основі інформації про користувачів онлайн-ресурсу та їх можливі
взаємодії з системою. На цій діаграмі відображені два типи користувачів:
адміністратори позначені темно-синім кольором, а користувачі - жовтим.
Варіанти використання онлайн-ресурсу наступні:
− Реєстрація.
− Авторизація.
− Перегляд новин.
− Коментувати пости.
− Додавати, редагувати, видаляти пости.
− Додавати категорії.
− Фільтрувати, редагувати коментарі.
− Підтримка користувачів.
Use Case діаграма була створена на основі зібраної інформації про акторів та всі
можливі сценарії використання онлайн-ресурсу(рис. 2.2).
Рисунок 2.3 – Діаграма варіантів використання Use Case
29
2.3 Проєктування структури бази даних
Усі дані системи, включаючи дані про користувачів і дані ресурсу, будуть
зберігатися у базі даних. База даних включає такі таблиці: "Користувач", "Категорії",
"Пости" і "Коментарі".
Структура таблиці “Користувач” представлена наступним чином (таблиця 2.1):
Таблиця 2.1 — Структура таблиці «Користувач»
Ім'я поля Тип і розмір поля Опис поля
id int Первинний ключ
admin tinyint Статус адміністратора
username varchar Логін
email varchar Е-пошта
password varchar Пароль
created timestamp Час
Таблиця складається з таких полів як Ідентифікатор, Статус адміністратора,
Логін, Е-пошта, Пароль та Час створення користувача.
Таблиця «Категорії» містить зв’язок з таблицею «Пости» по ідентифікатору, так
як виражає детальні дані, користувача. (таблиця 2.2).
Таблиця 2.2 — Структура таблиці «Категорії»
Ім'я поля Тип і розмір поля Опис поля
id int Первинний ключ
name varchar Назва категорії
description text Опис
Таблиця “Пости” містить такі поля як Ідентифікатор, Номер користувача,
Заголовок, Фото, Контент, Статус, Номер у категорії, Час публікації. Дана таблиця
має зв’язок з таблицею «Категорії» по номеру категорії, так як виражає детальні дані,
що стосуються категорії (таблиця 2.3).
30
Таблиця 2.3 — Структура таблиці «Пости»
Ім'я поля Тип і розмір поля Опис поля
id int Первинний ключ
id_user int Номер користувача
title varchar Заголовок
img varchar Фото
content text Контент
status tinyint Статус
id_topic int Номер у категорії
created_date datetime Час
Таблиця «Коментарі» містить такі поля як Ідентифікатор, Статус, Номер
сторінки, Е-пошта, Коментар та Час публікації.
Таблиця 2.4 — Структура таблиці «Коментарі»
Ім'я поля Тип і розмір поля Опис поля
id int Первинний ключ
status tinyint Статус
page int Номер сторінки
email varchar Е-пошта
comment text Коментар
created_date datetime Час
Висновки до розділу 2
Після ретельного аналізу предметної області та вимог замовника було
вирішено розробляти онлайн-ресурс. Технології для серверної частини були обрані з
урахуванням їх зручності, актуальності та можливості використання на будь-якій
операційній системі. Ampps є зручною серверною платформою, яка дозволяє швидко
налаштувати доступ до веб-сервера. Сервер Apache надає можливість обслуговувати
31
різні сайти за допомогою веб-хостингу. Для доступу до бази даних використовувалася
мова програмування PHP.
Для стилізації онлайн-ресурсу було використано CSS. Використані технології в
сукупності дозволяють побудувати якісний та надійний продукт. Крім того, ці
технології захищені від патентних позовів, оскільки вони покриті ліцензіями, які
надають доступ до вихідних кодів проєктів.
32
3 ПРОГРАМНА РЕАЛІЗАЦІЯ ТА ТЕСТУВАННЯ ОНЛАЙН – РЕСУРСУ
СПОРТИВНИХ НОВИН
3.1 Постановка завдання
Для реалізації проєкту потрібно створити онлайн-ресурс, який дозволяє
переглядати новини за обраними категоріями, коментувати публікації, здійснювати
пошук публікацій, авторизуватися та реєструвати нових користувачів. Після
реєстрації користувач зможе залишати коментарі, які проходять перевірку
адміністратором перед публікацією. Адміністратор в адміністративній панелі матиме
можливість додавати, редагувати та видаляти пости, керувати користувачами
(зокрема скидати паролі, змінювати електронну пошту та логін), створювати та
редагувати категорії видів спорту, а також редагувати коментарі.
3.2 Підготовка до розробки онлайн-ресурсу
Для початку розробки попередньо було встановлено Visual Studio Code, Ampps.
Використання Ampps - це чисте задоволення, оскільки ця платформа містить
усе необхідне і дуже зручна у використанні.
Рисунок 3.1 – Панель керування Ampps
33
Для початку нам потрібен локальний сервер, на якому ми розмістимо наш
онлайн-ресурс. У Ampps – це питання однієї хвилини, потрібно тільки запустити
платформу. Для подальшої роботи потрібно створити нову директорію на сервері, де
буде розміщено проєкт. Для цього у папці "www", що знаходиться в потрібній
директорії, створюємо нову директорію для проєкту.
Рисунок 3.2 – Компоненти онлайн-ресурсу
Далі необхідно створити базу даних для нашого проєкту. Для цього в Ampps
доступний веб-інтерфейс для адміністрування баз даних - phpMyAdmin.
Рисунок 3.2 – Інтерфейс phpMyAdmin
34
Відкриваємо панель керування та переходимо до веб-інтерфейсу phpMyAdmin.
Тут ми створюємо нову базу даних і називаємо її "dynamic-site". Під час створення
обираємо кодування utf8mb4_general_ci, рекомендоване для баз даних з кирилицею.
Далі ми налаштовуємо параметри підключення до бази даних. Для цього у файлі
"app/database/connect.php" вказуємо необхідні налаштування, які представлені на
наступному зображенні.
Рисунок 3.3 – Параметри доступу до БД
Далі у базі даних під назвою «dynamic-site» створюємо таблиці, «comments»,
«posts», «topics», «users».
Рисунок 3.4 – Таблиці бази даних
35
3.3 Розробка головної сторінки
Проєкт являє собою онлайн-ресурс, що дозволяє користувачам переглядати
новини за обраними категоріями, коментувати публікації після авторизації,
здійснювати пошук публікацій, реєструватися та залишати коментарі. На наступному
рисунку зображена головна сторінка, де у верхній частині розміщено логотип і меню
з розділами «Головна сторінка», «Контакти», «Увійти». Нижче знаходиться слайдер
з головними новинами, які додаються у відповідні категорії та відображаються у
вкладці «Головні новини».
Рисунок 3.5 – Головна сторінка з меню і слайдером
Спустившись нижче по сторінці, можна побачити секцію з новинами, які
нещодавно додано. Кожна новина представлена з заголовком, коротким описом та
зображенням, що робить перегляд зручним та інформативним. Поруч розміщено блок
пошуку, що дозволяє користувачам швидко знаходити потрібні публікації за
ключовими словами. Поряд з блоком пошуку розташовані категорії видів спорту, що
дають можливість користувачам легко орієнтуватися в контенті та вибирати новини
за своїми інтересами. Така організація інформації забезпечує зручність у
використанні ресурсу і швидкий доступ до актуальних новин. Також розміщені
кнопки, завдяком легко можна переміщуватися вперед, назад та на початок.
36
Рисунок 3.6 – Головна сторінка з новинами, блоком пошуку та категоріями
Нижче на сторінці розміщений футер, що містить кілька важливих елементів.
Перш за все, у футері розташовано логотип сайту, який підтримує візуальну
ідентичність бренду. Поруч з логотипом знаходиться короткий опис, що надає
відвідувачам загальну інформацію про сайт і його призначення. Також у футері
вказано контактну електронну пошту для зворотного зв'язку та запитів від
користувачів. Далі йде блок соціальних мереж, де відвідувачі можуть знайти
посилання на офіційні сторінки сайту в популярних соціальних мережах, що сприяє
додатковій комунікації та взаємодії. Окрім цього, у футері є навігаційний блок з
меню, який дублює основні розділи сайту, забезпечуючи зручний доступ до них з
будь-якої частини сторінки. Завершує футер форма для зв’язку, яка дозволяє
користувачам швидко відправити повідомлення чи запит безпосередньо через сайт,
покращуючи користувацький досвід і підтримуючи ефективне спілкування.
37
Рисунок 3.6 – Футер онлайн-ресурсу спортивних новин
При наведенні курсору на кнопку «Увійти», користувачеві пропонується
додатковий варіант «Реєстрація». Це зручне випадаюче меню дозволяє новим
користувачам швидко знайти опцію для створення облікового запису, не витрачаючи
час на пошуки відповідної кнопки на сторінці. Така функціональність покращує
загальний користувацький досвід, забезпечуючи легкий доступ до процесу реєстрації
та авторизації. Інтуїтивно зрозумілий інтерфейс допомагає новим користувачам
швидко орієнтуватися на сайті, сприяючи більш ефективній взаємодії з ресурсом.
Рисунок 3.6 – Кнопки «Увійти» та «Реєстрація»
3.4 Розробка сторінки «Вхід»
При натисканні на кнопку «Увійти» відкривається сторінка з формою для входу
в обліковий запис. У цій формі користувачеві пропонується ввести свій електронний
адрес (e-mail) та пароль у відповідні поля. Після введення цих даних необхідно
натиснути кнопку «Увійти», щоб завершити процес авторизації та отримати доступ
до персоналізованих функцій сайту.
Поруч з полями для введення електронної пошти та пароля розташована кнопка
«Реєстрація». Вона призначена для нових користувачів, які ще не мають облікового
запису. Натиснувшина цей елемент, користувач буде перенаправлений на сторінку
38
реєстрації, де він зможе створити новий обліковий запис, вказавши необхідну
інформацію, таку як ім'я, електронна адреса та пароль.
Такий зручний і інтуїтивно зрозумілий інтерфейс забезпечує користувачам
легкий доступ до функцій входу і реєстрації, спрощуючи процес взаємодії з сайтом і
покращуючи загальний користувацький досвід.
Рисунок 3.7 – Сторінка «Вхід»
Якщо користувач натискає на кнопку «Увійти», не ввівши жодної інформації у
поля електронної пошти та пароля, система відображає помилку. Повідомлення про
помилку інформує користувача, що не всі поля заповнені, і тому неможливо
завершити процес авторизації. Це попередження з'являється у вигляді текстового
повідомлення у верхній частині форми, підкреслюючи необхідність введення даних.
Таке функціональне рішення запобігає спробам увійти без необхідних даних,
що сприяє підвищенню безпеки користувацьких облікових записів і забезпечує
коректність введеної інформації. Повідомлення про помилку чітко вказує на те, які
саме поля потрібно заповнити, щоб користувач міг швидко виправити ситуацію та
успішно увійти в систему.
39
Рисунок 3.8 – Помилка з не заповненими полями
При спробі ввести пошту у невірному форматі система виведе повідомлення
про помилку. Це повідомлення інформуватиме користувача, що введений e-mail не
відповідає встановленому формату електронної пошти. Таке застереження допомагає
уникнути введення некоректних даних та підвищує точність введеної інформації.
Рисунок 3.9 – Помилка при не введені пошти
3.5 Розробка сторінки «Реєстрація»
На сторінці реєстрації необхідно ввести логін, електронну пошту, пароль, а
також повторити пароль для підтвердження. Після цього користувач повинен
натиснути кнопку "Реєстрація", щоб завершити процес створення облікового запису.
Крім того, поруч із формою реєстрації розташована кнопка "Увійти", яка дозволяє
вже зареєстрованим користувачам швидко увійти в систему.
40
Рисунок 3.10 – Форма «Реєстрація»
Якщо користувач натисне кнопку "Реєстрація" без введення необхідних даних,
система виведе повідомлення про помилку, яке попереджує про те, що не всі поля
заповнені. Це застереження з'явиться поруч з кожним невведеним полем, вказуючи,
які саме дані потрібно ввести для успішної реєстрації. Така функціональність сприяє
коректному використанню форми реєстрації та допомагає користувачам заповнити
всі необхідні дані перед подальшим продовженням процесу реєстрації.
41
Рисунок 3.11 – Помилка при реєстрації
Якщо користувач введе різні паролі у поля "Пароль" та "Повторіть пароль" під
час реєстрації, система також виведе повідомлення про помилку. Це повідомлення
попереджує користувача, що введені паролі не співпадають і що необхідно ввести
однакові паролі для підтвердження. Такий механізм захисту допомагає уникнути
помилок під час реєстрації та забезпечує безпеку облікових записів користувачів.
Рисунок 3.12 – Помилка при не однакових паролях
Після успішної авторизації користувача нас перекине на головну сторінку
ресурсу, а у верхній частині праворуч буде відображатися логін або ім'я
авторизованого користувача. Це дає змогу користувачам зразу бачити, що вони
авторизувалися на сайті, і надає зручний доступ до особистого облікового запису чи
42
профілю. Такий підхід підвищує зручність використання ресурсу та надає
користувачам більшу контроль над своїм обліковим записом.
Рисунок 3.13 – Вхід після реєстрації
При наведенні на логін у верхній частині сторінки з'явиться кнопка "Вихід". Це
дасть можливість користувачам швидко вийти зі свого облікового запису, якщо вони
більше не бажають залишатися авторизованими на сайті. Кнопка "Вихід" дозволить
здійснити вихід із системи з одного кліку, забезпечуючи зручність та ефективність в
управлінні авторизацією на ресурсі.
Рисунок 3.14 – Вихід з облікового запису
3.6 Розробка сторінки «Контакти»
При натисканні на кнопку "Контакти" користувача перекидає на сторінку
"Контакти". На цій сторінці знаходиться вся необхідна інформація для зв'язку,
включаючи адресу електронної пошти, номер телефону, фізичну адресу офісу, а
також, можливо, форму для відправки повідомлення безпосередньо через сайт. Це
дозволяє користувачам легко знайти способи зв'язатися з адміністрацією ресурсу для
отримання підтримки або додаткової інформації.
43
Рисунок 3.15 – Сторінка «Контакти»
3.7 Розробка сторінки категорії та пошуку
При виборі певної категорії користувача перекидає на сторінку, де
відображаються новини з обраної категорії. Це дозволяє користувачам швидко знайти
та переглянути всі новини, що належать до їхньої тематики інтересу, забезпечуючи
зручну навігацію та доступ до відповідного контенту.
Рисунок 3.16 – Сторінка при обиранні категорії
При введенні пошукового запиту і натисканні кнопки "Пошук" користувача
перекидає на сторінку результатів пошуку. На цій сторінці відображаються всі
публікації, що відповідають введеному запиту. Результати пошуку включають
заголовки, короткі описи і, можливо, зображення, що дозволяє користувачам швидко
44
знаходити необхідну інформацію. Це забезпечує ефективність та зручність у
використанні ресурсу для пошуку конкретного контенту.
Рисунок 3.17– Сторінка при пошуку
При відображенні окремого посту користувач бачить повний текст публікації,
включаючи заголовок, основний контент, зображення, та дату публікації. Крім того,
під постом розміщена секція для коментарів, де зареєстровані користувачі можуть
залишати свої відгуки.
3.8 Розробка форми для коментарів
Коментарі спочатку проходять перевірку адміністратором перед публікацією.
Поряд з постом можуть також відображатися кнопки для соціального обміну,
дозволяючи користувачам ділитися постом у своїх соціальних мережах. Це
забезпечує повний доступ до змісту посту і дозволяє активно взаємодіяти з ним.
45
Рисунок 3.20 – Сторінка посту
Форма для заповнення коментаря складається з великого текстового поля для
введення коментаря ведденям «E-mail» та текста-заповнювача "Введіть коментар",
кнопки "Надіслати" під полем для відправки коментаря на перевірку адміністратору.
Рисунок 3.21 – Форма для коментаря
Якщо користувач намагається надіслати порожній коментар, з'являється
повідомлення про помилку: "Не всі поля заповнені".
46
Рисунок 3.22 – Помилка у формі коментаря
Після схвалення коментаря адміністратором, він публікується на сайті протягом
декількох секунд, стаючи доступним для перегляду усіма користувачами.
Рисунок 3.23 – Опублікований коментар
Для доступу до адміністративної панелі потрібно мати права адміністратора.
Після входу у систему у верхній частині екрана користувач може натиснути на свій
логін у шапці, після чого з'явиться випадаючий список, в якому можна обрати опцію
"Адмін панель". Після вибору цієї опції користувач буде перенаправлений на сторінку
адміністративної панелі для керування сайтом.
47
Рисунок 3.24 – Перехід в адміністративну панель
3.9 Розробка адміністративної панелі
Адміністративна панель має наступний вигляд: у верхній частині знаходиться
шапка з логіном адміністратора та кнопкою "Вихід". Нижче розташовані основні
підрозділи, включаючи "Записи", "Категорії", "Користувачі" та "Коментарі". Ці
підрозділи дозволяють адміністратору керувати контентом, організовувати категорії,
управляти обліковими записами користувачів та модерувати коментарі. Тут бачимо
розділ "Записи", де можна редагувати, створювати нові пости, та видаляти і знімати з
публікації, якщо пост не актуальний.
Рисунок 3.25 – Адміністративна панель
Створення посту в адміністративній панелі є дуже легким та швидким
процесом. Адміністратору потрібно ввести заголовок, текст публікації, обрати
зображення та категорії, до яких він відноситься. Також можна вибрати опцію
публікації на головну сторінку. Після введення всіх необхідних даних адміністратор
може одним натиском добавити запис.
48
Рисунок 3.26 – Додати запис
У розділі "Категорії" адміністратор має можливість створювати нові категорії,
редагувати існуючі та видаляти їх за потреби. Це дозволяє організовувати контент на
сайті та відповідно сортувати публікації за тематикою. Відредаговані чи видалені
категорії автоматично оновлюються на сайті, забезпечуючи актуальність та
коректність відображення контенту.
Рисунок 3.27 – Керувати категоріями
У розділі "Користувачі" адміністратор може керувати обліковими записами,
зокрема створювати нових користувачів, редагувати існуючі дані та видаляти
облікові записи за потреби. Ці функції дозволяють забезпечити ефективне управління
користувачами сайту та збереження безпеки та функціональності платформи.
49
Рисунок 3.28 – Користувачі
Під час редагування користувачів, адміністратор може оновлювати їхні дані,
такі як ім'я, електронна пошта та інші важливі параметри. Крім того, є можливість
надавати користувачам права на адміністрування шляхом встановлення прапорця та
натискання кнопки "Оновити". Ця функція дозволяє розширити або обмежити
можливості облікових записів користувачів у системі відповідно до їхніх потреб та
ролей на сайті.
Рисунок 3.28– Оновлення даних
У розділі "Коментарі" адміністратор має можливість керувати коментарями,
зокрема видаляти непотрібні або нецензурні коментарі, редагувати вміст коментарів
та відмічати їх як не підходящі для публікації. Це дозволяє забезпечити чистоту та
відповідність контенту сайту відповідно до правил і стандартів спільноти. Також
можливість редагувати коментарі дає адміністратору можливість виправляти
помилки або неправильні висловлення в коментарях перед їхньою публікацією.
50
Рисунок 3.28 – Керування коментарями
3.10 Тестування онлайн-ресурсу «Sport.Live»
В кваліфікаційній роботі бакалавра для тестування онлайн-ресурсу
«Sport.Live», та перевірки належного функціонування ресурсу з точки зору
користувача було використано тестування вручну без використання автоматичних
тестів або скриптів. Цей процес передбачає виконання ресурсу, введення різних даних
та перевірку результатів, з метою виявлення можливих помилок та дефектів. Ось
деякі можливі підходи:
Функціональне тестування: перевірка, чи працює кожна функція олайн ресурсу
відповідно до очікувань. Це може включати перевірку різних сценаріїв перегляду
новин, пошуку статей, коментування тощо.
Тестування інтерфейсу користувача: впевниися, що інтерфейс онлайн-ресурсу
працює на різних пристроях і браузерах. Переконатися, що всі елементи інтерфейсу,
такі як кнопки, меню, посилання, відображаються належним чином і функціонують
правильно.
Тестування продуктивності: перевірити швидкість завантаження сторінок
онлайн-ресурсу, обробки запитів і відгуку сервера. Впевнитися, що онлайн-ресурс
працює ефективно навіть при великому навантаженні або при доступі з повільних
інтернет-з'єднань.
Тестування безпеки: перевірити захищеність онлайн-ресурсу від потенційних
загроз, таких як атаки на перехоплення даних, SQL-ін'єкції, перехід на сторону
клієнта та інші. Переконатися , що онлайн-ресурс захищений від вразливостей і
відповідає стандартам безпеки.
51
Тестування відмовості: перевірити, як онлацн ресурс реагує на помилки та
відмови, такі як недоступність сторінок, невідповідність запитів, помилки бази даних
тощо. Впевнитися, що користувач отримає зрозумілі повідомлення про помилки та
можливі шляхи виправлення.
Тестування сумісності: перевірити, як онлайн-ресурс відображається і працює
на різних пристроях (комп'ютерах, планшетах, смартфонах) та різних браузерах
(Chrome, Safari, Edge тощо).
Висновки до розділу 3
У цьому розділі було створено за допомогою мови програмування PHP для
серверної логіки, а також HTML і CSS для структури та стилізації інтерфейсу.
Використання PHP дозволило реалізувати динамічні функції сайту, такі як
авторизація користувачів, обробка коментарів та управління контентом. HTML
забезпечив структуру веб-сторінок, а CSS надав можливість створити привабливий і
зручний для користувачів інтерфейс. Завдяки поєднанню цих технологій був
створений функціональний та естетично приємний онлайн-ресурс «Sport.Live»,
здатний ефективно виконувати всі необхідні завдання.
52
ВИСНОВКИ
Мета створення онлайн-ресурсу спортивних новин досягнута. В ході виконання
проєкту було спроєктовано та розроблено платформу, яка дозволяє користувачам
переглядати новини за обраними категоріями, коментувати публікації після
авторизації, здійснювати пошук публікацій, а також реєструвати нових користувачів
і залишати коментарі.
Для досягнення поставленої мети було виконано такі завдання:
− досліджено предметну область спортивних новин;
− виконано порівняльний аналіз існуючих онлайн-ресурсів спортивних новин;
− розроблено базу даних для зберігання інформації про новини, категорії,
користувачів і коментарі;
− обрано програмно-технічні засоби для реалізації задачі, включаючи PHP для
серверної логіки, HTML і CSS для структури та стилізації інтерфейсу;
− створено зручну адміністративну панель для управління контентом та
користувачами.
Розроблений онлайн-ресурс спортивних новин відповідає всім функціональним
і нефункціональним вимогам, забезпечуючи високу продуктивність та зручність
використання. Інтерфейс платформи є зрозумілим та приємним для користувачів, що
сприяє покращенню їхнього досвіду. Всі технології, що використовувалися при
розробці, гарантують надійність і ефективність роботи ресурсу.
53
СПИСОК ВИКОРИСТАНИХ ДЖЕРЕЛ
1. HTML і CSS. Розробка та дизайн веб-сторінок. URL:
https://www.yakaboo.ua/ua/html-i-css-rozrobka-ta-dizajn-veb-storinok.html (дата
звернення: 21.01.2024).
2. Веб-програмування: HTML, CSS, JavaScript, PHP, MySQL. URL:
https://www.bookclub.ua/ukr/catalog/books/technics/product.html?id=50776 (дата
звернення: 23.01.2024).
3. PHP для початківців. URL: https://folio.com.ua/books/PHP-dlya-pochatkivtsiv
(дата звернення: 10.04.2024).
4. JavaScript. Професійне програмування. URL: https://bohdan-
books.com/catalog/book/148625/ (дата звернення: 05.03.2024).
5. Створення динамічних веб-сайтів з використанням PHP та MySQL. URL:
https://akademvydav.com.ua/catalog/techlit/046.html (дата звернення: 28.04.2024).
6. HTML5 та CSS3: нові можливості. URL: https://lyra-
k.com/catalog/internet/html5_ta_css3_novi_mozhlyvosti/ (дата звернення:
18.04.2023).
7. Основи веб-дизайну та програмування. URL:
https://ranok.com.ua/ua/product/osnovi-vebdizajnu-ta-programuvannya-34088.html
(дата звернення: 03.05.2024).
8. PHP та MySQL для веб-розробників. URL: https://znannya.com.ua/product/php-
ta-mysql-dlya-veb-rozrobnykiv (дата звернення: 10.05.2024).
9. JavaScript для початківців. URL: https://knugoman.org.ua/books/javascript-dlya-
pochatkivciv (дата звернення: 11.05.2024).
10. Веб-програмування з використанням JavaScript та AJAX. URL:
https://pidruchnyk.com.ua/catalog/javascript_ajax/ (дата звернення: 13.05.2024).
54
ДОДАТОК А
Затверджую
Зав. кафедри КНСА,
______________ Юрій ТРИУС
«____»____________2024 р.
ОНЛАЙН – РЕСУРС СПОРТИВНИХ НОВИН
Специфікація
482.ЧДТУ. 32283-01
Листів 2
Розробник ____________________ Баштан Р.В.
Керівник ____________________ Підгорний М.В.
Черкаси – 2024
55
482.ЧДТУ. 32283-01
Позначення Найменування Примітка
Документація
482.ЧДТУ. 32283-01 12 01 Текст програми
482.ЧДТУ. 32283-01 34 01 Інструкція користувача
482.ЧДТУ. 32283-01 90 01 Структура бази даних
56
ДОДАТОК Б
ОНЛАЙН – РЕСУРС СПОРТИВНИХ НОВИН
Текст програми
482.ЧДТУ. 32283-01 12 01
Листів 63
Розробник _____________ Баштан Р.В.
Черкаси – 2024
57
Фрагмент програми
Головна сторінка index.php
<?php
include "path.php";
include "app/controllers/topics.php";
$page = isset($_GET['page']) ? $_GET['page']: 1;
$limit = 2;
$offset = $limit * ($page - 1);
$total_pages = round(countRow('posts') / $limit, 0);
$posts = selectAllFromPostsWithUsersOnIndex('posts', 'users', $limit, $offset);
$topTopic = selectTopTopicFromPostsOnIndex('posts');
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="assets/css/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Sport.Life ➟ свіжі новини спорту онлайн</title>
</head>
<body>
58
<?php include("app/include/header.php"); ?>
<!-- блок каруселі START-->
<div class="container">
<div class="row">
<h2 class="slider-title">Головні новини</h2>
</div>
<div id="carouselExampleCaptions" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-inner">
<?php foreach ($topTopic as $key => $post): ?>
<?php if($key == 0):?>
<div class="carousel-item active">
<?php else: ?>
<div class="carousel-item">
<?php endif; ?>
<img src="<?=BASE_URL . 'assets/images/posts/' . $post['img']
?>" alt="<?=$post['title']?>" class="d-block w-100">
<div class="carousel-caption-hack carousel-caption d-none d-md-
block">
<h5><a href="<?=BASE_URL . 'single.php?post=' .
$post['id'];?>"><?=substr($post['title'], 0, 120) . '...' ?></a></h5>
</div>
</div>
<?php endforeach; ?>
</div>
<button class="carousel-control-prev" type="button" data-bs-
target="#carouselExampleCaptions" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-
target="#carouselExampleCaptions" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</div>
<!-- блок каруселі END-->
<!-- блок main-->
<div class="container">
<div class="content row">
<!-- Main Content -->
<div class="main-content col-md-9 col-12">
<h2>Новини</h2>
<?php foreach ($posts as $post): ?>
<div class="post row">
<div class="img col-12 col-md-4">
59
<img src="<?=BASE_URL . 'assets/images/posts/' . $post['img']
?>" alt="<?=$post['title']?>" class="img-thumbnail">
</div>
<div class="post_text col-12 col-md-8">
<h3>
<a href="<?=BASE_URL . 'single.php?post=' .
$post['id'];?>"><?=substr($post['title'], 0, 80) . '...' ?></a>
</h3>
<i class="far fa-user"> <?=$post['username'];?></i>
<i class="far fa-calendar"> <?=$post['created_date'];?></i>
<p class="preview-text">
<?=mb_substr($post['content'], 0, 55, 'UTF-8'). '...' ?>
</p>
</div>
</div>
<?php endforeach; ?>
<?php include("app/include/pagination.php"); ?>
</div>
<!-- sidebar Content -->
<div class="sidebar col-md-3 col-12">
<div class="section search">
<h3>Пошук</h3>
<form action="search.php" method="post">
<input type="text" name="search-term" class="text-input"
placeholder="Введіть текст">
</form>
</div>
<div class="section topics">
<h3>Категорії</h3>
<ul>
<?php foreach ($topics as $key => $topic): ?>
<li>
<a href="<?=BASE_URL . 'category.php?id=' . $topic['id'];
?>"><?=$topic['name']; ?></a>
</li>
<?php endforeach; ?>
</ul>
</div>
</div>
</div>
</div>
<!-- блок main END-->
60
<!-- footer -->
<?php include("app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Сторінка контакти contacts.php
<?php
include "path.php";
include "app/controllers/topics.php";
?>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
61
<!-- Custom Styling -->
<link rel="stylesheet" href="assets/css/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Контактна інформація Sport.Life</title>
</head>
<body>
<?php include("app/include/header.php"); ?>
<!-- блок каруселі Contats-->
<div class = "contacts">
<main class=" text-white p-4 text-center">
<h1>Контакти</h1>
</main>
<div class="container mt-5">
<div class="row">
<div class="col-md-6">
<p>Якщо у вас є питання або ви хочете з нами зв'язатися, будь ласка,
використовуйте наступну інформацію:</p>
<div class="contact-info">
<p><strong>E-mail редакції:</strong> [email protected]</p>
<p><strong>Телефон:</strong> +380 977 97 7516</p>
<p><strong>Адреса:</strong> бульвар Шевченка, 460, Черкаси,
Черкаська область, 18000</p>
</div>
</div>
</div>
</div>
</div>
<!-- //блок каруселі Contats-->
<!-- footer -->
<?php include("app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
62
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Категорії category.php
<?php
include "path.php";
include "app/controllers/topics.php";
$posts = selectAll('posts', ['id_topic' => $_GET['id']]);
$topTopic = selectTopTopicFromPostsOnIndex('posts');
$category = selectOne('topics', ['id' => $_GET['id']]);
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="assets/css/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Sport.Life ➟ свіжі новини спорту онлайн</title>
</head>
63
<body>
<?php include("app/include/header.php"); ?>
<!-- блок main-->
<div class="container">
<div class="content row">
<!-- Main Content -->
<div class="main-content col-md-9 col-12 mx-md-auto"> <!-- додано клас mx-md-
auto -->
<h2>Розділ <strong><?=$category['name']; ?></strong></h2>
<?php foreach ($posts as $post): ?>
<div class="post row">
<div class="img col-12 col-md-4">
<img src="<?=BASE_URL . 'assets/images/posts/' . $post['img'] ?>"
alt="<?=$post['title']?>" class="img-thumbnail">
</div>
<div class="post_text col-12 col-md-8">
<h3>
<a href="<?=BASE_URL . 'single.php?post=' .
$post['id'];?>"><?=substr($post['title'], 0, 80) . '...' ?></a>
</h3>
<i class="far fa-user"> <?= isset($post['username']) ?
$post['username'] : 'Невідомий'; ?></i>
<i class="far fa-calendar"> <?=$post['created_date'];?></i>
<p class="preview-text">
<?=mb_substr($post['content'], 0, 55, 'UTF-8'). '...' ?>
</p>
</div>
</div>
<?php endforeach; ?>
</div>
<!-- sidebar Content -->
<div class="sidebar col-md-3 col-12">
<div class="section search">
<h3>Пошук</h3>
<form action="search.php" method="post">
<input type="text" name="search-term" class="text-input"
placeholder="Введіть текст">
</form>
</div>
<div class="section topics">
<h3>Категорії</h3>
<ul>
<?php foreach ($topics as $key => $topic): ?>
<li>
<a href="<?=BASE_URL . 'category.php?id=' . $topic['id'];
?>"><?=$topic['name']; ?></a>
</li>
<?php endforeach; ?>
64
</ul>
</div>
</div>
</div>
</div>
<!-- блок main END-->
<!-- footer -->
<?php include("app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Вхід log.php
<?php include("path.php");
include "app/controllers/users.php";
?>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
65
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="assets/css/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Sport.Life ➟ свіжі новини спорту онлайн</title>
</head>
<body>
<?php include("app/include/header.php"); ?>
<!-- END HEADER -->
<!-- FORM -->
<div class="container reg_form">
<form class="row justify-content-center" method="post" action="log.php">
<h2 class="col-12">Вхід</h2>
<div class="mb-3 col-12 col-md-4 err">
<?php if (is_array($errMsg)): ?>
<ul>
<?php foreach ($errMsg as $error): ?>
<li><?= $error ?></li>
<?php endforeach; ?>
</ul>
<?php else: ?>
<p><?= $errMsg ?></p>
<?php endif; ?>
</div>
<div class="w-100"></div>
<div class="mb-3 col-12 col-md-4">
<label for="formGroupExampleInput" class="form-label">E-mail</label>
<input name="mail" value="<?=$email?>" type="email" class="form-control"
id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Введіть e-mail">
</div>
<div class="w-100"></div>
<div class="mb-3 col-12 col-md-4">
<label for="exampleInputPassword1" class="form-label">Пароль</label>
<input name="password" type="password" class="form-control"
id="exampleInputPassword1" placeholder="Введіть пароль">
66
</div>
<div class="w-100"></div>
<div class="mb-3 col-12 col-md-4">
<button type="submit" name="button-log" class="btn btn-
secondary">Увійти</button>
<a href="reg.php">Реєстрація</a>
</div>
</form>
</div>
<!-- END FORM -->
<!-- footer -->
<?php include("app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Вихід logout.php
<?php
session_start();
include "path.php";
unset($_SESSION['id']);
unset($_SESSION['login']);
unset($_SESSION['admin']);
header('location: ' . BASE_URL);
67
Меню main.php
<?php
$method = $_SERVER['REQUEST_METHOD'];
$c = true;
if ( $method === 'POST' ) {
$email = trim($_POST["email"]);
$m_message = trim($_POST["m_massage"]);
foreach ( $_POST as $key => $value ) {
if ( $value != "" && $key != "email" && $key != "m_massage" ) {
$message .= "
" . ( ($c = !$c) ? '<tr>':'<tr style="background-color: #f8f8f8;">' ) . "
<td style='padding: 10px; border: #e9e9e9 1px solid;'><b>$key</b></td>
<td style='padding: 10px; border: #e9e9e9 1px solid;'>$value</td>
</tr>
";
}
}
} else if ( $method === 'GET' ) {
$email = trim($_GET["email"]);
$m_massage = trim($_GET["m_massage"]);
foreach ( $_GET as $key => $value ) {
if ( $value != "" && $key != "email" && $key != "m_massage" ) {
$message .= "
" . ( ($c = !$c) ? '<tr>':'<tr style="background-color: #f8f8f8;">' ) . "
<td style='padding: 10px; border: #e9e9e9 1px solid;'><b>$key</b></td>
<td style='padding: 10px; border: #e9e9e9 1px solid;'>$value</td>
</tr>
";
}
}
};
$message = "<table style='width: 100%;'>$message</table>";
function adopt($text) { return '=?UTF-8?B?'.Base64_encode($text).'?='; };
$headers = "MIME-Version: 1.0" . "\r\n" .
"Content-Type: text/html; charset=utf-8" . "\r\n" .
"From: " . " <" . $email . ">" . "\r\n" .
"Reply-To: " . $email . "" . "\r\n";
mail($email, adopt($m_massage), $message, $headers );
68
Реєстрація reg.php
<?php
include "path.php";
include "app/controllers/users.php";
// Перевірка наявності зареєстрованого користувача
if(isset($_SESSION['user_id'])) {
header("Location: index.php"); // Перенаправлення на головну сторінку, якщо
користувач вже увійшов у систему
exit;
}
?>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="assets/css/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Sport.Life ➟ свіжі новини спорту онлайн</title>
</head>
<body>
<?php include("app/include/header.php"); ?>
<!-- END HEADER -->
<!-- FORM -->
<div class="container reg_form">
<form action="reg.php" method="post" class="row justify-content-center">
<h2>Реєстрація</h2>
<div class="mb-3 col-12 col-md-4 err">
69
<?php if (is_array($errMsg)): ?>
<ul>
<?php foreach ($errMsg as $error): ?>
<li><?= $error ?></li>
<?php endforeach; ?>
</ul>
<?php else: ?>
<p><?= $errMsg ?></p>
<?php endif; ?>
</div>
<div class="w-100"></div>
<div class="mb-3 col-12 col-md-4">
<label for="formGroupExampleInput" class="form-label">Логін</label>
<input name="login" value="<?=$login?>" type="text" class="form-control"
id="formGroupExampleInput" placeholder="Введіть логін">
</div>
<div class="w-100"></div>
<div class="mb-3 col-12 col-md-4">
<label for="exampleInputEmail1" class="form-label">E-mail</label>
<input name="mail" value="<?=$email?>" type="email" class="form-control"
id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Введіть e-mail">
<div id="emailHelp" class="form-text">Ваш e-mail адрес не буде
використовуватися для спаму!</div>
</div>
<div class="w-100"></div>
<div class="mb-3 col-12 col-md-4">
<label for="exampleInputPassword1" class="form-label">Пароль</label>
<input name="pass-first" type="password" class="form-control"
id="exampleInputPassword1" placeholder="Введіть пароль">
</div>
<div class="w-100"></div>
<div class="mb-3 col-12 col-md-4">
<label for="exampleInputPassword2" class="form-label">Повторіть
пароль</label>
<input name="pass-second" type="password" class="form-control"
id="exampleInputPassword2" placeholder="Повторіть пароль">
</div>
<div class="w-100"></div>
<div class="mb-3 col-12 col-md-4">
<button type="submit" class="btn btn-secondary" name="button-
reg">Реєстрація</button>
<a href="log.php">Вхід</a>
</div>
</form>
</div>
<!-- END FORM -->
<!-- footer -->
<?php include("app/include/footer.php"); ?>
<!-- // footer -->
70
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1g
Пошук search.php
<?php
include "path.php";
include SITE_ROOT . "/app/database/db.php";
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['search-term'])){
$posts = seacrhInTitileAndContent($_POST['search-term'], 'posts', 'users');
}
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="assets/css/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Sport.Life ➟ свіжі новини спорту онлайн</title>
</head>
<body>
<?php include("app/include/header.php"); ?>
71
<!-- блок main-->
<div class="container">
<div class="content row">
<!-- Main Content -->
<div class="main-content col-12">
<h2>Результат пошуку</h2>
<?php foreach ($posts as $post): ?>
<div class="post row">
<div class="img col-12 col-md-4">
<img src="<?=BASE_URL . '/assets/images/posts/' . $post['img']
?>" alt="<?=$post['title']?>" class="img-thumbnail">
</div>
<div class="post_text col-12 col-md-8">
<h3>
<a href="<?=BASE_URL . 'single.php?post=' .
$post['id'];?>"><?=substr($post['title'], 0, 80) . '...' ?></a>
</h3>
<i class="far fa-user"> <?=$post['username'];?></i>
<i class="far fa-calendar"> <?=$post['created_date'];?></i>
<p class="preview-text">
<?=mb_substr($post['content'], 0, 55, 'UTF-8'). '...' ?>
</p>
</div>
</div>
<?php endforeach; ?>
</div>
</div>
</div>
<!-- блок main END-->
<!-- footer -->
<?php include("app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
72
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Сторінка посту single.php
<?php include("path.php");
include "app/controllers/topics.php";
$post = selectPostFromPostsWithUsersOnSingle('posts', 'users', $_GET['post']);
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="assets/css/style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Sport.Life➟ свіжі новини спорту онлайн</title>
</head>
<body>
73
<?php include("app/include/header.php"); ?>
<!-- блок main-->
<div class="container">
<div class="content row">
<!-- Main Content -->
<div class="main-content col-md-9 col-12">
<h2><?php echo $post['title']; ?></h2>
<div class="single_post row">
<div class="img col-12">
<img src="<?=BASE_URL . 'assets/images/posts/' . $post['img'] ?>"
alt="<?=$post['title']?>" class="img-thumbnail">
</div>
<div class="info">
<i class="far fa-user"> <?=$post['username'];?></i>
<i class="far fa-calendar"> <?=$post['created_date'];?></i>
</div>
<div class="single_post_text col-12">
<?=$post['content'];?>
</div>
<!-- HTML БЛОК З КОМЕНТАМИ --->
<?php include("app/include/comments.php"); ?>
</div>
</div>
<!-- sidebar Content -->
<div class="sidebar col-md-3 col-12">
<div class="section search">
<h3>Пошук</h3>
<form action="search.php" method="post">
<input type="text" name="search-term" class="text-input"
placeholder="Введіть текст">
</form>
</div>
<div class="section topics">
<h3>Категорії</h3>
<ul>
<?php foreach ($topics as $key => $topic): ?>
<li>
<a href="<?=BASE_URL . 'category.php?id=' . $topic['id'];
?>"><?=$topic['name']; ?></a>
</li>
<?php endforeach; ?>
</ul>
</div>
</div>
74
</div>
</div>
<!-- блок main END-->
<!-- footer -->
<?php include("app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Comments.php
<?php include SITE_ROOT . "/app/controllers/commentaries.php"; ?>
<div class="cpl-md-12 col-12 comments">
<h3>Коментар</h3>
<?php if (!empty($errMsg)): ?>
<div class="alert alert-danger">
<?php foreach ($errMsg as $error): ?>
<p><?= htmlspecialchars($error); ?></p>
<?php endforeach; ?>
</div>
<?php endif; ?>
<form action="<?= BASE_URL . "single.php?post=$page" ?>" method="post">
<input type="hidden" name="page" value="<?= htmlspecialchars($page); ?>">
<div class="mb-3">
<label for="exampleFormControlInput1" class="form-label">E-mail</label>
<input name="email" type="email" class="form-control"
id="exampleFormControlInput1" placeholder="[email protected]" value="<?=
htmlspecialchars($email); ?>">
75
</div>
<div class="mb-3">
<label for="exampleFormControlTextarea1" class="form-label">Введіть
коментар</label>
<textarea name="comment" class="form-control"
id="exampleFormControlTextarea1" rows="4"><?= htmlspecialchars($comment); ?></textarea>
</div>
<div class="col-12">
<button type="submit" name="goComment" class="btn btn-
primary">Відправити</button>
</div>
</form>
<?php if (count($comments) > 0): ?>
<div class="row all-comments">
<h3 class="col-12">Коментарі допису</h3>
<?php foreach ($comments as $comment): ?>
<div class="one-comment col-12">
<span><i class="far fa-envelope"></i> <?=
htmlspecialchars($comment['email']); ?></span>
<span><i class="far fa-calendar-check"></i> <?=
htmlspecialchars($comment['created_date']); ?></span>
<div class="col-12 text">
<?= nl2br(htmlspecialchars($comment['comment'])); ?>
</div>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
Footer.php
<div class="footer container-fluid">
<div class="footer-content container">
<div class="row">
<div class="footer-section about col-md-4 col-12">
<h3 class="logo-text">Sport.Live</h3>
<p>
Свіжі новини спорту онлайн завжди під рукою,
дозволяючи отримувати актуальну та вчасну інформацію зі світу спорту.
</p>
<div class="contact">
<span><i class="fas fa-envelope"></i>
[email protected]</span>
</div>
<div class="socials">
<a href="#"><i class="fab fa-instagram"></i></a>
</div>
</div>
<div class="footer-section links col-md-4 col-12">
76
<h3>Меню</h3>
<br>
<ul>
<a href="/index.php">
<li>Головна</li>
</a>
<a href="/contacts.php">
<li>Контакти</li>
</a>
<a href="/log.php">
<li>Увійти</li>
</a>
<a href="/reg.php">
<li>Реєстрація</li>
</a>
</ul>
</div>
<div class="footer-section contact-form col-md-4 col-12">
<h3>Зв'язатися з нами</h3>
<br>
<form action="send_email.php" method="post">
<input type="email" name="email" class="text-input contact-input"
placeholder="Ваша e-mail адреса">
<textarea rows="4" name="message" class="text-input contact-input"
placeholder="Ваше повідомлення..." style="height: 275px;"></textarea>
<button type="submit" class="btn btn-big contact-btn">
<i class="fas fa-envelope"></i> Відправити</button>
</form>
</div>
<div class="footer-bottom">
© SPORT.LIFE | Designed RomaBashtan
</div>
</div>
</div>
Header.php
<header class="container-fluid">
<div class="container">
<div class="row">
<div class="col-4">
<h1>
<a href="<?php echo BASE_URL ?>">
<img src="../assets/images/avau.png" alt="logo" class="logo-image">
</a>
</h1>
</div>
<nav class="col-8">
<ul>
77
<li><a href="<?php echo BASE_URL ?>">Головна</a> </li>
<li><a href="<?php echo BASE_URL . 'contacts.php'?>">Контакти</a>
</li>
<li>
<?php if (isset($_SESSION['id'])): ?>
<a href="#">
<i class="fa fa-user"></i>
<?php echo $_SESSION['login']; ?>
</a>
<ul>
<?php if ($_SESSION['admin']): ?>
<li><a href="admin/posts/index.php">Адмін панель</a>
</li>
<?php endif; ?>
<li><a href="<?php echo BASE_URL . "logout.php";
?>">Вихід</a> </li>
</ul>
<?php else: ?>
<a href="<?php echo BASE_URL . "log.php"; ?>">
<i class="fa fa-user"></i>
Увійти
</a>
<ul>
<li><a href="<?php echo BASE_URL . "reg.php";
?>">Реєстрація</a> </li>
</ul>
<?php endif; ?>
</li>
</ul>
</nav>
</div>
</div>
</header>
Header-admin.php
<header class="container-fluid">
<div class="container">
<div class="row">
<div class="col-4">
<h1>
<a href="<?php echo BASE_URL ?>">Admin</a>
</h1>
</div>
<nav class="col-8">
<ul>
<li>
78
<?php if (isset($_SESSION['login'])) : ?>
<a href="#">
<i class="fa fa-user"></i>
<?php echo $_SESSION['login']; ?>
</a>
<?php endif; ?>
</li>
<li>
<a href="<?php echo BASE_URL . "logout.php"; ?>">Вихід</a>
</li>
</ul>
</nav>
</div>
</div>
</header>
Pagination.php
<nav aria-label="Page navigation example">
<ul class="pagination justify-content-center">
<li class="page-item"><a class="page-link" href="?page=1">Початок</a></li>
<?php if($page > 1): ?>
<li class="page-item">
<a class="page-link" href="<?php echo "?page=".($page - 1);?>">Назад</a>
</li>
<?php endif; ?>
<?php if($page < $total_pages): ?>
<li class="page-item">
<a class="page-link" href="<?php echo "?page=".($page + 1);?>">Вперед</a>
</li>
<?php endif; ?>
<li class="page-item"><a class="page-link" href="?page=<?php echo $total_pages;
?>">Кінець</a></li>
</ul>
</nav>
Siderbar-admin.php
<?php include "../../path.php"; ?>
<div class="row">
<div class="sidebar col-3">
<ul>
<li>
<a href="<?php echo BASE_URL . "admin/posts/index.php";?>">Записи</a>
</li>
<li>
<a href="<?php echo BASE_URL .
"admin/topics/index.php";?>">Категорії</a>
</li>
79
<li>
<a href="<?php echo BASE_URL .
"admin/users/index.php";?>">Користувачі</a>
</li>
<li>
<a href="<?php echo BASE_URL .
"admin/comments/index.php";?>">Коментарі</a>
</li>
</ul>
</div>
Вивід помилок
Errorinfo.php
<?php if (count($errMsg) > 0): ?>
<ul>
<?php foreach ($errMsg as $error): ?>
<li><?=$error; ?></li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
База даних
Connect.php
<?php
$driver = 'mysql';
$host = 'localhost';
$db_name = 'dinamic-site';
$db_user = 'root';
$db_pass = 'mysql';
$charset = 'utf8';
$options = [PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC];
try{
$pdo = new PDO(
"$driver:host=$host;dbname=$db_name;charset=$charset", $db_user, $db_pass,
$options
);
}catch (PDOException $i){
die("Помилка підключення до бази даних");
}
Bd.php
<?php
if (session_id() == '') {
80
session_start();
}
require 'connect.php';
function tt($value){
echo '<pre>';
print_r($value);
echo '</pre>';
exit();
}
function tte($value){
echo '<pre>';
print_r($value);
echo '</pre>';
}
// Перевірка запита БД
function dbCheckError($query){
$errInfo = $query->errorInfo();
if ($errInfo[0] !== PDO::ERR_NONE){
echo $errInfo[2];
exit();
}
return true;
}
// Запрос на получение данных с одной таблицы
function selectAll($table, $params = []){
global $pdo;
$sql = "SELECT * FROM $table";
if(!empty($params)){
$i = 0;
foreach ($params as $key => $value){
if (!is_numeric($value)){
$value = $pdo->quote($value);
}
if ($i === 0){
$sql .= " WHERE $key=$value";
}else{
$sql .= " AND $key=$value";
}
$i++;
}
}
$query = $pdo->prepare($sql);
$query->execute();
dbCheckError($query);
81
return $query->fetchAll();
}
// Запрос на получение одной строки с выбранной таблицы
function selectOne($table, $params = []){
global $pdo;
$sql = "SELECT * FROM $table";
if(!empty($params)){
$i = 0;
foreach ($params as $key => $value){
if (!is_numeric($value)){
$value = $pdo->quote($value);
}
if ($i === 0){
$sql .= " WHERE $key=$value";
}else{
$sql .= " AND $key=$value";
}
$i++;
}
}
$query = $pdo->prepare($sql);
$query->execute();
dbCheckError($query);
return $query->fetch();
}
// Запись в таблицу БД
function insert($table, $params){
global $pdo;
$columns = implode(', ', array_keys($params));
$placeholders = ':' . implode(', :', array_keys($params));
$sql = "INSERT INTO $table ($columns) VALUES ($placeholders)";
$query = $pdo->prepare($sql);
foreach ($params as $key => $value) {
$query->bindValue(":$key", $value);
}
$query->execute();
dbCheckError($query);
return $pdo->lastInsertId();
}
// Обновление строки в таблице
function update($table, $id, $params){
global $pdo;
$str = '';
foreach ($params as $key => $value) {
$str .= "$key = :$key, ";
82
}
$str = rtrim($str, ', ');
$sql = "UPDATE $table SET $str WHERE id = :id";
$query = $pdo->prepare($sql);
foreach ($params as $key => $value) {
$query->bindValue(":$key", $value);
}
$query->bindValue(':id', $id, PDO::PARAM_INT);
$query->execute();
dbCheckError($query);
}
// Удаление строки из таблицы
function delete($table, $id){
global $pdo;
$sql = "DELETE FROM $table WHERE id = :id";
$query = $pdo->prepare($sql);
$query->bindValue(':id', $id, PDO::PARAM_INT);
$query->execute();
dbCheckError($query);
}
// Выборка записей (posts) с автором в админку
function selectAllFromPostsWithUsers($table1, $table2){
global $pdo;
$sql = "SELECT
t1.id,
t1.title,
t1.img,
t1.content,
t1.status,
t1.id_topic,
t1.created_date,
t2.username
FROM $table1 AS t1
JOIN $table2 AS t2 ON t1.id_user = t2.id";
$query = $pdo->prepare($sql);
$query->execute();
dbCheckError($query);
return $query->fetchAll();
}
// Выборка записей (posts) с автором на главную
function selectAllFromPostsWithUsersOnIndex($table1, $table2, $limit, $offset){
global $pdo;
$sql = "SELECT p.*, u.username
FROM $table1 AS p
JOIN $table2 AS u ON p.id_user = u.id
WHERE p.status=1
83
LIMIT :limit OFFSET :offset";
$query = $pdo->prepare($sql);
$query->bindValue(':limit', (int)$limit, PDO::PARAM_INT);
$query->bindValue(':offset', (int)$offset, PDO::PARAM_INT);
$query->execute();
dbCheckError($query);
return $query->fetchAll();
}
// Выборка записей (posts) с автором на главную
function selectTopTopicFromPostsOnIndex($table1){
global $pdo;
$sql = "SELECT * FROM $table1 WHERE id_topic = 18";
$query = $pdo->prepare($sql);
$query->execute();
dbCheckError($query);
return $query->fetchAll();
}
// Поиск по заголовкам и содержимому (простой)
function seacrhInTitileAndContent($text, $table1, $table2){
$text = trim(strip_tags(stripcslashes(htmlspecialchars($text))));
global $pdo;
$sql = "SELECT
p.*, u.username
FROM $table1 AS p
JOIN $table2 AS u ON p.id_user = u.id
WHERE p.status=1
AND (p.title LIKE :text OR p.content LIKE :text)";
$query = $pdo->prepare($sql);
$query->bindValue(':text', "%$text%", PDO::PARAM_STR);
$query->execute();
dbCheckError($query);
return $query->fetchAll();
}
// Выборка записи (posts) с автором для синг
function selectPostFromPostsWithUsersOnSingle($table1, $table2, $id){
global $pdo;
$sql = "SELECT p.*, u.username
FROM $table1 AS p
JOIN $table2 AS u ON p.id_user = u.id
WHERE p.id = :id";
$query = $pdo->prepare($sql);
$query->bindValue(':id', $id, PDO::PARAM_INT);
$query->execute();
dbCheckError($query);
return $query->fetch();
}
84
// Считаем количество строк в таблице
function countRow($table){
global $pdo;
$sql = "SELECT COUNT(*) FROM $table";
$query = $pdo->prepare($sql);
$query->execute();
dbCheckError($query);
return $query->fetchColumn();
}
Контроллери
Commentaries.php
<?php
// контроллер
include_once SITE_ROOT . "/app/database/db.php";
$commentsForAdm = selectAll('comments');
$page = filter_input(INPUT_GET, 'post', FILTER_SANITIZE_STRING);
if ($page !== false) {
// Продовжувати обробку
} else {
// Повідомлення про помилку або дія в разі недійсного 'post'
}
$email = '';
$comment = '';
$errMsg = [];
$status = 0;
$comments = [];
// Код для форми створення коментаря
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['goComment'])){
$email = trim($_POST['email']);
$comment = trim($_POST['comment']);
if($email === '' || $comment === ''){
array_push($errMsg, "Не всі поля заповнені!");
}elseif (mb_strlen($comment, 'UTF8') < 20){
array_push($errMsg, "Коментар має бути більше 20 символів");
}else{
$user = selectOne('users', ['email' => $email]);
if ($user && isset($user['email']) && isset($user['admin']) && $user['email'] ==
$email && $user['admin'] == 1){
85
$status = 1;
}
$comment = [
'status' => $status,
'page' => $page,
'email' => $email,
'comment' => $comment
];
$comment = insert('comments', $comment);
$comments = selectAll('comments', ['page' => $page, 'status' => 1] );
}
}else{
$email = '';
$comment = '';
$comments = selectAll('comments', ['page' => $page, 'status' => 1] );
}
// Видалення коментара
if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['delete_id'])){
$id = $_GET['delete_id'];
delete('comments', $id);
header('location: ' . BASE_URL . 'admin/comments/index.php');
}
// Статус опублікувати чи зняти з публікації
if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['pub_id'])){
$id = $_GET['pub_id'];
$publish = $_GET['publish'];
$postId = update('comments', $id, ['status' => $publish]);
header('location: ' . BASE_URL . 'admin/comments/index.php');
exit();
}
// АПДЕЙТ СТАТТІ
if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['id'])){
$oneComment = selectOne('comments', ['id' => $_GET['id']]);
$id = $oneComment['id'];
$email = $oneComment['email'];
$text1 = $oneComment['comment'];
$pub = $oneComment['status'];
}
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['edit_comment'])){
$id = $_POST['id'];
86
$text = trim($_POST['content']);
$publish = isset($_POST['publish']) ? 1 : 0;
if($text === ''){
array_push($errMsg, "Коментра не має тексту");
}elseif (mb_strlen($text, 'UTF8') < 20){
array_push($errMsg, "Кількість символів коментаря менше 20");
}else{
$com = [
'comment' => $text,
'status' => $publish
];
$comment = update('comments', $id, $com);
header('location: ' . BASE_URL . 'admin/comments/index.php');
}
}else{
if (isset($_POST['content'])) {
$text = trim($_POST['content']);
} else {
$text = '';
}
if (isset($_POST['publish'])) {
$publish = 1;
} else {
$publish = 0;
}
}
Posts.php
<?php
include SITE_ROOT . "/app/database/db.php";
if (!$_SESSION){
header('location: ' . BASE_URL . 'log.php');
}
$errMsg = [];
$id = '';
$title = '';
$content = '';
$img = '';
$topic = '';
$topics = selectAll('topics');
$posts = selectAll('posts');
$postsAdm = selectAllFromPostsWithUsers('posts', 'users');
87
// Код для форми створення запису
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['add_post'])){
if (!empty($_FILES['img']['name'])){
$imgName = time() . "_" . $_FILES['img']['name'];
$fileTmpName = $_FILES['img']['tmp_name'];
$fileType = $_FILES['img']['type'];
$destination = ROOT_PATH . "\assets\images\posts\\" . $imgName;
if (strpos($fileType, 'image') === false) {
array_push($errMsg, "Підгружений файл не зображення!");
}else{
$result = move_uploaded_file($fileTmpName, $destination);
if ($result){
$_POST['img'] = $imgName;
}else{
array_push($errMsg, "Помилка загрузки зображення на сервер");
}
}
}else{
array_push($errMsg, "Помилка отримання зображення");
}
$title = trim($_POST['title']);
$content = trim($_POST['content']);
$topic = trim($_POST['topic']);
$publish = isset($_POST['publish']) ? 1 : 0;
if($title === '' || $content === '' || $topic === ''){
array_push($errMsg, "Не всі поля заповненні!");
}elseif (mb_strlen($title, 'UTF8') < 7){
array_push($errMsg, "Назва статті має бути більше 7-ми символів");
}else{
$post = [
'id_user' => $_SESSION['id'],
'title' => $title,
'content' => $content,
'img' => $_POST['img'],
'status' => $publish,
'id_topic' => $topic
];
$post = insert('posts', $post);
$post = selectOne('posts', ['id' => $id] );
header('location: ' . BASE_URL . 'admin/posts/index.php');
}
88
}else{
$id = '';
$title = '';
$content = '';
$publish = '';
$topic = '';
}
// АПДЕЙТ СТАТТі
if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['id'])){
$post = selectOne('posts', ['id' => $_GET['id']]);
$id = $post['id'];
$title = $post['title'];
$content = $post['content'];
$topic = $post['id_topic'];
$publish = $post['status'];
}
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['edit_post'])){
$id = $_POST['id'];
$title = trim($_POST['title']);
$content = trim($_POST['content']);
$topic = trim($_POST['topic']);
$publish = isset($_POST['publish']) ? 1 : 0;
if (!empty($_FILES['img']['name'])){
$imgName = time() . "_" . $_FILES['img']['name'];
$fileTmpName = $_FILES['img']['tmp_name'];
$fileType = $_FILES['img']['type'];
$destination = ROOT_PATH . "\assets\images\posts\\" . $imgName;
if (strpos($fileType, 'image') === false) {
array_push($errMsg, "Підгружений файл не зображення!");
}else{
$result = move_uploaded_file($fileTmpName, $destination);
if ($result){
$_POST['img'] = $imgName;
}else{
array_push($errMsg, "Помилка загрузки зображення на сервер");
}
}
}else{
array_push($errMsg, "Помилка отримання зображення");
}
89
if($title === '' || $content === '' || $topic === ''){
array_push($errMsg, "Не всі поля заповненні!");
}elseif (mb_strlen($title, 'UTF8') < 7){
array_push($errMsg, "Назва статті має бути більше 7-ми символів");
}else{
$post = [
'id_user' => $_SESSION['id'],
'title' => $title,
'content' => $content,
'img' => $_POST['img'],
'status' => $publish,
'id_topic' => $topic
];
$post = update('posts', $id, $post);
header('location: ' . BASE_URL . 'admin/posts/index.php');
}
}if (isset($_POST['title'], $_POST['content'], $_POST['id_topic'])) {
// Ваш код для отримання значень
$title = $_POST['title'];
$content = $_POST['content'];
$id_topic = $_POST['id_topic'];
// Продовжувати обробку даних
} else {
// Повідомлення про помилку або дія в разі відсутності необхідних ключів
}
// Статус опублікувати чи зняти з публікації
if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['pub_id'])){
$id = $_GET['pub_id'];
$publish = $_GET['publish'];
$postId = update('posts', $id, ['status' => $publish]);
header('location: ' . BASE_URL . 'admin/posts/index.php');
exit();
}
// Видалення статі
if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['delete_id'])){
$id = $_GET['delete_id'];
delete('posts', $id);
header('location: ' . BASE_URL . 'admin/posts/index.php');
}
Topics.php
<?php
90
include SITE_ROOT . "/app/database/db.php";
$errMsg = '';
$id = '';
$name = '';
$description = '';
$topics = selectAll('topics');
// Код для форми створення категорії
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['topic-create'])){
$name = trim($_POST['name']);
$description = trim($_POST['description']);
if($name === '' || $description === ''){
$errMsg = "Не всі поля заповнені!";
}elseif (mb_strlen($name, 'UTF8') < 2){
$errMsg = "Категорія має бути більше 2-х символів";
}else{
$existence = selectOne('topics', ['name' => $name]);
if($existence['name'] === $name){
$errMsg = "Така категория уже існує";
}else{
$topic = [
'name' => $name,
'description' => $description
];
$id = insert('topics', $topic);
$topic = selectOne('topics', ['id' => $id] );
header('location: ' . BASE_URL . 'admin/topics/index.php');
}
}
}else{
$name = '';
$description = '';
}
// Апдейт категорії
if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['id'])){
$id = $_GET['id'];
$topic = selectOne('topics', ['id' => $id]);
$id = $topic['id'];
$name = $topic['name'];
$description = $topic['description'];
}
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['topic-edit'])){
$name = trim($_POST['name']);
91
$description = trim($_POST['description']);
if($name === '' || $description === ''){
$errMsg = "Не всі поля заповнені!";
}elseif (mb_strlen($name, 'UTF8') < 2){
$errMsg = "Категорія має бути більше 2-х символів";
}else{
$topic = [
'name' => $name,
'description' => $description
];
$id = $_POST['id'];
$topic_id = update('topics', $id, $topic);
header('location: ' . BASE_URL . 'admin/topics/index.php');
}
}
// Видалення категорії
if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['del_id'])){
$id = $_GET['del_id'];
delete('topics', $id);
header('location: ' . BASE_URL . 'admin/topics/index.php');
}
Users.php
<?php
include SITE_ROOT . "/app/database/db.php";
$errMsg = [];
function userAuth($user){
$_SESSION['id'] = $user['id'];
$_SESSION['login'] = $user['username'];
$_SESSION['admin'] = $user['admin'];
if($_SESSION['admin']){
header('location: ' . BASE_URL . "admin/posts/index.php");
}else{
header('location: ' . BASE_URL);
}
}
$users = selectAll('users');
// Код для формы регистрации
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['button-reg'])){
$admin = 0;
$login = trim($_POST['login']);
92
$email = trim($_POST['mail']);
$passF = trim($_POST['pass-first']);
$passS = trim($_POST['pass-second']);
if($login === '' || $email === '' || $passF === ''){
array_push($errMsg, "Не всі заповненні поля!");
}elseif (mb_strlen($login, 'UTF8') < 2){
array_push($errMsg, "Логін повинен бути більше 2-х символів");
}elseif ($passF !== $passS) {
array_push($errMsg, "Паролі не співпадають!");
}else{
$existence = selectOne('users', ['email' => $email]);
if($existence['email'] === $email){
array_push($errMsg, "Користувач з такою поштою зареєстрований!");
}else{
$pass = password_hash($passF, PASSWORD_DEFAULT);
$post = [
'admin' => $admin,
'username' => $login,
'email' => $email,
'password' => $pass
];
$id = insert('users', $post);
$user = selectOne('users', ['id' => $id] );
userAuth($user);
}
}
}else{
$login = '';
$email = '';
}
// Код для формы авторизации
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['button-log'])){
$email = trim($_POST['mail']);
$pass = trim($_POST['password']);
if($email === '' || $pass === '') {
array_push($errMsg, "Не всі заповненні поля!");
}else{
$existence = selectOne('users', ['email' => $email]);
if($existence && password_verify($pass, $existence['password'])){
userAuth($existence);
}else{
array_push($errMsg, "Пошта або пароль введені невірно!");
}
}
}else{
$email = '';
93
}
// Код добавления пользователя в админке
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['create-user'])){
$admin = 0;
$login = trim($_POST['login']);
$email = trim($_POST['mail']);
$passF = trim($_POST['pass-first']);
$passS = trim($_POST['pass-second']);
if($login === '' || $email === '' || $passF === ''){
array_push($errMsg, "Не всі заповненні поля!");
}elseif (mb_strlen($login, 'UTF8') < 2){
array_push($errMsg, "Логін повинен бути більше 2-х символів");
}elseif ($passF !== $passS) {
array_push($errMsg, "Паролі не співпадають!");
}else{
$existence = selectOne('users', ['email' => $email]);
if($existence['email'] === $email){
array_push($errMsg, "Користувач з такою поштою зареєстрований!");
}else{
$pass = password_hash($passF, PASSWORD_DEFAULT);
if (isset($_POST['admin'])) $admin = 1;
$user = [
'admin' => $admin,
'username' => $login,
'email' => $email,
'password' => $pass
];
$id = insert('users', $user);
$user = selectOne('users', ['id' => $id] );
userAuth($user);
}
}
}else{
$login = '';
$email = '';
}
// Код удаления пользователя в админке
if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['delete_id'])){
$id = $_GET['delete_id'];
delete('users', $id);
header('location: ' . BASE_URL . 'admin/users/index.php');
}
// РЕДАКТИРОВАНИЕ ПОЛЬЗОВАТЕЛЯ ЧЕРЕЗ АДМИНКУ
if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['edit_id'])){
94
$user = selectOne('users', ['id' => $_GET['edit_id']]);
$id = $user['id'];
$admin = $user['admin'];
$username = $user['username'];
$email = $user['email'];
}
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['update-user'])){
$id = $_POST['id'];
$mail = trim($_POST['mail']);
$login = trim($_POST['login']);
$passF = trim($_POST['pass-first']);
$passS = trim($_POST['pass-second']);
$admin = isset($_POST['admin']) ? 1 : 0;
if($login === ''){
array_push($errMsg, "Не всі заповненні поля!");
}elseif (mb_strlen($login, 'UTF8') < 2){
array_push($errMsg, "Логін повинен бути більше 2-х символів");
}elseif ($passF !== $passS) {
array_push($errMsg, "Паролі не співпадають!");
}else{
$pass = password_hash($passF, PASSWORD_DEFAULT);
if (isset($_POST['admin'])) $admin = 1;
$user = [
'admin' => $admin,
'username' => $login,
// 'email' => $mail,
'password' => $pass
];
$user = update('users', $id, $user);
header('location: ' . BASE_URL . 'admin/users/index.php');
}
}if (isset($user) && is_array($user)) {
$id = $user['id'];
$admin = $user['admin'];
$username = $user['username'];
$email = $user['email'];
} else {
// Виконайте дії, коли змінна $user не існує або є null
}
//if($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['pub_id'])){
// $id = $_GET['pub_id'];
// $publish = $_GET['publish'];
//
95
// $postId = update('posts', $id, ['status' => $publish]);
//
// header('location: ' . BASE_URL . 'admin/posts/index.php');
// exit();
//}
Адмін панель коментарів
Edit.php
<?php
include "../../path.php";
include "../../app/controllers/commentaries.php";
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="../../assets/css/admin.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Адмін панель</title>
</head>
<body>
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
96
<div class="posts col-9">
<div class="row title-table">
<h2>Редагувуння коментарів</h2>
</div>
<div class="row add-post">
<div class="mb-12 col-12 col-md-12 err">
<!-- Вивід масива з помилками -->
<?php include "../../app/helps/errorInfo.php"; ?>
</div>
<form action="edit.php" method="post">
<input type="hidden" name="id" value="<?=$id; ?>">
<div class="col mb-4">
<input value="<?=$email?>" name="title" type="text" disabled
class="form-control" placeholder="Title" aria-label="Назва допису">
</div>
<div class="col">
<label for="editor" class="form-label">Коментар</label>
<textarea name="content" id="editor" class="form-control" rows="6">
<?=$text1?>
</textarea>
</div>
<div class="form-check">
<?php if($pub) $checked = "checked"; else $checked = "";?>
<input name="publish" class="form-check-input" type="checkbox"
id="flexCheckChecked" <?=$checked;?> >
<label class="form-check-label" for="flexCheckChecked">
Публікувати
</label>
</div>
<div class="col col-6">
<button name="edit_comment" class="btn btn-primary"
type="submit">Зберегти</button>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
97
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Добавление визуального редактора к текстовому полю админки -->
<script src="https://cdn.ckeditor.com/ckeditor5/27.0.0/classic/ckeditor.js"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
<script src="../../assets/js/scripts.js"></script>
</body>
</html>
Index.php
<?php
include "../../path.php";
include "../../app/controllers/commentaries.php";
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="../../assets/css/admin.css">
98
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Адмін панель</title>
</head>
<body>
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
<div class="posts col-9">
<div class="row title-table">
<h2>Керування коментарями</h2>
<div class="mb-12 col-12 col-md-12 err">
<?php if (isset($_SESSION['error'])) : ?>
<p><?= htmlspecialchars($_SESSION['error'], ENT_QUOTES, 'UTF-8'); ?></p>
<?php endif; ?>
</div>
<div class="col-1">ID</div>
<div class="col-5">Текст</div>
<div class="col-2">Автор</div>
<div class="col-4">Керувати</div>
</div>
<?php foreach ($commentsForAdm as $key => $comment): ?>
<div class="row post">
<div class="id col-1"><?=$comment['id']; ?></div>
<div class="title col-5"><?=mb_substr($comment['comment'], 0, 50,
'UTF-8'). '...' ?></div>
<?php
$user = $comment['email'];
$user = explode('@', $user);
$user = $user[0];
?>
<div class="author col-3"><?=$user . "@"; ?></div>
<div class="red col-1"><a
href="edit.php?id=<?=$comment['id'];?>">edit</a></div>
<div class="del col-1"><a
href="edit.php?delete_id=<?=$comment['id'];?>">delete</a></div>
<?php if ($comment['status']): ?>
<div class="status col-1"><a
href="edit.php?publish=0&pub_id=<?=$comment['id'];?>">unpublish</a></div>
<?php else: ?>
<div class="status col-1"><a
href="edit.php?publish=1&pub_id=<?=$comment['id'];?>">publish</a></div>
<?php endif; ?>
</div>
<?php endforeach; ?>
99
</div>
</div>
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Пости
Create.php
<?php
include "../../path.php";
include "../../app/controllers/posts.php";
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
100
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="../../assets/css/admin.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Адмін панель</title>
</head>
<body>
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
<div class="posts col-9">
<div class="button row">
<a href="<?php echo BASE_URL . "admin/posts/create.php";?>" class="col-2
btn btn-success">Створити</a>
<span class="col-1"></span>
<a href="<?php echo BASE_URL . "admin/posts/index.php";?>" class="col-3
btn btn-warning">Редагувати</a>
</div>
<div class="row title-table">
<h2>Добавити допис</h2>
</div>
<div class="row add-post">
<div class="mb-12 col-12 col-md-12 err">
<!-- Вивід масива з помилками -->
<?php include "../../app/helps/errorInfo.php"; ?>
</div>
<form action="create.php" method="post" enctype="multipart/form-data">
<div class="col mb-4">
<input value="<?=$title; ?>" name="title" type="text"
class="form-control" placeholder="Title" aria-label="Назва допису">
</div>
<div class="col">
<label for="editor" class="form-label">Заповнення допису</label>
<textarea name="content" id="editor" class="form-control"
rows="6"><?=$content; ?></textarea>
101
</div>
<div class="input-group col mb-4 mt-4">
<input name="img" type="file" class="form-control"
id="inputGroupFile02">
<label class="input-group-text"
for="inputGroupFile02">Upload</label>
</div>
<select name="topic" class="form-select mb-2" aria-label="Default
select example">
<option selected>Категорія допису:</option>
<?php foreach ($topics as $key => $topic): ?>
<option value="<?=$topic['id'];
?>"><?=$topic['name'];?></option>
<?php endforeach; ?>
</select>
<div class="form-check">
<input name="publish" class="form-check-input" type="checkbox"
value="1" id="flexCheckChecked" checked>
<label class="form-check-label" for="flexCheckChecked">
На головну
</label>
</div>
<div class="col col-6">
<button name="add_post" class="btn btn-primary"
type="submit">Добавити допис</button>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Добавление визуального редактора к текстовому полю админки -->
<script src="https://cdn.ckeditor.com/ckeditor5/27.0.0/classic/ckeditor.js"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
102
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
<script src="../../assets/js/scripts.js"></script>
</body>
</html>
Edit.php
<?php
include "../../path.php";
include "../../app/controllers/posts.php";
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="../../assets/css/admin.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Адмін панель</title>
</head>
<body>
103
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
<div class="posts col-9">
<div class="row title-table">
<h2>Редагування допису</h2>
</div>
<div class="row add-post">
<div class="mb-12 col-12 col-md-12 err">
<!-- Вивід масива з помилками -->
<?php include "../../app/helps/errorInfo.php"; ?>
</div>
<form action="edit.php" method="post" enctype="multipart/form-data">
<input type="hidden" name="id" value="<?=$id; ?>">
<div class="col mb-4">
<input value="<?=$post['title']; ?>" name="title" type="text"
class="form-control" placeholder="Title" aria-label="Назва допису">
</div>
<div class="col">
<label for="editor" class="form-label">Наповнення допису</label>
<textarea name="content" id="editor" class="form-control"
rows="6"><?=$post['content']; ?></textarea>
</div>
<div class="input-group col mb-4 mt-4">
<input name="img" type="file" class="form-control"
id="inputGroupFile02">
<label class="input-group-text"
for="inputGroupFile02">Upload</label>
</div>
<select name="topic" class="form-select mb-2" aria-label="Default select
example">
<?php foreach ($topics as $key => $topic): ?>
<option value="<?=$topic['id'];
?>"><?=$topic['name'];?></option>
<?php endforeach; ?>
</select>
<div class="form-check">
<?php if (empty($publish) && $publish == 0): ?>
<input name="publish" class="form-check-input" type="checkbox"
id="flexCheckChecked">
<label class="form-check-label" for="flexCheckChecked">
Публікація
</label>
<?php else: ?>
104
<input name="publish" class="form-check-input" type="checkbox"
id="flexCheckChecked" checked>
<label class="form-check-label" for="flexCheckChecked">
Публікація
</label>
<?php endif; ?>
</div>
<div class="col col-6">
<button name="edit_post" class="btn btn-primary"
type="submit">Зберегти</button>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Добавление визуального редактора к текстовому полю админки -->
<script src="https://cdn.ckeditor.com/ckeditor5/27.0.0/classic/ckeditor.js"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
<script src="../../assets/js/scripts.js"></script>
</body>
</html>
Index.php
105
<?php
include "../../path.php";
include "../../app/controllers/posts.php";
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="../../assets/css/admin.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Адмін панель</title>
</head>
<body>
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
<div class="posts col-9">
<div class="button row">
<a href="<?php echo BASE_URL . "admin/posts/create.php";?>" class="col-2
btn btn-success">Створити</a>
<span class="col-1"></span>
<a href="<?php echo BASE_URL . "admin/posts/index.php";?>" class="col-3
btn btn-warning">Редагувати</a>
</div>
<div class="row title-table">
<h2>Керування дописами</h2>
<div class="mb-12 col-12 col-md-12 err">
106
<?php if (isset($_SESSION['error'])) : ?>
<p><?= $_SESSION['error']; ?></p>
<?php endif; ?>
</div>
<div class="col-1">ID</div>
<div class="col-5">Назва</div>
<div class="col-2">Автор</div>
<div class="col-4">Керування</div>
</div>
<?php foreach ($postsAdm as $key => $post): ?>
<div class="row post">
<div class="id col-1"><?=$key + 1; ?></div>
<div class="title col-5"><?=mb_substr($post['title'], 0, 50, 'UTF-
8'). '...' ?></div>
<div class="author col-2"><?=$post['username']; ?></div>
<div class="red col-1"><a
href="edit.php?id=<?=$post['id'];?>">edit</a></div>
<div class="del col-1"><a
href="edit.php?delete_id=<?=$post['id'];?>">delete</a></div>
<?php if ($post['status']): ?>
<div class="status col-2"><a
href="edit.php?publish=0&pub_id=<?=$post['id'];?>">unpublish</a></div>
<?php else: ?>
<div class="status col-2"><a
href="edit.php?publish=1&pub_id=<?=$post['id'];?>">publish</a></div>
<?php endif; ?>
</div>
<?php endforeach; ?>
</div>
</div>
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
107
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Пости
Create.php
<?php
include "../../path.php";
include "../../app/controllers/topics.php";
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="../../assets/css/admin.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Адмін панель</title>
</head>
<body>
108
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
<div class="posts col-9">
<div class="button row">
<a href="<?php echo BASE_URL . "admin/topics/create.php";?>" class="col-
2 btn btn-success">Створити</a>
<span class="col-1"></span>
<a href="<?php echo BASE_URL . "admin/topics/index.php";?>" class="col-3
btn btn-warning">Редагувати</a>
</div>
<div class="row title-table">
<h2>Створити категорію</h2>
</div>
<div class="row add-post">
<div class="mb-12 col-12 col-md-12 err">
<p><?=$errMsg?></p>
</div>
<form action="create.php" method="post">
<div class="col">
<input name="name" value="<?=$name;?>" type="text" class="form-
control" placeholder="Назва категорії" aria-label="Назва категорії">
</div>
<div class="col">
<label for="content" class="form-label">Опис категорії</label>
<textarea name="description" class="form-control" id="content"
rows="3"><?=$description;?></textarea>
</div>
<div class="col">
<button name="topic-create" class="btn btn-primary"
type="submit">Створити категорію</button>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
109
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Edit.php
<?php session_start();
include "../../path.php";
include "../../app/controllers/topics.php";
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="../../assets/css/admin.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
110
<title>Адмін панель</title>
</head>
<body>
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
<div class="posts col-9">
<div class="button row">
<a href="<?php echo BASE_URL . "admin/topics/create.php";?>" class="col-2
btn btn-success">Створити</a>
<span class="col-1"></span>
<a href="<?php echo BASE_URL . "admin/topics/index.php";?>" class="col-3 btn
btn-warning">Редагувати</a>
</div>
<div class="row title-table">
<h2>Обновлення категорії</h2>
</div>
<div class="row add-post">
<div class="mb-12 col-12 col-md-12 err">
<p><?=$errMsg?></p>
</div>
<form action="edit.php" method="post">
<input name="id" value="<?=$id;?>" type="hidden">
<div class="col">
<input name="name" value="<?=$name;?>" type="text" class="form-
control" placeholder="Назва категорії" aria-label="Назва категорії">
</div>
<div class="col">
<label for="content" class="form-label">Опис категорії</label>
<textarea name="description" class="form-control" id="content"
rows="3"><?=$description;?></textarea>
</div>
<div class="col">
<button name="topic-edit" class="btn btn-primary"
type="submit">Обновити категорію</button>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
111
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Index.php
<?php session_start();
include "../../path.php";
include "../../app/controllers/topics.php";
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
112
<link rel="stylesheet" href="../../assets/css/admin.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Адмін панель</title>
</head>
<body>
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
<div class="posts col-9">
<div class="button row">
<a href="<?php echo BASE_URL . "admin/topics/create.php";?>" class="col-
2 btn btn-success">Створити</a>
<span class="col-1"></span>
<a href="<?php echo BASE_URL . "admin/topics/index.php";?>" class="col-3
btn btn-warning">Редагувати</a>
</div>
<div class="row title-table">
<h2>Керування категоріями</h2>
<div class="col-1">ID</div>
<div class="col-5">Назва</div>
<div class="col-4">Керування</div>
</div>
<?php foreach ($topics as $key => $topic): ?>
<div class="row post">
<div class="id col-1"><?=$key + 1; ?></div>
<div class="title col-5"><?=$topic['name']; ?></div>
<div class="red col-2"><a href="edit.php?id=<?=$topic['id'];
?>">edit</a></div>
<div class="del col-2"><a href="index.php?del_id=<?=$topic['id'];
?>">delete</a></div>
</div>
<?php endforeach; ?>
</div>
</div>
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
113
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Користувачі
Create.php
<?php session_start();
include "../../path.php";
include "../../app/controllers/users.php";
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="../../assets/css/admin.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
114
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Адмін панель</title>
</head>
<body>
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
<div class="posts col-9">
<div class="button row">
<a href="<?php echo BASE_URL . "admin/users/create.php";?>" class="col-2
btn btn-success">Створити</a>
<span class="col-1"></span>
<a href="<?php echo BASE_URL . "admin/users/index.php";?>" class="col-3
btn btn-warning">Редагувати</a>
</div>
<div class="row title-table">
<h2>Створити користувача</h2>
</div>
<div class="row add-post">
<div class="mb-12 col-12 col-md-12 err">
<!-- Вивід масива з помилками -->
<?php include "../../app/helps/errorInfo.php"; ?>
</div>
<form action="create.php" method="post">
<div class="col">
<label for="formGroupExampleInput" class="form-label">Ваш
логін</label>
<input name="login" value="<?=$login?>" type="text" class="form-
control" id="formGroupExampleInput" placeholder="Введіть логін">
</div>
<div class="col">
<label for="exampleInputEmail1" class="form-label">E-
mail</label>
<input name="mail" value="<?=$email?>" type="email" class="form-
control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Введіть ваш
e-mail">
</div>
<div class="col">
<label for="exampleInputPassword1" class="form-
label">Пароль</label>
<input name="pass-first" type="password" class="form-control"
id="exampleInputPassword1" placeholder="Введіть пароль">
</div>
<div class="col">
115
<label for="exampleInputPassword2" class="form-label">Повторити
пароль</label>
<input name="pass-second" type="password" class="form-control"
id="exampleInputPassword2" placeholder="Повторити пароль">
</div>
<input name="admin" class="form-check-input" value="1"
type="checkbox" id="flexCheckChecked">
<label class="form-check-label" for="flexCheckChecked">
Admin?
</label>
<div class="col">
<button name="create-user" class="btn btn-primary"
type="submit">Створити</button>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Edit.php
116
<?php session_start();
include "../../path.php";
include "../../app/controllers/users.php";
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
<!-- Custom Styling -->
<link rel="stylesheet" href="../../assets/css/admin.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Адмін панель</title>
</head>
<body>
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
<div class="posts col-9">
<div class="button row">
<a href="<?php echo BASE_URL . "admin/users/create.php";?>" class="col-2 btn
btn-success">Створити</a>
<span class="col-1"></span>
<a href="<?php echo BASE_URL . "admin/users/index.php";?>" class="col-3 btn
btn-warning">Редагувати</a>
</div>
<div class="row title-table">
<h2>Створити користувача</h2>
</div>
117
<div class="row add-post">
<div class="mb-12 col-12 col-md-12 err">
<!-- Вивід масива з помилками-->
<?php include "../../app/helps/errorInfo.php"; ?>
</div>
<form action="edit.php" method="post">
<input name="id" value="<?=$id;?>" type="hidden">
<div class="col">
<label for="formGroupExampleInput" class="form-label">Логін</label>
<input name="login" value="<?=$username;?>" type="text" class="form-
control" id="formGroupExampleInput" placeholder="Введіть логін">
</div>
<div class="col">
<label for="exampleInputEmail1" class="form-label">E-mail</label>
<input name="mail" value="<?=$email;?>" type="email" class="form-
control" readonly id="exampleInputEmail1" aria-describedby="emailHelp"
placeholder="Введіть ваш e-mail">
</div>
<div class="col">
<label for="exampleInputPassword1" class="form-label">Скинути
пароль</label>
<input name="pass-first" type="password" class="form-control"
id="exampleInputPassword1" placeholder="Введіть пароль">
</div>
<div class="col">
<label for="exampleInputPassword2" class="form-label">Повторити
пароль</label>
<input name="pass-second" type="password" class="form-control"
id="exampleInputPassword2" placeholder="Повторити пароль">
</div>
<input name="admin" class="form-check-input" value="1" type="checkbox"
id="flexCheckChecked">
<label class="form-check-label" for="flexCheckChecked">
Admin?
</label>
<div class="col">
<button name="update-user" class="btn btn-primary"
type="submit">Обновити</button>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
118
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
</html>
Index.php
<?php session_start();
include "../../path.php";
include "../../app/controllers/users.php"
?>
<!doctype html>
<html lang="ua">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-
BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
crossorigin="anonymous">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-
fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr"
crossorigin="anonymous">
119
<!-- Custom Styling -->
<link rel="stylesheet" href="../../assets/css/admin.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link
href="https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&displa
y=swap" rel="stylesheet">
<title>Адмін панель</title>
</head>
<body>
<?php include("../../app/include/header-admin.php"); ?>
<div class="container">
<?php include "../../app/include/sidebar-admin.php"; ?>
<div class="posts col-9">
<div class="button row">
<a href="<?php echo BASE_URL . "admin/users/create.php";?>" class="col-2
btn btn-success">Створити</a>
<span class="col-1"></span>
<a href="<?php echo BASE_URL . "admin/users/index.php";?>" class="col-3
btn btn-warning">Редагувати</a>
</div>
<div class="row title-table">
<h2>Користувачі</h2>
<div class="col-1">ID</div>
<div class="col-2">Логін</div>
<div class="col-3">E-mail</div>
<div class="col-2">Роль</div>
<div class="col-4">Керування</div>
</div>
<?php foreach ($users as $key => $user): ?>
<div class="row post">
<div class="col-1"><?=$user['id'];?></div>
<div class="col-2"><?=$user['username'];?></div>
<div class="author col-3"><?=$user['email'];?></div>
<?php if ($user['admin'] == 1): ?>
<div class="col-2">Admin</div>
<?php else: ?>
<div class="col-2">User</div>
<? endif; ?>
<div class="red col-2"><a
href="edit.php?edit_id=<?=$user['id'];?>">edit</a></div>
<div class="del col-2"><a
href="index.php?delete_id=<?=$user['id'];?>">delete</a></div>
</div>
<?php endforeach; ?>
</div>
</div>
120
</div>
<!-- footer -->
<?php include("../../app/include/footer.php"); ?>
<!-- // footer -->
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-
b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]
beta2/dist/js/bootstrap.min.js" integrity="sha384-
nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG"
crossorigin="anonymous"></script>
-->
</body>
121
ДОДАТОК В
ОНЛАЙН – РЕСУРС СПОРТИВНИХ НОВИН
ІНСТРУКЦІЯ КОРИСТУВАЧА
482. ЧДТУ. 32283-01 34 01
Листів 3
Розробник _____________ Баштан Р.В.
Черкаси – 2024
122
Онлайн-ресур був розроблений таким чином, що включає в себе дві основні ролі
користувача для додатку:
− Користувач: (користувач).
− Адміністратор: (адміністратор ресурсу онлайн).
Авторизація / як Користувач зареєструється у онлайн-ресурсі, ввівши потрібну
інформацію у формі реєстрації. Після реєстрації покупець зможе увійти на сайт. При
цьому буде інструкція: «Введіть логін», «Введіть e-mail», «Введіть пароль»,
«Повторіть пароль», натистути «Реєстрація »щоб зареєструватися в ресурсі.
На рис. В.1 представлено процес «Реєстрація».
Рисунок В.1 – Процес «Реєстрація»
Після успішної реєстрації можна перейти до авторизації. Якщо є акаунт з
доступом до адміністратора, то у шапці акаунта можна побачити кнопку Адмін
панель(рис. В.2).
Рисунок В.2 – Процес «Авторизація»
123
Після авторизації потрапляємо до головної сторінкиресурсу, де можемо бачити
шапку, головні новини та самі новини. (рис. В.3).
Рисунок В.3 – Головна сторінка додатку
На рис В.4 зображено Адміністративну панель. У верхній його частині шапка,
потім йдуть додавання запису, користувачів, редагування видалення кометтарів,
додавання категорій, В нижній частині – футер сторінки.
Рисунок В.4 –Адміністративна панель
124
ДОДАТОК Г
ОНЛАЙН – РЕСУРС СПОРТИВНИХ НОВИН
Структура бази даних
482. ЧДТУ. 32283-01 90 01
Листів 3
Розробник _____________ Баштан Р.В.
Черкаси – 2024
125
Рисунок Г.1 – Структура бази даних коментарі
Рисунок Г.2 – Структура бази даних публікацій
126
Рисунок Г.3 – Таблиця категорій спорту
Рисунок Г.4 – Структура бази даних користувачі