Node.js

Спочатку Node.js створювався як серверне оточення для додатків, але розробники почали використовувати його для створення інструментів, які допомагають автоматизувати виконання локальних завдань. У результаті нова екосистема інструментів, яка виникла навколо Node.js, призвела до трансформації процесу фронтенд-розробки.

• Починаючи установку, обов'язково простав чек поряд з Automatically install the necessary tools.
• Офіційна документація по node.js

node --version

npm --version

npm init -y

Ця команда створить файл package.json у корені вашого проєкту, який автоматично заповниться дефолтними метаданими.

Тепер необхідно виконати початкове налаштування і конфігурацію npm, встановивши ім'я та пошту майбутнього автора проєктів — тебе. Щоб встановити ім'я, виконай у терміналі таку команду, підстав замість YOUR_NAME своє ім'я і не загуби лапки.

npm config set init.author.name "YOUR_NAME"

npm config set init.author.email "YOUR_EMAIL"

nwm use 20

Наступним кроком після ініціалізації проєкту в терміналі нам потрібно перейти до папки проєкту і встановити його залежності. Папку node_modules ніколи не додають до системи контролю версій (не завантажують в репозиторій на github), у всіх розробників вона буде своя. Під час ініціалізації проєкту Vite було створено файл .gitignore, до якого додано правило, що виключає папку node_modules з переліку того, що необхідно завантажити в репозиторій на github.

npm install

Залежностями проєкту деякі будуть використані у фінальному продукті, інші необхідні тільки на стадії розробки. Саме для цього команди npm install і npm uninstall мають два прапорці.

• –save — вказує, що додається залежність, яка увійде до фінального продукту. Пакет буде встановлений локально, в папку node_modules, і буде доданий запис у поле dependencies в package.json.
• –save-dev — вказує, що додається залежність розробки, яка не увійде до фінального продукту. Пакет буде встановлений локально, в папку node_modules, і буде доданий запис у поле devDependencies в package.json.

Якщо не вибирати прапорець, за замовчуванням буде використаний –save.

Залежність (npm пакет) — це різноманітні утиліти та бібліотеки, що вирішують специфічне завдання. NPM складається з трьох основних компонентів:

• Реєстр пакетів (registry) — велика загальнодоступна база даних інструментів розробки (пакетів).
• Сайт npmjs.com — використовується для пошуку та ознайомлення з документацією пакетів.
• Інтерфейс командного рядка (CLI) — запускається з терміналу і надає набір команд для роботи з реєстром і пакетами. Дозволяє створювати скрипти для запуску в терміналі.

Команда npm install [package-name] або її короткий псевдонім npm i [package-name] встановить бібліотеку як залежність проєкту.

npm i validator

Крім того, що ми видалимо код, який використовує бібліотеку, необхідно видалити її як залежність проєкту. Ми можемо видалити будь-яку залежність командою npm uninstall [package-name] або її коротким псевдонімом npm r [package-name].

npm uninstall validator

Краще використовувати GitBush

Досить незручно кожен раз, коли ми змінюємо код, виконувати JavaScript-код вручну та перезапускати сервер, щоб переглянути результат. Щоб автоматизувати цей процес, використовуємо пакети nodemon.

Встановіть їх як залежності розробки командою:

npm install --save-dev nodemon

Nodemon - інструмент для розробки на Node.js, який дозволяє автоматично перезапускати сервер після змін у вихідних файлах.

Додайте скрипт у файлі package.json для запуску додатка:

"scripts": {
    "dev": "nodemon src/index.js"
}

Тепер ви можете запускати ваш додаток за допомогою команди npm run dev

ESLint - Лінтінг коду

Модуль для роботи з шляхами до файлів під різні ОС.

• join

Цей метод приймає аргументами рядки, які будуть перетворені у правильно форматований шлях базуючись на операційній системі, на якій запущена програма.

import path from 'node:path';

// приклад для побудови шляху з його частин
const somePath = path.join('some_folder', 'some_file.txt'); 
// somePath буде 'some_folder/some_file.txt' на MacOs

// somePath буде 'some_folder\\some_file.txt' на Windows

• parse

Дозволяє отримати інформацію по шляху, який був переданий аргументом