Привіт, світе
These docs are old and won’t be updated. Go to react.dev for the new React docs.
See Quick Start for an introduction to React.
Найменший приклад React виглядає наступним чином:
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<h1>Hello, world!</h1>);На сторінці з’явиться заголовок “Hello, world!”
Натисніть на посилання вище, щоб відкрити онлайн-редактор. Спробуйте відредагувати код і подивіться, як зміниться результат. Більшість сторінок цього посібника матимуть такі інтерактивні приклади.
Як читати цей посібник
У цьому посібнику ми розглянемо будівельні блоки React-додатків: елементів і компонентів. Засвоївши їх, ви зможете створювати складні додатки з невеликих повторно використовуваних частин.
Порада
Цей посібник призначений для людей, які віддають перевагу вивченню базових понять крок за кроком. Якщо ви віддаєте перевагу вчитися на практиці, ознайомтеся з нашим практичним навчальним посібником. Практичний навчальний підручник і цей посібник чимось доповнюють один одного.
Це перший розділ покрокового посібника про основні поняття React. Ви можете знайти перелік усіх його розділів на боковій панелі навігації. Якщо ви читаєте посібник з мобільного пристрою, відкрити навігаційне меню можна натиснувши кнопку в правому нижньому кутку екрану.
Кожен розділ у цьому посібнику базується на знаннях з попередніх розділів. Більшу частину React можна вивчити, прочитавши розділи посібника «Основні поняття» в тому порядку, в якому вони перераховані на бічній панелі. Наприклад, “Вступ до JSX” - наступний розділ.
Необхідний рівень знань
React - це бібліотека JavaScript, тому ми припускаємо, що у вас є базове розуміння мови JavaScript. Якщо ви відчуваєте себе не дуже впевнено, ми радимо переглянути JavaScript посібник, щоб перевірити свій рівень знань; це полегшить читання посібника по React. Це може зайняти від 30 хвилин до години, але в результаті у вас не буде відчуття, що ви одночасно вивчаєте і React, і JavaScript.
Примітка
У прикладах посібника іноді використовуються новий синтаксис JavaScript. Якщо ви не працювали з JavaScript протягом останніх кількох років, ці три пункти допоможуть вам.
Починаємо!
Прокрутіть сторінку трохи нижче безпосередньо перед нижнім колонтитулом веб-сайту, щоб знайти посилання до наступного розділу цього посібника.