Программное обеспечениеПохожие презентации:
Загальні принципи веб-розробки
1. Загальні принципи веб-розробки
1.2.
3.
4.
Мета розробки
Формат розробки
Графічне оформлення
Потенційна аудиторія і пропускна
спроможність
5. Статистичні дані і маркетинг
2. Програмне забезпечення
Для максимальної сумісності розробоквикористовуємо програмні пакети типу
• Openserver
• Denwer
які містять
• Веб-сервер Apache (1.3, 2.2, тощо)
• Інтерпретатор PHP (зазвичай 5.х, можна 7.х)
• Сервер баз даних MySQL (зазвичай 5.х)
Дозволено власні ПЗ, роботу яких забезпечуєте
самостійно на власному обладнанні.
3. Витоки HTML
В 1989 році Тім Бернерс-Лі запропонував дляорганізації CERN проект розподіленої гіпертекстової
системи під назвою World Wide Web для об’єднання
всіх інфоресурсів CERN в єдину інформаційну систему
Основні компоненти системи:
• Електронна пошта
• Система файлових архівів
• Гіпертекстовий масив інформації
4. Що таке HTML
HTML – мова гіпертекстової розмітки на основіSGML – мови розмітки друкованих документів
Навіщо?
• Спрощення процесу створення документів
• Забезпечення інтерфейсів взаємодії систем та
користувачів
5. Інтерпретатор HTML
Функції інтерпретатора розділені між вебсервером, на якому зберігаються документи, таінтерфейсом користувача:
• Сервер забезпечує передпроцесорну обробку
документів,
• Інтерфейс користувача інтерпретує мовні
конструкції для представлення інформації
6. Принцип роботи HTML
HTML – описова мова розмітки документів.Документ є сукупністю контейнерів, що
починаються і закінчуються тегами.
Тег (англ. tag) – вказівник розмітки, що міститься
в кутових дужках "<" i ">“, і містить ім’я тега, за
яким може іти список атрибутів тега.
Приклад:
<ім’я_тега список_атрибутів_через_пробіл>
вміст контейнера </ім’я_тега>
7. Спецсимволи HTML
""
&
&
<
<
>
>
 
Спецсимволи дозволяють візуалізовувати технічні
символи, що використовуються для запису тегів.
8. Групи тегів HTML
1. Структурні – визначають будову документа2. Форматувальні – для інформаційних блоків
гіпертексту
3. Спрямовуючі – для посилань і закладок
4. Інтерактивні – для форм
5. Командні – для виклику програм
9. Призначення CSS
Розширення можливостей візуалізації документівв рамках декларативного характеру розмітки із
збереженням контролю над формою
представлення елементів HTML-розмітки
Вирішення протиріч між точністю визначення
розмірів елементів і точністю визначення
розмірів блоків тексту
10. Порівняння CSS і HTML
HTML:<і>Текст курсивом? Так!</і>
Текст курсивом! Так!
HTML+CSS:
<і style="text-decoration:underline;
font-style:normal;">Текст курсивом? Ні!</і>
Текст курсивом? Ні!
11. Значення CSS для розробки
Процес розробки і супроводження веб-систем можнаформалізувати і подати у вигляді списку дій:
• Визначення номенклатури сторінок
• Для різних типів сторінок розробка логічної
структури
• Створення навігаційної карти веб-системи
• Розробка стилів відображення для стандартних
компонентів сторінки
• Створення зображень, анімацій, скриптів,
внесення текстів і графіки, генерація сторінок при
звертанні до них
12. Способи застосування CSS
Форма декларування стилю в документі і формазв’язування описання стилю відображення
елемента розмітки із самим елементом:
• Зміна стандартного стилю в елементі розмітки
• Розміщення описання стилю в заголовку
документа в елементі <STYLE>
• Розміщення посилання на зовнішнє описання
стилю через елемент <LINK>
• Імпорт описання стилю в документ
13. Зміна стандартного стилю
<H1 STYLE="font-weight:normal; font-style:italic;font-size:10pt;">
Заголовок першого рівня
</H1>
14. Елемент <STYLE>
Елемент <STYLE><HEAD>
<STYLE>
p { color:red; text-align:justify; font-size:8pt; }
</STYLE>
</HEAD>
<BODY>
<P> Приклад описання стиля для стандартного
елемента HTML-розмітки. </P>
</BODY>
15. Посилання через <LINK>
Посилання через <LINK><LINK TYPE="text/css" REL="stylesheet"
HREF="http://kpi.ua/style.css">
16. Імпорт описання стиля
<STYLE>@import url(http://kpi.ua/style.css)
A { color:cyan; text-decoration:underline; }
</STYLE>
Стаття і дискусія: чому не варто вживати @import:
https://habrahabr.ru/post/57012/
17. Cинтаксис
selector [ , selector [ , ...] ] { attribute : value ;[attribute : value ; ... ] }
АБО
selector selector [selector ... ] { attribute : value ;
[attribute : value ; ... ] }
Селектором може бути а) ім’я елемента розмітки,
б) ім’я класу, в) ідентифікатор об’єкта на сторінці,
г) їхні комбінації.
Атрибут визначає властивість елемента та
значення цієї властивості
18. Ієрархія, наслідування та зміна стандартного стиля
Ієрархічність списків стилів спричиняєнаслідування властивостей батьківського
елемента дочірніми.
19. Історія РНР
PHP було створено як інструмент для вирішенняпрактичних задач. Його автор Расмус Лердорф хотів
знати, скільки людей прочитали його online-резюме, і
написав для цього просту CGI-оболонку мовою Perl,
тобто це був набір Perl-скриптів. Пізніше оболонку
переписав на С і виклав у вільний доступ.
1995 – «РНР/FI»
1997 – «РНР/FI 2.0»
1998 – РНР 3.0
2000 – РНР 4.0 Zend Engine
2004 – PHP 5.0 Zend Engine 2
20. Можливості РНР
Три області застосування:• Серверні програми
• Програми командного рядка
• GUI-програми
Переваги:
Простота, мультиплатформенність, підтримка
ООП і ПП, робота із ФС, взаємодія по SOAP, LDAP,
SNMP, IMAP, POP3, HTTP, бібліотеки для роботи із
PDF, flash, XML, зображеннями, базами даних,
тощо.
21. Перша програма на РНР
<html><head><title>Перша програма на РНР</title></head>
<body>
<?php
echo "<p>Вітаю слухачів першої лекції!</p>";
?>
</body>
</html>
22. Основний синтаксис
Початок і закінчення коду РНР<?php
?>
Розділення конструкцій
echo "Hello, world!";
Коментування коду
// коментар ремарка пояснення 1
# коментар ремарка пояснення 2
/* коментар ремарка
пояснення 3 */
23. Імена змінних
$variable1$Variable1
$VARIABLE1
Коректне ім’я змінної має починатися з букви або
символа підкреслення з наступними в будь-якій
кількості буквами (рекомендую латиницю для
уникнення прихованих артефактів), цифрами або
символами підкреслення.
24. Присвоєння значень змінним
$var1 = ' Value ';$var2 = $var1;
$var1 = ' New value ';
echo 'Змінна 1: '.$var1.' Змінна 2 : '.$var2;
В ранньому PHP змінні присвоювались по
значенню – коли ви присвоїли вираз змінній, всі
значення оригінального виразу копіюються в цю
змінну. Таким чином ми зберігаємо оригінальний
вираз незмінним.
25. Присвоєння за посиланням
$var1 = ' Value ';$var2 = &$var1;
$var1 = ' New value ';
echo "Змінна 1 : '.$var1.' Змінна 2 : '.$var2;
Щоб присвоїти значення за посиланням –
потрібно явно вказати ім’я змінної, значення якої
має присвоюватись за посиланням, із символом
амперсанд &, і зміна першої змінної
спричинятиме зміну другої змінної.
26. Константи
Для зберігання сталих величин використовуютьсяконстанти: математичні, шляхи до файлів тощо.
define("Ім'я","Значення",[Нечутливість_до_регістра])
Особливості:
• встановлюється функцією define(),
• значення встановлюється лише один раз,
• неможливо анулювати після встановлення,
• не має символа $.
define("Pі","3.14", True);
echo pi;
27. Константи інтерпретатора
В PHP існують наперед встановлені константиинтерпретатора РНР:
• __FILE__ містить ім'я і шлях до файла
виконуваного в даний момент скрипта,
• __FUNCTION__ містить ім'я функції,
• __CLASS__ містить ім'я класу,
• PHP_VERSION містить версію PHP.
Повний список наперед встановлених констант
дивіться в документації PHP.
28. Оператори
Оператори дозволяють виконувати дії надзмінними, константами і виразами. Розрізняють:
• арифметичні оператори,
• рядковий оператор,
• оператори присвоєння,
• логічні оператори,
• оператори порівняння,
• оператори інкремента і декремента.
29. Арифметичні оператори
Арифметичні оператори:Позначка
+
*
/
%
Назва
Додавання
Віднімання
Множення
Ділення
Остача від
ділення
Приклад
$a + $b
$a - $b
$a * $b
$a / $b
$a % $b
30. Рядковий оператор
Рядковий оператор:Позначка
.
Назва
Приклад
Конкатенація $c = $a . $b
31. Оператори присвоєння
Оператори присвоєнняПозначка
=
+=
.=
Назва
Присвоєння
Присвоєння із
збільшенням
Присвоєння із
конкатенацією
Приклад
$a = 2;
$a += 5;
$a = "текст1 ";
$a .= "текст2";
32. Логічні оператори
Логічні оператори:Позначка
and (&&)
Назва
І
or (||)
Або
xor
Виключення (oдна із
змінних істинна)
Інверсія (not)
!
Приклад
$a and $b
$a && $b
$a or $b
$a || $b
$a xor $b
! $a
33. Оператори порівняння
Оператори порівняння:Позначка
Назва
Приклад
==
Рівність
$a == $b
===
!= або <>
Еквівалентність
Нерівність
$a === $b
$a != $b
$a <> $b
!==
<
>
<=
>=
Нееквівалентність
Менше
Більше
Менше або рівне
Більше або рівне
$a !== $b
$a < $b
$a > $b
$a <= $b
$a >= $b
34. Оператори інкремента і декремента
Оператори інкремента і декремента:Позначка
Назва
Приклад
++$a
Пре-інкремент
$a=2;
echo "3:".++$a;
$aa++
Пост-інкремент
$a=2;
echo "2:".$a++;
--$a
Пре-декремент
$a=2;
echo “1:".--$a;
$a--
Пост-декремент
$a=2;
echo “2:".$a--;
35. Типи даних
PHP підтримує 8 простих типів даних: скалярні,змішані і спеціальні.
boolean (логічний) ;
integer (цілий) ;
float (з плаваючою точкою) ;
string (рядковий).
array (масив) ;
object (об'єкт).
o resource (ресурс) ;
o NULL.
36. Тип boolean
Виражає істинність значення, може мати лишедва значення – TRUE або FALSE .
Щоб встановити тип, використовують ключове
слово TRUE або FALSE, регістронезалежні:
<?php
$test = True;
?>
37. Тип integer
Задає число із множини цілих чисел Z = {..., -2, -1, 0, 1, 2,...}. Можна вказувати в 10-вій, 16-вій або 8-вій системі
числення.
<?php
$a = 1234; $a = -123; $a = 0123; $a = 0x1A;
?>
Розмір цілого залежить від платформи, як правило
максимум біля 2 млрд (32-бітне знакове). Беззнакові цілі
PHP не підтримує.
<?php
(integer)(0.5)
?>
38. Тип float
Числа з плаваючою точкою (дійсні числа) можнавизначати так:
<?php
$a = 1.234;
$b = 1.2e3;
$c = 7E-10;
?>
Розмір числа залежить від платформи, як
правило максимум ~1.8e308 з точністю біля 14
десяткових знаків.
39. Тип string
Рядок – це набір символів. В PHP символ – цебайт, тобто існує рівно 256 різних символів. PHP
не має вбудованої підтримки Unicode. В PHP
практично не існує обмежень на розмір рядків,
тому не треба хвилюватися за їхню довжину.
Можна встановлювати трьома способами:
через одинарні лапки,
через подвійні лапки,
через heredoc-синтаксис.
40. Приклади типу string
echo 'Для виводу \' треба перед лапкоюпоставити \\';
echo 'Це не вставить \n новий рядок';
echo 'Змінні $a не підставляються';
echo “Тут ' виводиться“;
echo “Новий \n рядок “;
echo “ Змінні $a підставляються “;
41. Керуючі послідовності в рядках
\n - Новий рядок ( LF або 0x0A (10) в ASCII)\r - Повернення каретки ( CR або 0x0D (13) в ASCII)
\t - Горизонтальна табуляція ( HT або 0x09 (9) в ASCII)
\\ - Зворотній слеш
\$ - Знак долара
\“ - Подвійні лапки
42. Heredoc-синтаксис
<?php$str = <<<EOD
Рядкова змінна на двох рядках
через heredoc-синтаксис
EOD;
$world = 'світ!';
echo <<<EOD
Привіт "$world"
EOD;
?>
43. Тип array
Масив в PHP - це набір впорядкованих пар "ключ" "значення". Він різнобічно оптимізований, тому можнавикористовувати його як масив, список (вектор), хештаблицю, стек, чергу тощо. Також можна емулювати
дерева - оскільки значенням може бути інший масив працює вкладеність або ієрархічність.
Встановити масив можна конструкцією array () або
безпосередньо задаючи значення його елементів.
array (key => value,
key1 => value1, ... )
44. Тип object
Об'єкт – тип даних із ООП. Відповідно допринципів ООП, клас – це набір об'єктів з
певними властивостями і и методами роботи с
ним, а об'єкт відповідно є екземпляром класу.
В PHP для доступу до методів об'єкта
використовують оператор “->”. Для ініціації
об'єкта використовується вираз new, який
створює в змінній екземпляр об'єкта.
45. Тип resource
Ресурс – це спеціальна змінна із посиланням назовнішній ресурс (наприклад, конект до БД).
Ресурси створюються і використовуються
спеціальними функціями (mysql_connect(),
pdf_new() тощо).
46. Тип Null
Спеціальне значення NULL каже про те, щозмінна не має власного значення.
Змінна є NULL, якщо:
їй присвоєно константу NULL ( $var = NULL );
їй ще не було присвоєно яке-небудь значення;
вона була видалена з допомогою unset ().
Існує тільки одне значення типу NULL –
регістронезаоежне ключове слово NULL.