Фулстек JavaScript — це не лише про вміння писати код на клієнті й сервері, а насамперед про розуміння екосистеми: як працюють технології, як вони пов’язані між собою, і як про них говорити професійною мовою.
У сучасній веброзробці ви постійно стикаєтеся з десятками термінів — у документації, технічних завданнях, на мітингах, у вакансіях або просто під час обговорення проєктів з командою. HTML, JSX, SPA, CRUD, ORM, SSR, WebSocket, Docker... Без знання цих понять легко загубитись, навіть маючи базові навички програмування.
Цей словник створено як практичний орієнтир для початківців, які тільки опановують професію, і розробників, які хочуть систематизувати свої знання. Він охоплює ключові терміни з усіх сфер, з якими працює фулстек-розробник:
Він стане у пригоді:
Вивчайте, повертайтеся до словника у потрібний момент, і поступово ваша технічна мова стане такою ж впевненою, як і ваш код.
HTML (HyperText Markup Language) — мова розмітки, яка визначає структуру вебсторінки. Вона описує вміст за допомогою тегів, таких як заголовки, параграфи, посилання, зображення тощо. HTML — основа будь-якого вебзастосунку.
CSS (Cascading Style Sheets) — мова стилів, яка дозволяє оформлювати HTML-сторінки. Задає кольори, шрифти, розміри, відступи, позиціювання та анімації. CSS забезпечує візуальну привабливість і зручність інтерфейсу.
Каскадність (Cascade) — механізм, за яким визначається, яке саме CSS-правило буде застосоване, якщо є кілька суперечливих варіантів. Враховується походження стилів (браузерні, користувацькі, авторські), специфічність селектора, порядок оголошення правил та ключове слово !important. Це основа розв'язання конфліктів стилів.
Спадкування (Inheritance) — механізм CSS, за якого певні стилі автоматично передаються від батьківського елемента до дочірнього. Якщо властивість явно задана для дочірнього елемента, вона переважить успадковану. Найчастіше спадкуються властивості, пов’язані з текстом: color, font-family, line-height тощо.
Flexbox / Grid — сучасні системи компонування елементів у CSS. Flexbox добре підходить для одновимірних макетів (у рядок або стовпчик), тоді як Grid — для двовимірних сіток. Вони дозволяють будувати гнучкі й адаптивні макети без складного позиціювання.
Адаптивність (Responsive Design) — підхід до верстки, що забезпечує коректне відображення сайту на різних пристроях і розмірах екрана. Це необхідна умова для створення сучасних вебзастосунків. Реалізується, зокрема, через медіазапити, через гнучкі інструменти CSS — як-от flex, grid, відносні одиниці (em, %, vw), а також функції на зразок clamp() для масштабованих значень.
Медіазапити (Media Queries) — спеціальні конструкції в CSS, які дозволяють змінювати стилі залежно від параметрів пристрою: ширини, висоти, орієнтації екрана, типу медіа. Вони є основним інструментом для створення адаптивного дизайну, даючи змогу уникати дублювання коду.
Препроцесори CSS (SASS, SCSS) — надбудови над CSS, що розширюють його можливості: змінні, вкладення, міксіни, функції, цикли та інше. Код на препроцесорі компілюється у стандартний CSS. Це значно спрощує підтримку та масштабування великих проєктів.
JavaScript (JS) — мова програмування, що надає вебінтерфейсам динамічність та інтерактивність. Дозволяє реагувати на дії користувача, змінювати DOM, валідувати форми, надсилати мережеві запити та зберігати дані. JS використовується не лише на фронтенді, а й на сервері — зокрема в середовищі Node.js.
ECMAScript (ES) — офіційна специфікація, за якою розвивається JavaScript. Її версії (наприклад, ES6/ES2015) додають нові конструкції — як-от класи, стрілочні функції, let/const, шаблонні рядки. Специфікація забезпечує стандартизацію й сумісність реалізацій JavaScript.
Модулі в JavaScript — це спосіб структурувати код, розділяючи його на незалежні частини з чіткими обов’язками. Через ключові слова export і import модулі дозволяють перевикористовувати логіку та зберігати код масштабованим і зрозумілим. Працюють як у браузері, так і в Node.js.
Асинхронність — концепція, що дозволяє виконувати операції (наприклад, мережеві запити) без блокування основного потоку виконання. JavaScript підтримує асинхронність через колбеки, проміси (Promise) і конструкцію async/await. Це основа для побудови швидких, чутливих застосунків.
DOM (Document Object Model) — об’єктна модель HTML-документа, яка відображає його структуру у вигляді дерева. DOM дає змогу JavaScript змінювати вміст, атрибути й стилі елементів у режимі реального часу. Це ключовий механізм динамічної взаємодії з вебсторінкою.
Web API — набір інтерфейсів, які браузери надають JavaScript для роботи з різними можливостями середовища. Сюди входять API для доступу до DOM, запитів (fetch), геолокації, камери, локального сховища тощо. Web API — це міст між JavaScript і функціями платформи.
Рефакторинг — це процес поступового поліпшення внутрішньої структури коду без зміни його зовнішньої поведінки. Рефакторинг робить код чистішим, зрозумілішим, зручнішим у підтримці в комерційних проєктах. Це регулярна практика в командній розробці, яка підвищує якість програмного продукту.
Бандлер (webpack, Vite) — інструмент, який збирає та оптимізує ресурси вебзастосунку (JS, CSS, зображення) для продакшену. Він дозволяє зменшити розмір файлів, використовувати сучасний синтаксис і прискорити завантаження сайту в браузері.
Фреймворк — це програмний каркас, що задає структуру застосунку й надає готові функції для типових задач. Він спрощує розробку, дозволяючи зосередитися на логіці проєкту, а не на базовій інфраструктурі. Фреймворки допомагають створювати масштабовані та підтримувані системи.
Веб-фреймворк — це набір інструментів, бібліотек і шаблонів, що спрощують створення вебзастосунків. Він надає готову структуру, маршрутизацію, обробку запитів, взаємодію з БД, шаблони та middleware. Приклади: Express (для Node.js), Next.js (фреймворк над React), Nest.js (архітектура типу MVC).
React — бібліотека JavaScript для створення користувацьких інтерфейсів, побудована на компонентному підході. Вона використовує віртуальний DOM, що дозволяє ефективно оновлювати тільки змінені частини UI. React є стандартом для розробки SPA та гнучких інтерфейсів.
Redux — бібліотека для керування глобальним станом у React-додатках. Базується на концепціях store, reducer і dispatch, що дозволяє централізовано зберігати дані та передбачувано змінювати стан застосунку.
JSX (JavaScript XML) — розширення синтаксису JavaScript, яке дозволяє використовувати HTML-подібний код усередині JS-файлів. JSX компілюється у виклики функцій React, це поєднує розмітку та логіку в одному компоненті, підвищуючи читабельність коду..
SPA (Single Page Application) — тип вебзастосунку, де вся навігація відбуваються без повного перезавантаження сторінки. Новий контент підвантажується динамічно через JavaScript, забезпечуючи швидку взаємодію та плавну навігацію.
CSR (Client-side rendering) — рендеринг контенту застосунку в браузері, де весь HTML генерується на основі JavaScript. Такий підхід знижує навантаження на сервер і покращує інтерфейс після початкового завантаження. Недолік — повільний перший рендер та проблеми з SEO.
SSR (Server-side rendering) — техніка, коли HTML формується на сервері й надсилається готовим у браузер. Це забезпечує швидкий початковий рендер, покращену індексацію пошуковими системами та менше навантаження на клієнт. Застосовується у фреймворках типу Next.js.
HTTP (HyperText Transfer Protocol) — основний протокол Інтернету для передачі даних між клієнтом і сервером. Через нього надсилаються HTML-сторінки, CSS, JavaScript, зображення, JSON та інші ресурси. HTTP лежить в основі взаємодії у вебі.
REST API — архітектурний стиль побудови API, що базується на HTTP-методах (GET, POST, PUT, DELETE) та чіткій структурі URL-адрес. REST дозволяє взаємодіяти з ресурсами передбачувано та стандартизовано.
CRUD (Create, Read, Update, Delete) — базові операції для роботи з даними. Вони відповідають основним діям користувача: створення, читання, оновлення та видалення. CRUD лежить в основі більшості інтерфейсів з базами даних або API.
WebSocket (WS) — протокол, який дозволяє встановити постійний двосторонній зв’язок між клієнтом і сервером. Забезпечує швидкий обмін даними в режимі реального часу. Використовується для чатів, онлайн-ігор, бірж тощо.
Node.js — середовище виконання JavaScript поза браузером, побудоване на рушії V8 від Google. Дає змогу створювати серверні застосунки на JavaScript: працювати з мережею, файловою системою, базами даних, API тощо. Використовується для розробки як backend-сервісів, так і CLI-інструментів.
npm (Node Package Manager) — стандартний менеджер пакетів для екосистеми Node.js. Дозволяє легко встановлювати та оновлювати бібліотеки, керувати залежностями, запускати скрипти й автоматизувати процеси розробки. Є ключовим інструментом для роботи з проєктами JavaScript.
npx — утиліта, що постачається разом з npm і дозволяє запускати пакети напряму з реєстру без потреби в локальній установці. Зручно для одноразових запусків CLI-інструментів (наприклад, create-react-app), генераторів шаблонів або тестування утиліт.
nvm (Node Version Manager) — інструмент для встановлення та перемикання між різними версіями Node.js. Дозволяє працювати з кількома проєктами, кожен з яких потребує своєї версії Node. Особливо корисний для розробників, які підтримують або тестують різні середовища.
Express — мінімалістичний веб-фреймворк для Node.js, який спрощує створення серверних застосунків і REST API. Надає зручний інтерфейс для маршрутизації, обробки HTTP-запитів, роботи з middleware, параметрами URL тощо. Один з найпопулярніших інструментів у Node-екосистемі.
SQL (Structured Query Language) — мова для роботи з реляційними базами даних. Дозволяє створювати таблиці, виконувати запити до даних, змінювати структуру, будувати зв’язки між таблицями, працювати з транзакціями.
PostgreSQL — потужна об’єктно-реляційна система керування базами даних з відкритим кодом. Підтримує складні SQL-запити, транзакції, індекси, збережені процедури та розширення. Популярна в проєктах, де потрібна надійність і масштабованість.
ORM (Object-Relational Mapping) — технологія, яка дозволяє працювати з реляційною базою через об’єкти мови програмування. Замість SQL-запитів розробник використовує класи та методи, що спрощує роботу з базою та покращує читабельність коду.
Sequelize — ORM для Node.js, яка дозволяє описувати структуру таблиць як JavaScript-класи. Підтримує зв’язки між моделями, транзакції, валідацію, автоматичні міграції та гнучку конфігурацію. Поширена в проектах на Express.
NoSQL — підхід до зберігання даних без використання таблиць. Бази цього типу (документні, графові, ключ-значення) краще підходять для масштабування, роботи з гнучкими або змінними схемами, великими обсягами даних або реального часу.
MongoDB — найпопулярніша документно-орієнтована NoSQL-база даних. Зберігає дані у форматі BSON (JSON-подібному). Добре підходить для швидкої розробки, зберігання вкладених структур і масштабування в хмарі.
ODM (Object-Document Mapping) — аналог ORM для NoSQL-баз. Дозволяє працювати з документами в базі як із об’єктами мови програмування, описуючи їхню структуру, правила валідації, зв’язки тощо.
Mongoose — популярна ODM-бібліотека для MongoDB у середовищі Node.js. Дозволяє описувати схеми документів, встановлювати правила перевірки, створювати зв’язки між колекціями та виконувати запити у зручному форматі.
Система керування версіями (Version Control System) — це інструмент для відстеження та збереження змін у коді та інших файлах проєкту. Вона дозволяє розробникам зберігати історію правок, легко повертатися до попередніх версій та працювати над кодом одночасно без конфліктів. Це необхідна складова командної розробки, що підвищує контроль якості та безпеку коду.
Git — найпоширеніша розподілена система керування версіями, яка дозволяє ефективно працювати з історією змін, створювати паралельні гілки (branching) та об’єднувати їх (merging). Git полегшує командну роботу, даючи змогу розробникам паралельно працювати над різними частинами проєкту та синхронізувати результати.
GitHub — популярна онлайн-платформа для зберігання Git-репозиторіївта спільної роботи над кодом. Вона надає інструменти для відстеження помилок, управління завданнями, організації коду, а також автоматизації процесів.
Code Review (Кодрев’ю) — це процес перевірки написаного коду іншими членами команди перед його внесенням у головну гілку проєкту. Кодрев’ю допомагає знаходити помилки, покращує якість коду та забезпечує дотримання стандартів, а також сприяє колективному навчанню та підтримці коду.
Pull Request (Запит на злиття) — механізм у Git-платформах, який дозволяє розробникам пропонувати зміни у проєкті. Через pull request інші члени команди можуть переглянути, обговорити та протестувати код, перш ніж об’єднати його з основною гілкою, що гарантує якість і контроль над змінами.
Docker — платформа для створення, запуску та управління контейнерами, які ізолюють застосунок разом із усіма залежностями. Забезпечує стабільну та передбачувану роботу на будь-якій ОС, що спрощує розгортання.
Контейнеризація — підхід до розгортання застосунків, за якого програма упаковується разом із бібліотеками, конфігураціями й середовищем у єдиний контейнер. Дає змогу легко переносити, масштабувати й оновлювати застосунок.
Редактор коду — інструмент розробника з підтримкою підсвічування синтаксису, автодоповнення, перевірки помилок, інтеграції з системами контролю версій. Найпоширеніший серед JS-розробників — Visual Studio Code.
Деплой (deployment) — процес розміщення застосунку на сервері або у хмарному середовищі для доступу через Інтернет. Включає налаштування середовища, запуск сервера, підключення бази даних тощо.
Продакшн (production) — фінальне середовище, у якому застосунок працює з реальними користувачами та даними. Вимагає стабільності, безпеки, резервного копіювання та моніторингу продуктивності.
Фулстек JavaScript — це багатогранна сфера, де важливо не лише писати код, а й добре орієнтуватися в термінах, які описують технології, архітектури та підходи до розробки. Цей словник допоможе систематизувати знання, розібратися в основних поняттях і впевненіше почуватися у професійному середовищі.
Докладніше ознайомитись зі структурованим переліком технологій та етапів підготовки можна в програмі навчання фулстек JavaScript розробника від навчального центру Freshcode.
Світ розробки стрімко змінюється, але чітке розуміння базових понять — це те, що дає стабільний фундамент для будь-якого наступного кроку. Вивчайте, ставте запитання, практикуйтесь — і впевнено рухайтесь до своєї мети в ІТ!
Розширте свої знання на нашому повному курсі навчання fullstack в навчальному центрі Freshcode
GIT, HTML, CSS, JavaScript, TypeScript, Штучний інтелект, React, Redux, Linux, Node.js, PostgreSQL та MongoDB, Клієнт-серверна взаємодія, Docker, UNIT-тести, Спільна робота над проєктом, Індивідуальний проєкт.
Перейти
Розширте свої знання на нашому повному курсі навчання проєктному менеджменту в навчальному центрі Freshcode
Введення в ІТ, Технічна грамотність менеджера, Дослідження особливостей проєкту, Оцінка та планування задач, Контроль та реліз проєкту, Інструментарій розробника та штучний інтелект, Організація командної взаємодії, Закриття проєкту, Особливості продажів в ІТ.
Перейти