react
(58)
Як я повернувся і відразу пішов від JavaScript
{full-post-img} Перш за все слід сказати, що ця стаття лише ІМХО, не слід сприймати її надто серйозно. Тут я описав перше враження про сучасний веб, котре склалося в мене після декількох років роботи на бекенді. Під час написання (і перекладу) не бу...
Codeguida · 2 роки тому · 38
Тестування компонентів в React: що і як тестувати з Jest та Enzyme
У статті розглянемо: Правильний порядок тестування компонентів на основі структури проекту. Що можна не тестувати. Важливість Snapshot-тестування. Що тестувати у компоненті та в якому порядку. Детальні приклади коду. Для розуміння статті потрібні н...
Codeguida · 07 листопада 2018 · 36
Як зменшити сторінку Next.js у 3,5 раза й досягти 98 балів Lighthouse
У цій статті ми розповімо про те, як розробники Papyrus.dev виправили недоліки сайту й успішно досягли оцінки швидкодії 98 балів у Lighthouse. А ще зменшили розмір JS за першого завантаження у 3,5 раза і впровадили кілька хороших практик, як-от оптим...
Codeguida · 10 вересня 2021 · 34
Компоненти вищого порядку в React для початківців
Передмова Я пишу це, тому що кожна інша стаття, включаючи офіційну документацію React про компоненти вищого порядку (Higher-Order Components), спантеличила мене як початківця. Я зрозумів, що компоненти вищого порядку є чимось потрібним, але не розумі...
Codeguida · 26 жовтня 2017 · 33
Форми в React: використовуємо ref
React дозволяє отримати значення <form> у два способи. Перший полягає в імплементації так званих контрольованих компонентів, а другий — в застосуванні React властивості ref. Головною характеристикою контрольованих компонентів є те, що значення, яке в...
Codeguida · 13 вересня 2017 · 30
Динамічні SVG з React.js
Scalable Vector Graphics (SVG) - це відмінний спосіб включити векторну графіку у свою веб-сторінку. Вона легка, заснована на XML і підтримується майже всіма сучасними браузерами. XML лежить в основі SVG, тож вона не містить нічого крім розмітки, і м...
Codeguida · 14 червня 2020 · 30
JSX в глибину
Примітка перекладача: Ми знаємо про JSX здебільшого завдяки відомій бібліотеці для побудови інтерфейсів React. Ця стаття є вільним перекладом статті з офіційного сайту React «JSX in Depth». JSX — це розширення синтаксису JavaScript, яке виглядає як...
Codeguida · 05 серпня 2020 · 29
Еволюція шаблонів проектування в React
Уважніше поглянемо на деякі шаблони проектування, що виникають в екосистемі React. Ці шаблони підвищують читабельність, чистоту та полегшують повторне використання компонентів. Я почав працювати з React близько 3 років тому. У той час не було устален...
Codeguida · 18 липня 2018 · 27 · 1
Коротко про тестування проєкту на React
Уявіть ситуацію: ви працюєте над проєктом, ось закінчуєте останню фічу, і ... раптово помічаєте баги в різних частинах системи. Ви фіксите їх — з'являються нові. І гра «впіймай баг» триває, доки ви нарешті не втомитесь і не почнете шукати інший вихід...
Codeguida · 3 роки тому · 27
Анонсовано React 18! Поглянемо, що має змінитись
Представлений наприкінці 2020 року React 17 не приніс багато нових можливостей. Натомість в ньому було багато вдосконалень, виправлень та закладено основи для майбутніх оновлень. Все для плавного впровадження подальших змін. Саме так ми переходимо до...
Codeguida · 07 липня 2021 · 26
Покращуємо компоненти багаторазового використання в React з шаблоном Overrides
Якщо останні кілька років ви спостерігали за екосистемою React, ви напевно зіткнулися з однією з численних бібліотек з відкритим сирцевим кодом для багаторазових компонентів. Вони позбавляють нас нудьги від повторного створення модальних вікон, меню...
Codeguida · 25 січня 2019 · 21
Як написати свій webpack-builder
Кому лінь читати, можете одразу клонувати репозиторій і користуватись. Деталі на the-simplest-webpack-react-starter-kit. Нещодавно шукав простий webpack react starter kit. Потрібно було переписати свій pet-project на свіжий React 16. Вимоги до старт...
Codeguida · 18 жовтня 2017 · 14