Fix some words usage according to translation table and issues

Author: alinkedd

src/content/learn/importing-and-exporting-components.md

@@ -52,7 +52,7 @@ img { margin: 0 10px 10px 0; height: 90px; }
 
 </Sandpack>
 
-Ці компоненти зараз знаходяться у **файлі кореневого компонента** з назвою `App.js` у цьому прикладі. Залежно від вашої конфігурації ваш кореневий компонент може бути в іншому файлі. Якщо ви використовуєте фреймворк з роутингом на основі файлів, як-от Next.js, ваш кореневий компонент буде різним для кожної сторінки.
+Ці компоненти зараз знаходяться у **файлі кореневого компонента** з назвою `App.js` у цьому прикладі. Залежно від вашої конфігурації ваш кореневий компонент може бути в іншому файлі. Якщо ви використовуєте фреймворк із маршрутизацією на основі файлів, як-от Next.js, ваш кореневий компонент буде різним для кожної сторінки.
 
 ## Експорт та імпорт компонента {/*exporting-and-importing-a-component*/}
 

src/content/learn/index.md

@@ -21,7 +21,7 @@ title: Швидкий старт
 
 ## Створення та вкладення компонентів {/*components*/}
 
-React додатки складаються з *компонентів*. Компонент це частина UI (інтерфейсу користувача), яка має власну логіку та зовнішній вигляд. Компонент може бути маленьким, як кнопка, або ж розміром з цілу сторінку.
+React-застосунки складаються з *компонентів*. Компонент це частина UI (інтерфейсу користувача), яка має власну логіку та зовнішній вигляд. Компонент може бути маленьким, як кнопка, або ж розміром з цілу сторінку.
 
 React компоненти це JavaScript функції які повертають розмітку:
 
@@ -39,7 +39,7 @@ function MyButton() {
 export default function MyApp() {
   return (
     <div>
-      <h1>Ласкаво просимо до мого додатку</h1>
+      <h1>Ласкаво просимо до мого застосунку</h1>
       <MyButton />
     </div>
   );
@@ -64,7 +64,7 @@ function MyButton() {
 export default function MyApp() {
   return (
     <div>
-      <h1>Ласкаво просимо до мого додатку</h1>
+      <h1>Ласкаво просимо до мого застосунку</h1>
       <MyButton />
     </div>
   );
@@ -77,7 +77,7 @@ export default function MyApp() {
 
 ## Написання розмітки з використанням JSX {/*writing-markup-with-jsx*/}
 
-Синтаксис розмітки, яку ви бачили вище, має назву *JSX*. Це необов'язково, але більшість React-проектів використовують JSX для зручності. Усі  [інструменти, які ми рекомендуємо для локальної розробки](/learn/installation) підтримують JSX за замовчуванням.
+Синтаксис розмітки, яку ви бачили вище, має назву *JSX*. Це необов'язково, але більшість React-проєктів використовують JSX для зручності. Усі  [інструменти, які ми рекомендуємо для локальної розробки](/learn/installation) підтримують JSX за замовчуванням.
 
 JSX більш строгий, ніж HTML. Ви зобов'язані закривати такі теги як `<br />`. Також ваш компонент не може повертати декілька JSX тегів. Ви повинні огортати їх у спільний батьківський елемент, такий як `<div>...</div>` або пусту `<>...</>` обгортку:
 
@@ -111,7 +111,7 @@ function AboutPage() {
 ```
 
 
-React не вказує, як додавати файли CSS. У найпростішому випадку ви додасте тег [`<link>`](https://webdoky.org/uk/docs/Web/HTML/Element/link) до свого HTML. Якщо ви використовуєте інструмент збірки або фреймворк, зверніться до його документації, щоб дізнатися, як додати файл CSS до вашого проекту.
+React не вказує, як додавати файли CSS. У найпростішому випадку ви додасте тег [`<link>`](https://webdoky.org/uk/docs/Web/HTML/Element/link) до свого HTML. Якщо ви використовуєте інструмент збірки або фреймворк, зверніться до його документації, щоб дізнатися, як додати файл CSS до вашого проєкту.
 
 ## Відображення даних {/*displaying-data*/}
 
@@ -383,7 +383,7 @@ button {
 
 ## Використання хуків {/*using-hooks*/}
 
-Функції, що починаються з `use`, називаються *Хуками*. `useState` — це вбудований Хук, наданий React. Ви можете знайти інші вбудовані Хуки в [API довіднику](/reference/react). Також ви можете написати власні Хуки, комбінуючи існуючі.
+Функції, що починаються з `use`, називаються *Хуками*. `useState` — це вбудований Хук, наданий React. Ви можете знайти інші вбудовані Хуки в [API довіднику](/reference/react). Також ви можете написати власні Хуки, комбінуючи наявні.
 
 Хуки є більш обмежувальними, ніж інші функції. Ви можете викликати Хуки лише *на верхньому рівні* ваших компонентів (або інших Хуків). Якщо ви хочете використовувати `useState` в умові або циклі, витягніть це в новий компонент і помістіть його туди.
 
@@ -535,4 +535,4 @@ button {
 
 Тепер ви знаєте основи написання React коду!
 
-Перегляньте [Туторіал](/learn/tutorial-tic-tac-toe) щоб застосувати їх на практиці та створити свій перший міні-додаток із React.
+Перегляньте [Туторіал](/learn/tutorial-tic-tac-toe) щоб застосувати їх на практиці та створити свій перший міні-застосунок із React.

src/content/learn/installation.md

@@ -11,7 +11,7 @@ title: Встановлення
 <YouWillLearn isChapter={true}>
 
 * [Як почати новий React-проєкт](/learn/start-a-new-react-project)
-* [Як інтегрувати React в існуючий проєкт](/learn/add-react-to-an-existing-project)
+* [Як інтегрувати React у наявний проєкт](/learn/add-react-to-an-existing-project)
 * [Як налаштувати редактор коду](/learn/editor-setup)
 * [Як встановити інструменти React розробника](/learn/react-developer-tools)
 
@@ -47,9 +47,9 @@ export default function App() {
 
 Якщо ви хочете створити застосунок або вебсайт за допомогою React, [почніть новий React-проєкт.](/learn/start-a-new-react-project)
 
-## Інтегрувати React в існуючий проєкт {/*add-react-to-an-existing-project*/}
+## Інтегрувати React у наявний проєкт {/*add-react-to-an-existing-project*/}
 
-Якщо ви хочете використати React у власному застосунку або вебсайті, [інтегруйте React в існуючий проєкт.](/learn/add-react-to-an-existing-project)
+Якщо ви хочете використати React у власному застосунку або вебсайті, [інтегруйте React у наявний проєкт.](/learn/add-react-to-an-existing-project)
 
 ## Подальші кроки {/*next-steps*/}
 

src/content/learn/updating-arrays-in-state.md

@@ -88,7 +88,7 @@ button { margin-left: 5px; }
 
 </Sandpack>
 
-Натомість створіть *новий* масив, який містить існуючі елементи *і* новий елемент у кінці. Це можна зробити кількома способами, але найпростішим є використання `...` — синтаксису [spread для масиву](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax#spread_in_array_literals):
+Натомість створіть *новий* масив, який містить наявні елементи *і* новий елемент у кінці. Це можна зробити кількома способами, але найпростішим є використання `...` — синтаксису [spread для масиву](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax#spread_in_array_literals):
 
 ```js
 setArtists( // Замінити стан
@@ -443,7 +443,7 @@ export default function List() {
 
 Тут ви використовуєте spread-синтаксис `[...list]`, щоб спочатку створити копію вихідного масиву. Тепер, коли маєте копію, можете використовувати методи зміни, як-от `nextList.reverse()` або `nextList.sort()`, або навіть призначати окремі елементи за допомогою `nextList[0] = "something"`.
 
-Однак, **навіть якщо скопіюєте масив, ви не зможете змінити існуючі елементи _всередині_ нього безпосередньо.** Це пояснюється тим, що копіювання неглибоке — новий масив міститиме ті самі елементи, що й оригінальний. Отже, якщо змінюєте об'єкт у скопійованому масиві, ви змінюєте наявний стан. Наприклад, такий код є проблемою.
+Однак, **навіть якщо скопіюєте масив, ви не зможете змінити наявні елементи _всередині_ нього безпосередньо.** Це пояснюється тим, що копіювання неглибоке — новий масив міститиме ті самі елементи, що й оригінальний. Отже, якщо змінюєте об'єкт у скопійованому масиві, ви змінюєте наявний стан. Наприклад, такий код є проблемою.
 
 ```js
 const nextList = [...list];
@@ -544,7 +544,7 @@ function ItemList({ artworks, onToggle }) {
 ```js
 const myNextList = [...myList];
 const artwork = myNextList.find(a => a.id === artworkId);
-artwork.seen = nextSeen; // Проблема: мутація існуючого елементу
+artwork.seen = nextSeen; // Проблема: мутація наявного елементу
 setMyList(myNextList);
 ```
 
@@ -566,7 +566,7 @@ setMyList(myList.map(artwork => {
 
 Тут `...` — синтаксис spread об'єкта, який використовується для [створення копії об'єкта.](/learn/updating-objects-in-state#copying-objects-with-the-spread-syntax)
 
-За допомогою цього підходу жоден із існуючих елементів стану не змінюється, і помилку виправлено:
+За допомогою цього підходу жоден із наявних елементів стану не змінюється, і помилку виправлено:
 
 <Sandpack>