React Підручник
React — це бібліотека JavaScript для створення інтерфейсів користувача.
React використовується для створення односторінкових програм.
React дозволяє нам створювати повторно використовувані компоненти інтерфейсу користувача.
Почати вивчення React негайно ❯Навчання на прикладах
Наш інструмент "Показати React" дозволяє легко продемонструвати React. Він показує як код, так і результат.
Приклад:
import React from 'react';
import ReactDOM from 'react-dom/client';
function Hello(props) {
return <h1>Hello World!</h1>;
}
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(<Hello />);
Навчання за вправами
React Вікторина
Перевірте свої навички React за допомогою тесту.
Створити додаток React
Щоб дізнатися та протестувати React, вам слід налаштувати середовище React на вашому комп’ютері.
У цьому посібнику використовується create-react-app
.
Інструмент create-react-app
є офіційно підтримуваним способом створення програм React.
Node.js є обов’язковим для використання create-react-app
.
Відкрийте свій термінал у каталозі, де ви хочете створити програму.
Виконайте цю команду, щоб створити програму React під назвою my-react-app
:
npx create-react-app my-react-app
create-react-app
налаштує все необхідне для запуску програми React.
Примітка: Якщо ви раніше інсталювали create-react-app
глобально, радимо видалити пакет, щоб npx завжди використовував останню версію create-react-app
. Щоб видалити, виконайте цю команду: npm uninstall -g create-react-app
.
Запустіть програму React
Виконайте цю команду, щоб перейти до каталогу my-react-app
:
cd my-react-app
Виконайте цю команду, щоб запустити програму React my-react-app
:
npm start
З’явиться нове вікно браузера з новоствореною програмою React! Якщо ні, відкрийте браузер і в адресному рядку введіть localhost:3000
.
Результат:
create-react-app
у розділі React Початок роботи.Що ви вже повинні знати
Перш ніж почати працювати з React.JS, ви повинні мати знання і середній досвід роботи із:
- HTML
- CSS
- JavaScript
Ви також повинні мати певний досвід роботи з новими функціями JavaScript, представленими в ECMAScript 6 (ES6), ви дізнаєтеся про них у розділі React ES6.
Розпочніть свою приголомшливу кар’єру IT-розробника!
Отримайте сертифікат, пройшовши курс!