Керівництво по роботі з Redux

Сьогодні Redux – це одне з найцікавіших явищ світу JavaScript. Він виділяється із сотні бібліотек і фреймворків тим, що грамотно вирішує безліч різних питань шляхом введення простий і передбачуваною моделі станів, спрямщвані на функціональне програмування і незмінні дані, надання компактного API. Що ще потрібно для щастя? Redux – бібліотека дуже маленька, і вивчити її API не складно. Але у багатьох…

Unit-тести для Angular

Unit-тестування – це важлива частина процесу розробки на поточний момент і вона стає невід’ємною частиною. Це підвищує якість коду і впевненість розробників. У даній статті розповідається про те, як створювати unit-тести для Angular, що використовувати і чому. Для написання unit-тестів використовується фреймворк Jasmine, а виконуються тести в Karma. Karma – це JavaScript движок для запуску тестів, які виконуються…

Тести в Angular

У Angular для тестів використовуються два інструменти: Jasmine – фреймворк для написання тестів, і Karma – інструмент для запуску цих тестів в браузері. Документація з тестування в Angular Karma Jasmine Jasmine методи Jasmine describe(description, function) – метод застосовується для угруповання взаємозалежних тестів beforeEach(function) – метод застосовується для призначення завдання, яке повинно виконуватися перед кожним тестом afterEach(function) – метод застосовується для…

Повне керівництво по функції calc()

В CSS є особлива функція calc(), застосовувана для виконання простих розрахунків. Ось приклад її використання: .main-content { /* Відняти 80px из 100vh */ height: calc(100vh – 80px); } Функція calc() і значення CSS-властивостей Єдине місце, де можна використовувати функцію calc() – це значення CSS-властивостей. Погляньте на наступні приклади, в яких ми, використовуючи цю функцію, задаємо…

Reactjs, Material-UI з JSS.

Material-UI – ReactJS‘s фреймворк, що надає готові google рішення для швидкої і досить простий web розробки. Material-UI досить велика бібліотека, де ключовою частиною react компонентів і стилізації є @material-ui/core (метою її використання повинен бути немаленький проект). Цей туториал не включає в себе просунуте використання material-ui. Це міні мануал по стилізації компонентів. Використовувати material компоненти дійсно не складно, але є нюанси використання…

Створення власних синтаксичних конструкцій для JavaScript з використанням Babel

Oгляд З початку давайте поглянемо на те, чого ми доб’ємося, діставшись до кінця цього матеріалу: function @@ foo(a, b, c) {   return a + b + c; } console.log(foo(1, 2)(3)); // 6 Ми збираємося реалізувати синтаксичну конструкцію @@, яка дозволяє каррірувати функції. Цей синтаксис схожий на той, що використовується для створення функцій-генераторів , але в нашому випадку замість знака * між ключовим…

Шпаргалка по роботі з Git

Приклади git команд з невеликим описом для повсякденного вжитку для програмістів і не тільки. Створити новий репозиторій: git init project-name Якщо ви плануєте клонувати його по ssh з віддаленої машини, також скажіть: git config –bool core.bare true … інакше при git push ви будете отримувати дивні помилки на кшталт: Refusing to update checked out branch:…

Що таке Angular Ivy?

Якщо ви останнім часом стежили за розвитком Angular, ви, мабуть, зіткнулися з словом “Ivy”. За цим кодовим ім’ям ховається величезна робота для Angular team, і крок у майбутнє. Але важко зрозуміти, що таке Ivy. Давайте дізнаємося. Ваш JS framework є компілятором Ваш JS framework є компілятором. Це вірно для більшості систем JS, але це особливо актуально для Angular….

Що нового в Angular 8.0?

Angular 8.0 має трохи більше мій код, ніж інші випуски 😊. Цей випуск, в основному, стосується Ivy і можливості спробувати, але він також включає в себе кілька особливостей і порушення змін. Сподіваюся, оновлення повинно бути дуже легким, оскільки команда Angular написала купу схем, які будуть робити важку роботу замість вас. TypeScript 3.4 Angular 8.0 тепер підтримує…

Інструменти доступності кольорового контрасту

Кілька інструментів, щоб допомогти переконатися, що весь текст на наших веб-сайтах є розбірливим, незалежно від того, який колір фону вони могли б мати. Спочатку це Accessible Color Generator, який є чудовим інструментом для вибору альтернативних кольорів. Припустимо, ви працюєте над торговою маркою з кольором X. Ви можете створити безліч інших безкоштовних кольорів, наприклад: Далі йде Contrast, досить…