У попередніх розділах ми ознайомилися з основами React. Тепер ми знаємо, як створювати компоненти, керувати ними, відображати інформацію та реалізовувати логіку. Однак усі ці завдання виконувалися у CodeSandbox, який чудово підходить для навчання.

А як щодо реальних проєктів? Чи всі розробники створюють проєкти у CodeSandbox? Звісно, ні. Цей розділ допоможе вам розпочати роботу над проєктом на локальному комп’ютері, крок за кроком проведе через увесь процес.

Крок 1: Встановлення Node.js та npm

Потрібно встановити Node.js та npm на локальний комп’ютер.

Node.js — це середовище виконання з відкритим кодом, яке дозволяє запускати JavaScript-код на стороні сервера.

npm (Node Package Manager) — це менеджер пакетів для Node.js, який дозволяє розробникам легко встановлювати, керувати та поширювати багаторазові пакети або модулі JavaScript-коду.

• Перейдіть на офіційний сайт Node.js: https://nodejs.org;
• Завантажте інсталятор для вашої операційної системи (Windows, macOS або Linux). Нас цікавить версія LTS, оскільки вона стабільна та працездатна;

• Запустити інсталятор і дотримуватися інструкцій з встановлення;
• Після встановлення на комп'ютері мають бути встановлені Node.js та npm (Node Package Manager).

Як перевірити, чи встановлені Node.js та npm?

Щоб перевірити, чи встановлені Node.js та npm на комп'ютері, необхідно відкрити термінал (командний рядок, PowerShell або емулятор терміналу) та виконати відповідні команди. Кроки:

1. Відкрити термінал;

• Windows: Натиснути Win + X і вибрати "Windows PowerShell" у меню. Або знайти "PowerShell" через меню Пуск;
• macOS: Перейти до "Applications" > "Utilities" > "Terminal". Також можна скористатися пошуком "Spotlight", натиснувши Cmd + Space і ввівши "Terminal";
• Linux: Зазвичай для відкриття терміналу використовується комбінація Ctrl + Alt + T у багатьох дистрибутивах Linux. Однак, залежно від конкретного дистрибутива, можуть бути й інші способи, наприклад, пошук "Terminal" у меню програм або використання іншої комбінації клавіш.

Note

Якщо жоден із цих способів не працює, рекомендується звернутися до документації або ресурсів підтримки операційної системи, щоб знайти відповідний спосіб відкриття терміналу. Також завжди можна скористатися пошуком у Google.

2. Перевірити версію Node.js;

У терміналі виконайте наступну команду.

node -v

Ця команда відобразить версію Node.js, встановлену на комп'ютері. Якщо Node.js встановлено, буде показано номер версії.

3. Перевірити версію npm.

У терміналі виконайте наступну команду.

npm -v

Ця команда відобразить версію npm, встановлену на комп'ютері. Якщо npm встановлено, буде показано номер версії.

Якщо обидві команди повертають номери версій, Node.js та npm успішно встановлені та доступні на комп'ютері. Якщо команди не розпізнаються або повертають помилку, це означає, що Node.js та/або npm не встановлені або шляхи до них налаштовані некоректно. У такому випадку слід повторити кроки встановлення Node.js і переконатися, що встановлення завершено успішно. Іноді рекомендується перезавантажити комп'ютер.

Note

Яку саме версію ми отримаємо — наразі не має значення.