Уроки React JS

Корисні посилання:

• Курс з React Native;
• Курс з HTML;
• Курс з CSS;
• Курс з JavaScript;
• Програма Visual Studio Code;
• Технологія Node JS.

Інформація про React JS

React є JavaScript-бібліотекою, завдяки якій ви можете керувати вмістом будь-якої веб-сторінки. React JS був розроблений компанією Facebook у 2013 році. Відтоді він значно зміцнив свої позиції на ринку і на сьогодні є однією з найпопулярніших технологій для створення веб-проєктів.

Якщо говорити коротко, то завдяки React JS ви можете створювати гнучкі, функціональні та зручні в підтримці компоненти сайту. У поняття «компонент» входить будь-яка частина вашого сайту: форма реєстрації, блок із виведенням інформації, кілька полів «input» тощо. React JS надає швидкий і зручний формат взаємодії з будь-якими блоками (компонентами) вашого веб-сайту.

React JS виконує приблизно ті самі дії, що й звичайний JS. Він обробляє дії користувача та працює на стороні клієнта. При цьому React JS робить це в більш структурованій формі та, до того ж, забезпечує потужніший функціонал при роботі з користувачем на стороні клієнта.  

На що здатний React?

React розроблений таким чином, що його можна запускати не лише в браузері, а й за його межами. Завдяки такому підходу ви отримуєте можливість створювати проєкти для різних платформ, включаючи мобільні пристрої: Android та iOS. Для розробки застосунків використовується бібліотека React Native.

По суті, ядро React описує всю основну поведінку. Далі йдуть додаткові бібліотеки, на кшталт React JS, React Native..., які слугують для створення проєктів під різні типи пристроїв.

Загальний принцип функціонування

Раніше всі сайти будувалися за простим принципом. Одна HTML-сторінка відповідала за одну сторінку сайту. Наприклад, «index.html» відповідав за головну сторінку сайту, а якась сторінка «blog.html» відповідала за сторінку з новинами на сайті.

За допомогою React ми отримуємо принцип, що називається Single Page Application (SPA) або принцип односторінкового застосунку. Ми так само маємо HTML-файл зі сторінкою сайту, але цього разу він у нас один і всі дії відбуваються на ньому.

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

Можна сказати, що подібне можна реалізувати за допомогою звичайного JS. Так, насправді це дійсно так. Звичайний JS також дозволяє змінювати вміст сторінки і можна реалізувати всі дії користувача без перезавантажень. Але великою перевагою React JS є те, що він робить усі ці маніпуляції простішими та значно приємнішими. Вам буде простіше контролювати проєкт і додавати до нього нові функції, якщо цей проєкт буде написаний на основі React JS, а не на основі чистої мови Javascript.

Що потрібно знати?

Перед вивченням курсу вам обов’язково потрібно мати хороші знання в HTML та CSS. При створенні веб-сайтів вам постійно потрібно буде прописувати HTML-теги та стилі до них, тому без цих навичок не обійтися. 

Вам потрібно володіти хоча б мінімальними знаннями мови JavaScript. Потрібно вміти працювати з масивами, циклами, умовами, функціями та іншими простими концепціями цієї мови.

У цьому курсі ми розраховуємо, що у вас уже є базові знання з React JS. У курсі не будуть зупинятися на базових моментах, тому якщо ви хочете спершу підтягнути базові знання з бібліотеки, то радимо переглянути базовий курс з React JS. 

План курсу

У ході курсу ми з вами з нуля навчимося працювати з бібліотекою React JS. Ви навчитеся створювати проєкти на її основі, навчитеся правильно маніпулювати HTML-структурою вашого веб-сайту та додатково вивчите безліч концепцій щодо роботи з React JS.

Наприкінці курсу ви розробите невеликий застосунок, який буде взаємодіяти з API стороннього сайту. У цьому застосунку буде багато користувацьких дій, а саме додавання даних, їх виведення, видалення тощо.

Отже, після завершення курсу у вас буде достатньо знань, щоб почати створювати власні проєкти на основі бібліотеки React JS.

Велика програма

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