Front-end digest #42: webpack 3, Vue vs React, фронтенд фреймворк у 2017

Новини/Релізи:

• 🍾🚀 webpack 3: Офіційний реліз!! 🚀🍾

• Цікава статистика: парсинг 1MB JS на різних пристроях:

Статті

• Який фронтенд фреймворк обрати в 2017

• Поради по UX для білінгових форм

• Способи використання CSS змінних

• Що таке HTTPS та як на нього перейти

• Досліджуємо Blend Modes в CSS

• BEM на прикладах

• Швидке завантаження сторінок з використанням CSS та SVG-анімації (без JavaScript)

• О ні! Наша таблиця стилів тільки зростає і зростає і зростає!

• CSS vs. JavaScript: Довіра vs. Контроль

• Як виглядає добре документований CSS?

• Іменувати елементи стає все важче

• Реактивний UIз VanillaJS – Частина 1: Чисті функції та частина 2: Компоненти на основі класів

• HTML imports – найкращий веб-компонент

• Використовуйте CSS змінні правильно

• Як застосовувати CSS3 Transforms до Background Images

• Співвідношення сторін в CSS – це хак

• Цікава техніка реалізації іконкової системи на SVG

• Створюємо готові до продакшену макети на CSS Grid вже сьогодні

• Дизайн-системи, стайлгайди, бібліотеки шаблонів. В чому різниця?

Корисності:

• Photon – підсвітка синтаксису для вебу

• bojler – email шаблон та інструкція з написання HTML, який правильно відображатиметься серед усіх найпопулярніших поштових клієнтів

• React Express – інтерактивний посібник для початківців для розробки сучасних додатків React

• Stickybits – альтернатива position: sticky поліфілів

• coolhue – набір відібраних вручну градієнтних відтінків

• Spected – низькорівнева бібліотека валідації об'єктів

• FBox – Flexbox компонент для Reactjs

Javascript Jedi:

• Основи draft.js

• Колбеки в JavaScript

• Функціональне програмування в Javascript – антипатерн

• Тестування функціонального JavaScript: гід для чайників

• Lazy-масиви в JavaScript

• Розглядаємо ES6 генератори

• Основи Наборів (Sets) в JavaScript

• Чому вам потрібно завжди використовувати Лінтер

• Шаблони оптимізації JavaScript (ч.1)

• ES2017's async/await – краще, що сталось з JavaScript

• «Особливості» Service Worker

• Як створити інтерактивні JavaScript графіки зі спеціальних наборів даних

Angular:

• CSS фреймворки для використання з Angular 2+

• ng-annotate застарів: що це означає для ваших проектів

• Angular: від 0 до героя

React:

• Рендеринг React на стороні сервера

• Вивчаєте React? Почніть з основ

• Методи декомпозиції компонентів React

• Міні-Netflix з React за 10 хвилин

Vue.js:

• Vue vs React

• Чому слід обрати Vue.js

• Чотири способи розіграти Vue за допомогою Webpack

• Чому VueJS впроваджується так повільно?

• Основи Vue Router

• Переходимо з KnockoutJS на VueJS

• Vue.js: трьох хвилинне інтерактивне інтро

-Створюємо Тетріс з Vue, Vuex та Immutable

• Простий компонент Vue для фільтрації та сортування таблиць

Ember:

• Створюємо PWA з Ember

Відео:

• Accessible Modal Dialogs -- A11ycasts #19

• Відео з WeAreDevelopers Conference 2017

5 сайтів, що надихають:

• Casa Angelina. True Perfection.

{full-post-img}

• Essential Products

{full-post-img}

• A Ghost Store

{full-post-img}

• Ember House

{full-post-img}

• Space.io - Why we explore

{full-post-img}