Вебпрограмування [Wiki Глухівського ВПУ]

Ця сторінка доступна тільки для перегляду. Ви можете продивитися вихідний текст, але не можете змінювати його. Якщо ви вважаєте, що це не вірно, зверніться до адміністратора.
====== Вебпрограмування ======
Простими словами, веб програмування – це створення сайтів та програм, що функціонують в мережі Інтернет. Перш ніж описати всі переваги веб-програмування і для чого його використовують, потрібно, перш за все, зрозуміти що це таке. Простими словами, веб програмування – це створення сайтів та програм, що функціонують в мережі Інтернет. Усі сайти, з якими Ви щодня маєте справу, створені саме завдяки технологіям веб-програмування. Проте головна відмінність між ними полягає у наборі функцій та можливостей, які пропонує для цільової аудиторії той чи інший сайт. Сьогодні бізнес сторінки з просто красивим текстом та яскравою картинкою не привернуть увагу клієнта так, як зроблять це сайти, в основу яких покладені інтерактивні компоненти. Тобто, компоненти, які допомагають «встановити зв’язок» з потенційним користувачем і підтримувати з ним належну взаємодію. Сюди і приходять на допомогу веб-розробники, завданням яких є спроектувати живий і багатофункціональний сайт та оснастити його ефективними інтерактивними інструментами зворотнього зв’язку, підписки, розсилання і багато чим іншим.

===== Складові веб-розробки =====
Веб-програмування проводиться за допомогою спеціальних комп’ютерних програм – скриптів, які в свою чергу поділяються на **серверні** і **клієнтські**. Серверні скрипти виконуються під керуванням Web-сервера, тоді як клієнтські – під керуванням браузера (тобто комп’ютера, на якому розміщені файли сайту). Клієнтські скрипти використовуються для перевірки коректності інформації, наданої користувачами та обробки її без допомоги сервера, що значно зменшує навантаження на сервер. Дані скрипти вбудовані в html код сторінки і для їхнього функціонування потрібен лише браузер, який підтримує клієнтські скрипти. До клієнтських мов відносять такі мови програмування як **JavaScript**, **Java** і **VBScript**.

Особливої уваги серед вказаних мов заслуговує JavaScript. Це найпопулярніша клієнтська мова програмування, яку підтримують усі сучасні веб-браузери. За допомогою JavaScript сторінки сайту «оживають» і набувають нових інтерактивних рис. Зазвичай, дана мова допомагає реалізувати такі ефекти як спливаючі підказки, відображення анімації, реагування на рух курсору, поява вікон на сторінках сайту. А також JavaSсript-сценарії широко використовуються для перевірки інформації, введеної користувачем.

На відміну від клієнтських скриптів, серверні технології виконуються під керуванням веб-сервера. Принцип роботи даної технології виглядає наступним чином: коли користувач переходить на сторінку сайту, натиснувши на посилання або вводячи його в адресному рядку браузера, то першим чином сервер запускає вибрану програму на виконання і тільки після цього відвідувач може побачити оброблену сторінку у вигляді HTML документа. Серверні скрипти слугують чудовим інструментом для обробки інформації з форм заповнення, інтеграції WEB з базами даних, створення динамічних сторінок, забезпечує легку роботу з папками та файлами. Жоден інтернет-магазин не обійдеться без допомоги серверних скриптів. Адже завдяки їм, користувач зможе підрахувати загальну вартість покупки, змінювати дані у своєму купівельному кошику, вказувати час та дату замовлення та багато іншого. Серед відомих мов програмування на стороні сервера можна виділити **SQL, Perl, JAVA, Python, MySQL** та **PHP**. Проте найпопулярнішою серверною мовою програмування вважається **PHP**. Саме за допомогою мови PHP реалізовуються такі програмні компоненти як опитування, гостьові книги, продаж продуктів та інші.

===== Технології веб-програмування =====
==== Веб-дизайн ====
  * Мова розмітки HTML — це код, який використовується для структурування і відображення веб-сторінки і її контенту
  * СSS — це фактично мова стилів, яка відповідає за відображення HTML-документів. CSS працює зі шрифтами, з кольорами символів і фону, з полями, з рядками, з висотою і з шириною елементів відображення, з фоновими зображеннями, з позиціонуванням елементів і багато з чим іншим
  * SASS — це препроцесор CSS, за допомогою якого можна знизити кількість повторюваного CSS коду і заощадити час. Це більш стабільне розширення CSS, чітко і структурно описує стилі документа.
  * LESS — це надбудова над CSS. Має всі базові можливості препроцесорів і навіть більше, але не має умовних конструкцій і циклів в звичному для нас розумінні. Основним плюсом є його простота, практично стандартний для CSS синтаксис і можливість розширення функціоналу за рахунок системи плагінів
==== Програмування на стороні клієнта ==== 
  * Мова програмування JavaScript — найпопулярніша і підтримувана всіма сучасними інтернет браузерами мова програмування. Вона створена для того, щоб зробити веб-сторінки «живими». Скрипти у браузері підключаються безпосередньо до HTML і, як тільки завантажується сторінка — тут же виконуються
  * React — це бібліотека JavaScript, яка використовується для створення призначеного для користувача інтерфейсу
  * VueJS — це JavaScript бібліотека для створення веб-інтерфейсів з використанням шаблону архітектури MVVM (Model-View-ViewModel).
  * AngularJS — це JavaScript фреймворк призначений для створення односторінкових веб-додатків
  * jQuery — це бібліотека JavaScript, призначена для спрощення скриптинга при роботі з вузлами HTML-елементів в браузері або для роботи в браузері без графічного інтерфейсу
  * AJAX — це бібліотека, яка значно спрощує і прискорює написання JavaScript коду, також дозволяє працювати з усіма браузерами
==== Програмування на стороні сервера ====
  * Мова програмування PHP — найбільш популярна мова веб-програмування на стороні сервера. PHP підтримується більшістю хостинг-провайдерів
  * ASP.NET. — модель для розробки веб-додатків із застосуванням мінімуму коду, яка містить служби, необхідні для побудови веб-додатків для підприємств
  * Python — це мова програмування загального призначення, націлений в першу чергу на підвищення продуктивності самого програміста
  * Ruby on Rails — веб-орієнтоване середовище розробки з відкритим кодом, оптимізована для зручності програмування та стійкої продуктивності

===== Інтерактивні сторінки =====

**Інтерактивність** (від англ. Interaction - «взаємодія») — визначення, яке розкриває зміст і ступінь взаємодії між об'єктами. Використовується в таких галузях: теорія інформації, інформатика та програмування, системи телекомунікацій, соціологія, педагогіка, проєктування взаємодії, музейна справа, промисловий дизайн та інших.

Веб-інтерактивність відноситься до інтерактивних функцій, вбудованих у веб-сайти, які пропонують обмін інформацією або між комунікаційними технологіями та користувачами, чи між користувачами, які застосовують технології. Цей тип інтерактивності розвивається разом із новими розробками інтерфейсів веб-сайтів. Деякі інтерактивні функції передбачають гіперпосилання, зворотний зв'язок та мультимедійні дисплеї. Вікіпедія також є прикладом веб-інтерактивності, оскільки вона пишеться спільними зусиллями. Інтерактивність у нових медіа відрізняється від старих медіа тим, що забезпечує участь користувачів, а не просто пасивне споживання.

Автори веб-сторінок можуть інтегрувати **JavaScript** для створення інтерактивних веб-сторінок. Повзунки, засоби вибору дати, перетягування - це лише деякі з багатьох покращень, які можуть бути надані.

Електронне навчання використовує концепцію, яка називається моделлю взаємодії. За допомогою інтерактивної моделі будь-яка людина може створювати інтерактиви за дуже короткий проміжок часу. Деякі моделі взаємодії, представлені за допомогою засобів розробки, належать до різних категорій, таких як ігри, головоломки, засоби моделювання, засоби презентації тощо, які можна повністю налаштувати.

Під інтерактивним слід розуміти сайт, контент якого формується «на льоту», на основі даних, отриманих від відвідувача сайту і оброблених сервером . Тому поняття «інтерактивний» можна віднести до всіх сайтів, що мають форми відправки повідомлень, онлайн-анкети та опитування, реєстраційні форми, лічильники відвідувань, форми для онлайн-замовлень та інші подібні елементи.

Для реалізації інтерактивних «властивостей» сайтів застосовуються спеціальні програмні коди - серверні скрипти . Саме серверні скрипти роблять обробку отриманих від відвідувачів сайту даних і формують відповідну html-сторінку.

Для написання серверних скриптів застосовуються серверні мови веб-програмування , такі як PHP, Perl, ASP.NET. Виконується серверний скрипт на стороні сервера: відвідувач не бачить вихідного програмного коду виконуваного скрипта, а отримує тільки готову відповідь.

Створити інтерактивний сайт - значить створити сайт, що вміє «спілкуватися» зі своїми відвідувачами. Простий статичний сайт доступний лише для перегляду. Для того, щоб зв'язатися з адміністрацією сайту або ж зробити замовлення, відвідувачеві необхідно зателефонувати за вказаним у контактних даних номером телефону, написати лист на e-mail або ж відправити факс.

У той же час, інтерактивний сайт дозволяє підтримувати зв'язок між адміністрацією та відвідувачами в режимі реального часу без будь-яких допоміжних засобів - для цього є системи онлайн-консультацій, онлайн-чатів (системи миттєвого обміну повідомленнями прямо на сайті) та інші подібні інструменти.

Різні інтерактивні компоненти можуть бути ефективно використані при створенні сайтів для бізнесу . Інтерактивний сайт для бізнесу дозволяє власникам сайту отримати додатковий дохід, завдяки активному залученню клієнтів, а відвідувачам - зручний та доступний сервіс, який без сумнівів, вигідно відрізнить компанію на тлі її конкурентів.

Інтернет-магазин - найбільш типовий приклад інтерактивного сайту для бізнесу. В інтернет-магазині відвідувач може сам сформувати своє замовлення, вибравши необхідні товари і вказавши кількість придбаних одиниць.

Так званий «кошик» дозволяє розрахувати сумарну вартість замовлення, сформувати безпосередньо рахунок для оплати замовлення різними засобами. Все це виконується в режимі реального часу і користувач сам може змінювати найменування, характеристики (колір, кількість) товарів, які він купує.

Крім того, більшість сучасних інтернет-магазинів дозволяють своїм покупцям відслідковувати поточний стан замовлення: прийнятий в обробку, доставлений на склад, доставлений покупцеві і т. п.


====== Джерела ======
  * [[https://indevlab.com/uk/blog-ua/dlya-chogo-potribne-veb-programuvannya/|Для чого потрібне веб-програмування? | InDevLab]]
  * [[http://apeps.kpi.ua/web-programuvania/en|Веб-програмування | APEPS department of Igor Sikorsky KPI]]
  * [[wp>Інтерактивність]]
  * [[https://webstudio2u.net/ua/site-develop/444-interactive-site.html|Що таке інтерактивний сайт? Розробка інтерактивних сайтів]]