Front-Еnd дайджест #24: ReasonML, React в Airbnb и Samsung Internet
В выпуске: React Sketch App и Sizzy, грядущий Node 8.0 и новый Atom, CSS переменные и CSS in JS бенчмарки, а также прошедший React Amsterdam.
CSS
The Different Logical Ways to Group CSS Properties — как правильно группировать CSS свойства
The Many Tools for Shape Morphing — про собы морфинга SVG-фигур
Adding :focus-within selector to Chromium — обзор нового селектора
Implementing system fonts on Booking.com — A lesson learned — опыт изменения шрифтов на booking.com
Simplifying CSS Cubes with Custom Properties — как CSS переменные упрощают создание 3D объектов
Making Custom Properties (CSS Variables) More Dynamic — используем CSS переменные
JavaScript
Native form validation — Part 1, 2 — секреты нативной валидации форм в браузерах
ECMAScript modules in browsers — обзор ES6 модулей в браузерах
ES6 modules support lands in browsers: is it time to rethink bundling? — стоит ли нам изменить сборку кода с появлением нативной поддержки ES6 модулей?
Using fetch() and reduce() to grab and format data from an external API — A practical guide
Upgrading Ele.me to Progressive Web App — опыт создания PWA на Vue.js от крупнейшего китайского сервиса для заказа еды
How to do proper tree-shaking in Webpack 2
Combine Webpack with Gulp 4 — объединяем и берем лучшее
10 Machine Learning Examples in JavaScript — примеры машинного обучения в JavaScript
An Overview of JavaScript Testing in 2017 — как тестировать JavaScript в 2017
RxJS Subjects for human beings
React и React Native
Which Projects Need React? All Of Them! — когда стоит использовать React?
Hello from React Amsterdam 2017 — обзор React Amsterdam
Rearchitecting Airbnb’s Frontend — как работает Front-end в Airbnb
After building my first React Native app, I’m now convinced it’s the future.
45% Faster React Functional Components, Now
CSS in JS
CSS in JavaScript: The future of component-based styling — как правильно писать стили для компонент
Stop using CSS in JavaScript for web development — девять причин не использовать CSS in JS и styled-components
Твит тред Олега Слободского о CSS in JS
Why CSSinJS — презентация Олега Слободского
Angular 1x-2
Essential Angular: 7 Blog Posts + Book
Testing Angular Apps in WebStorm
Create the toJSON operator in Angular
ngrx/store reuse reducer logic
Moving From Angular to Vue : A vuetiful journey
Node.js
Node.js 8.0.0 has been delayed and will ship on or around May 30th — чего ждать?
How To Build a React GraphQL Static Site Served From AWS CloudFront — строим простое приложение на GraphQL и React
How to use DynamoDB Document Client with AWS Lambda DynamoDB Streams
Understanding Node.js Event-Driven Architecture
How to write nice, typed and expressive node-express functions — покрываем типами express приложение
ReasonML
Rsnpaint — эксперимент с написанием анимаций
ReasonablyTyped — переводим типы с Flow в ReasonML
Популярные библиотеки на OCaml/ReasonML:
Библиотеки
Prepack — оптимизируем код на этапе сборки
Lists — коллекция данных в формате JSON
Freactal — новой библиотека для управления состоянием в React приложениях
Speedracer — измеряем производительность автоматически
Styled-JSS — Styled-Components в связке с JSS
Typefont — распознаем текст с картинки
Butternut — JS-минификатор
Послушать
Веб-стандарты — 64, 65, 66, 67, 68, 69
Пятиминутка React:
- #11 — this.state или this.effectiveValue?
- #12 — React 15.5 и другие новости
- #13 — Redux Business Logic
- #14 — Redux Business Logic (part 2)
- #15 — Amsterdam, PWA, RealWorld, Prepack
- #16 — Frontend Conf 2017
- #17 — Idiomatic Redux
Фронтёрки
Devschacht — 1, 2
Frontend Weekend:
Конференции
UralJS #3 06.04.16 в F.Starter
React Amsterdam 2017 Conference
Демо
Adventure Time — на чистом CSS
Wolfenstein 3d — на чистом CSS
MINE3D — трёхмерный сапёр на WebGL
Что нового?
Samsung Internet:
Sizzy — ответ на вопрос как создавать респонсив веб-ресурсы
Сreate Next App — React Create App с сервер-сайт рендерингом
Electrino — Electron без лишних зависимостей
ExtReact — компоненты для React Native
Launchpad — инструмент для создания и публикации адаптивных сайтов со Sketch
Остальное
Intro to React — учим React
45% Faster React Functional Components, Now
Wait, WebP is actually worth it — WebP и его преимущества
Facebook’s Prepack — The Next Killer In The JavaScript Zone
Mobile First, Desktop Worst — про упрощении десктопных версий на адаптивных сайтах
Configure ESLint, Prettier, and Flow in VS Code for React Development
The Ultimate Atom Editor Setup (+for JS/React)
Quantum Up Close: What is a browser engine? — про браузерные движки и проект Quantum который изменит Firefox
The single tip that made me a better programmer — совет — как стать лучше программистом от Андре Стальца
An Interview with Matt Loring, an engineer on Google’s NodeJS Runtime team — как используют Node.js в Google
A step-by-step guide to building a simple chess AI — как написать шахматы для браузера
Free online converter from PSD to Sketch — от команды Avocode
CSS in JS benchmarks — бенчмарки различных CSS in JS имплементаций
С вами был Григорий Шехет, @AGambit95. За помощь в оформлении дайджеста благодарю своих коллег.
← Предыдущий выпуск: Frontend дайджест #23.
