Frontend дайджест #14: изучаем GraphQL вместе с Apollo, EmberConf, NG-Conf и React Amsterdam
В выпуске: новые выпуски JavaScript Air, интервью с создателем CSS и материалы по React Native, Meteor и Angular 2, а также новые Vue.js, ELM, Electron и Node.
Почитать
Хотелось бы подчеркнуть — стоит ли подчёркивать ссылки.
Top 10 Articles from Last Month — CSS, React, JavaScript.
The Most Useful Free eBooks for Web Developers — подборка бесплатных книг.
Процесс TC39 для внесения новых возможностей языка в спецификацию ECMAScript.
Making the Switch Away from Icon Fonts to SVG: Converting Font Icons to SVG — переводим шрифты в SVG.
Responsive Logo Composition With SVG.
5 Flexbox Techniques You Need to Know About — Flexbox best practice.
Styling Text With SVG Filters.
SnapFoo V2 — Improving SVG Animation with SnapSVG — апгрейдим SVG анимацию.
Pure CSS Games with Counter-Increment — пишем игры на CSS.
Interview with Håkon Wium Lie — интервью с создателем CSS.
CSS4 variables with fallbacks using SASS — используем CSS4 переменные.
MaintainableCSS — подход Адама Сильвера к написанию поддерживаемых стилей в 8 главах.
Houdini: один из самых впечатляющих проектов в CSS, о котором вы никогда не слышали.
Lint your CSS — используем style lint.
Что такое CSS-модули и зачем они нам?
Inline CSS at Khan Academy: Aphrodite.
JSCS — end of the line — JSCS 3.0.
Finally, CSS In JavaScript! Meet CSSX — СSS эволюция.
Полное руководство по псевдоклассам и псевдоэлементам.
Beginning with 3D WebGL (pt. 4) — Animation.
Этажи: 3D-навигация на WebGL в 2gis.ru.
Подготовка к использованию WebGL.
5 Typical JavaScript Interview Exercises — обязан знать каждый.
JavaScript Testing: Unit vs Functional vs Integration Tests — Eric Elliott о тестирования JavaScript приложений.
Inside Babel Stages — изучаем Babel плагины.
Inspecting WebSocket Traffic with Firefox Developer Tools — работать с WebSocket стало проще.
Issue 4: Offline badging, DevTools, Testing, Travis, Web Storage, Service Worker Scopes. Data-driven Development, Compute Engine — Эдди Османи про все.
Progressive Web Apps with Service Workers — небольшой экскурс в Service Workers.
Quick Tip: Try WebAssembly in Your Browser Today — работаем с WebAssembly уже сегодня.
Почему нельзя использовать Backbone.js в 2016 году.
3 Lightweight React Alternatives: Preact, VirtualDom & Deku — 3 альтернативы React.
LazyDOM — an experiment to bring virtual DOM to the browser natively — пробуем сделать нативный virual DOM.
Lessons learned at React Amsterdam — отчет с React Amsterdam.
Слайди и демо доклада про MobX на React Amsterdam.
Testing React Applications: React Amsterdam 2016 — доклад о тестировании Reaсt-приложений.
React — Basic Theoretical Concepts.
React-компоненты с привкусом БЭМ.
Index as a key is an anti-pattern — почему нельзя использовать индекс элемента в массиве в качестве ключа для React-компонент.
Structor a playground for React Apps.
Say Hello to React CDK — упрощаем разработку React-компонентов.
UI Testing in React — React Storybook в тестировании.
React Elements vs React Components vs Component Backing Instances.
React Native Cheat Sheet — интересные проблемы и решения в разработке.
React Native: A year in review — что нам подарил React Native.
Announcing NativeBase: The missing piece of React Native — писать на React Native стало проще.
Dead Simple Layouts with React Native — используем Easy Grid в React Native приложениях.
Why Meteor is the Perfect Backend for React Native.
5 Open Source React Native Projects To Learn From — смотрим на React Native из песочницы.
Angular 2 + Meteor: the Javascript stack of the future.
Improving Angular performance with 1 line of code — как улучшить твое Angular приложение одной строчкой.
5 Rookie Mistakes to Avoid with Angular 2 — решение основных ошибок при разработке Angular 2 приложений.
Hacking Angular2: Binding Multiple DOM Events.
NG-Conf 2016 Summary — Day One, Two, Three — обзор ng-conf 2016.
AngularJS Authentication Screencast Series — Part 1, Part 2, Part 3, Part 4.
Angular 2 Series — Forms and Custom Validation — Auth0 про работу с формами на Angular 2.
React для Angular-разработчиков.
Announcing Vue.js 2.0 — что нового в Vue.js 2.0.
A Farewell to FRP — новый ELM 0.17.
Tuning Meteor Mongo Livedata for Scalability — Mongo Livetime в Meteor 1.3.
Deploying Meteor With Docker on AWS ECS — деплоим Meteor приложение.
Новые статьи от Apollo:
— Introducing the Apollo GraphQL data stack;
— GraphQL-JS: The hidden features — GraphQL под микроскопом;
— GraphQL schema decorators;
— Power tools for your API — инструменты для разработки приложений на GraphQL;
— How do I GraphQL? — сравниваем Rest и GrapQL архитектуру;
— The Business Case for GraphQL.
ES6 in Node v6 — скоро ли отказываться от Babel?
ES6, ES7, and beyond — V8 про новые EСMAScript стандарты.
Туториалы
360 Degrees Product Viewer — вращаем предметы на 360 градусов.
Animated Heat Distortion Effects with WebGL — создаем анимацию с WebGL.
Working with Images in Stylesheets with PostCSS.
Creating Wavescroll — создаем переходи волной на CSS.
Learn Regular Expressions in 20 Minutes — быстрей экскурс в регулярные выражения.
How to Build a Todo App Using React, Redux, and Immutable.js.
Tutorial: Let’s Build a Redux Powered React Application.
Quick Tip — Installing and Getting Started with Cordova.
Easy App Publishing with React Native and Siphon — играем с React Native.
React Native ScrollView animated header — скоролинг анимация в React Native.
You Don’t Know Node: Quick Intro to Core Features — введение в Node.js.
Node Hero — Node.js Database Tutorial — подключаем БД в Node.js приложение.
Tessel 2: Pairing JavaScript and the Internet of Things with Ease — интернет вещи с Node.js.
Tutorial: How to build a GraphQL server — строим приложение на GraphQL вместе с Apollo.
Посмотреть
Fronteers Spring Conference 2016.
IntersectionObserver API — In 60 Seconds — реализации ленивой подгрузки изображений.
Zero to GraphQL in 30 Minutes.
Meteor + ReactJS — разрабатываем приложение с нуля.
TL;DW — Swipeable Cards и Easy Easing — мастер-классы Пола Льюиса в Supercharged.
Третий сезон Totally Tooling Tips с Эдди Османи.
Real World Lessons on the Pain Points of Node.js Applications.
Apollo, GraphQL, React Native, and the future of Meteor.
Послушать
Frontflip Podcast 17 — редизайн Вконтакте.
Веб-стандарты — 12, 13, 14 и 15 выпуски.
Radio.js — выпуск 39: React Amsterdam, WebUSB, eslint и jQuery Foundation.
JavaScript Air:
— 18. Reactive Programming in JavaScript;
— 19. Internet of Things with JavaScript;
— 20. JavaScript Frameworks: Ember;
— 21. On site at ng-conf.
Библиотеки
JS-Mind — глубинного машинного обучения на ES6.
Lebab — ES5 to ES6.
Standalone — создаем независимые React компоненты.
Sketchpad — рисования на холсте с реализацией undo/redo.
Atrament — рисования на холсте level-up.
Algebrite — вычисление стали проще.
Aphrodite — инлайн стили.
Oboe — потоковая подгрузка JSON.
Inquirer — набор инструментов для разработки приложений командной строки.
Lavalamp — альтернатива бесконечному скролу.
ThinScript — язык программирования, компилируемый в JavaScript, WebAssembly и C.
React Native Easy Grid — разметка для React Native.
Grafi — редактируем фотографии.
React-mt-svg-lines — анемируем SVG.
PostGraphQL — PostgreSQL на GraphQL.
Mobx Reactor — MobX level up.
Reactotron — мониторинг React-компонент.
Демо
Interactive 3D Mall Map — интерактивная карта торгового центра.
THREE Image Transition — красивый переход.
CSS 3D Solar System — солнечная система на CSS.
Остальное
Release Notes for Safari Technology Preview 3.
WebExtensions in Firefox 48 — расширения Chrome можно будет запускать в Firefox 48.
Meteor Roadmap — что уготовил нам Meteor.
Unstuck Webpack — интерфейс для настройки Webpack.
React Native Newsletter — новости с мира React Native.
Finance React Native — курс валют на React Native.
CSSConf Budapest 2016 — текстовая трансляция.
Min — минималистичный браузер на Electron.
Flexbox Patterns — готовые решение UI компонентов, используя Flexbox.
Angular2 Style Guide — как следует писать на Angular2.
An Angular Webpack Starter kit.
Hовые методы для работы с DOM: prepend, append, before и after.
Визуализация истории развития интернета.
Песочница для работы с нейронной сетью.
What every Browser knows about you — что знает ваш браузер о вас.
React.run — песочница для тестирования React-компонент.
12 Free Games to Learn Programming — учим/играем.
JavaScript по-русски — pycckuu.js.
Telegram чаты и каналы для разработчика.
Chrome React Perf — тестируем React.
The Super Tiny Compiler — миниатюрный компилятор с хорошо документированным кодом на JavaScript.
Grammarly ищет талантливых инженеров. Нашим продуктом пользуются миллионы пользователей каждый день. У нас замечательная команда, мы используем передовые технологии и решаем интереснейшие технические задачи. Смотрите открытые позиции и присоединяйтесь.
С вами был Григорий Шехет. Оформить дайджест помогли мои коллеги.
← Предыдущий выпуск: Frontend дайджест #13.
