Перш ніж розпочати розробку з Angular, необхідно налаштувати своє робоче середовище. Для цього потрібні три основні інструменти: Node.js, Angular CLI та VS Code.

Встановлення Node.js

1. Перейдіть на офіційний сайт Node.js website;

2. Використовуйте версію LTS (Long-Term Support) Node.js замість останнього релізу, оскільки Angular може ще не бути повністю сумісним з найновішою версією.

3. Виберіть свою операційну систему—у цьому прикладі обрано macOS, але оберіть ту, яка відповідає вашій конфігурації. Інші налаштування залиште без змін;

4. Завантажте інсталятор та дотримуйтесь інструкцій на екрані для завершення встановлення.

Після встановлення відкрийте термінал (або командний рядок) і перевірте, чи Node.js встановлено:

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

Далі перевірте, чи npm (Node Package Manager) встановлено:

Виконання команди npm -v відобразить встановлену версію npm — це свідчить про те, що npm успішно встановлено та готовий до використання.

Встановлення Angular CLI

Для встановлення Angular CLI спочатку відкрийте свій термінал (або командний рядок). Далі виконайте наступну команду для глобального встановлення Angular CLI:

Ця команда встановлює Angular CLI глобально у вашій системі, роблячи його доступним для будь-якого Angular-проєкту.

Після завершення встановлення перевірте версію Angular CLI, виконавши:

Це відобразить інформацію про версію Angular CLI та інших встановлених залежностей.

Встановлення VS Code

1. Перейдіть на офіційний сайт VS Code website;

2. Виберіть версію для вашої операційної системи (Windows, macOS або Linux);

3. Завантажте інсталятор та дотримуйтесь інструкцій на екрані для завершення встановлення.

Після встановлення відкрийте VS Code та налаштуйте необхідні розширення:

1. Перейдіть до розділу розширень (Ctrl + Shift + X на Windows або Cmd + Shift + X на macOS);

2. Встановіть розширення Angular Language Service для підсвічування коду та автозавершення;

3. Також можна встановити Angular Essentials для додавання підтримки синтаксису, автозавершення та інших інструментів для спрощення розробки на Angular у VS Code.