The digest of fresh materials from the world of the front-end for the last week No. 263 (May 15-21, 2017)

We bring to your attention a selection with links to new materials from the frontend area and around it

Web development

CSS

Javascript

Browsers

Entertaining

Web development

• Podcast Web Standards, Issue No. 69: Samsung, Safari, Google I / O, Git in Atom, GitHub Desktop, Box Alignment, Leah and Mavo, PPK and forms, front-end talk, Perf.HTML, ES-modules.
• Frontend Weekend podcast: FW # 1 - How to become a frontend developer, FW # 2 - Evolution of frontend development, FW # 3 - About MoscowCSS and Moscow Coding School
• How to embed SVG - HTML Shorts
• How to make error messages available
• Full control over control points. In CSS and in JS
• The most interesting sessions with Google I / O for web developers
• Lea Verou presented this week the Mavo library , which turns your HTML markup (including special attributes) into an interactive web application.
  Introduction to Mavo : Build Web Applications with HTML!
• Style Guide Guide - a template for creating a style guide
• Redesigning the front end in Airbnb
• Combined use of Webpack with Gulp 4
• Extensive presentation by Filament Group: accessibility in a responsive world, A11Y Days 2017
• Comparison of the five most popular frontend frameworks in 2017
• Google AMP is used on 2B + mobile pages and on 900K domains, loading twice as fast
• Scott Gilbertson: 'Kill Google's AMP, otherwise it will kill the open Web'
• Three ways to reduce bundle size in webpack
• Updates:
  
  
  • Introducing the new format: JSON Feed
  • Yarn create and Yarn 1.0
  • Integration with Git and GitHub comes in Atom
  • Polymer 2.0 released. Support for ES6, the latest Polymer CLI, starter kit for creating PWA templates and much more
  
  
• PWA:
  
  
  • Progressive Web Applications - norms or nothing?
  • preact-cli: CLI tool for creating PWA applications in seconds
  • Web Components VS Frameworks
  
  
• Spectacular web:
  
  
  • Moments of Happiness , a set of animal demos on WebGL, GSAP and Three.js
  • Create creative splash transitions using CSS and SVG
  • The effect of extracting colors using CSS filters and Vibrant.js
  • An accordion created by one Div (and animated using CSS variables)
  • Fun using VR on the web
  • Experiments with solid-state physics through a graphics accelerator using WebGL / threejs

CSS

• Instruction: CSS optimization of a web page for printing
• Error messages and recommendations. The third part of a series of articles by ppk on the topic of native form validation
• Simplify CSS Cubes with Custom Properties
• learncssgrid.com - CSS grid tutorial
• Learning CSS Grids
• Big mistake media queries
• A detailed article on CSS properties writing-mode & text-orientation
• Some pretty useful `: nth-child` recipes for Sass mixins
• Responsive design in motion . WebKit now supports the media property prefers-reduced-motion, which is part of CSS Media Queries Level 5
• CSS nonlinear interpolation
• Chris Coyer on styling CSS syntax with linters
• “I found really smart CSS in the reddit theme”
• Typography:
  
  
  • Math adaptive typography
  • Responsive and responsive typography with the Hamster Framework. Hemorrhoids treatment without surgery and pain
  • Responsive Rubber Printing with Poly Fluid Sizing
  • Walkthrough for units you can use for font sizes

Javascripts

• Nobody needs your JavaScript bikes: save your time by avoiding rewriting popular features
• Can Google properly parse and index JavaScript frameworks? JavaScript SEO Experiment
• Writing Modern JavaScript Code
• Anatomy of a modern JavaScript application
• Improving the performance of your JavaScript web application
• Why I chose ClojureScript instead of JavaScript
• Don't Complicate Javascript # 0
• Getting started with the JavaScript Web Animation API
• Practical guide on fetch (), reduce () and formatting data from external APIs
• Maybe you do not need to convert JavaScript code
• Video from JSConf EU 2017 Conference
• Theory:
  
  
  • Rethinking JavaScript: Death for
  • Curry, my prodigal son . Translation of Tom Harding: Curry On Wayward Son.
  • We master closures in Javascript . Free translation of the article Let's Learn JavaScript Closures
  • (Not) Everything in JavaScript is an object
  
  
• React:
  
  
  • Подкаст Пятиминутка React #17 — Idiomatic Redux
  • json-api-normalizer: простой спрособ интеграции JSON API и Redux, статья на Хабре
  • react + d3 = vx, компонент для визуализации. Начинаем работать с vx
  • j0nas/light-form — легковесная библиотека для легких React/Redux форм
  • react-pdf — создание PDF файлов с использованием React
  • Видео с React Kyiv April
  
  
• Vue:
  
  
  • Как (безопасно) использовать jQuery плагины с Vue.js
  • Почему разработчики сейчас сравнивают Vue.js с такими гигантами JavaScript, как Angular и React?
  • Vue.js хорош, но лучше ли он, чем Angular или React?
  • Как создать простое SPA с помощью Vue 2 (часть 2)
  • Что такое Vuex? Руководство для новичков по Vue Application Data Store
  • vue-js-modal — простые модальные окна на Vue.js 2.0+
  
  
• Angular:
  
  
  • React vs Angular: две стороны JavaScript
  • Как создать библиотеку для Angular(2+) и опубликовать это дело в npm
  
  
• Libs & Plugins:
  
  
  • Workbox — JS библиотеки для прогрессивных веб приложений
  • leerraum.js — библиотека типов PDF с точным позиционированием и дешифровкой строк
  • delaunator — быстрая библиотека для триангуляции Делоне 2D-точек
  • godzilla — транспайлер кода ES2015 в Go

Браузеры

• Кэширование в браузерах и CDN
• Обновлены макеты переработанного оформления Firefox 57
• Firefox 55 будет запрашивать разрешение на использование Flash по умолчанию
• Анонс стабильной версии Samsung Internet v5.4, с поддержкой DeX, PWA-фишек, Physical Web и других модных штук
• Microsoft Edge на Build 2017

Занимательное

• Основные анонсы Google I/O 2017
• Последние новости о виртуальной / дополненной реальности с Google I/O 2017
• Что там с WannaCry: дешифратор, новые вирусы и зараженная медицинская техника
• Facebook представила инструмент для разработки способного вести диалоги ИИ
• IBM представила свой самый мощный квантовый процессор
• Google опубликовала результаты своего игрового эксперимента Quick, Draw!
• Facebook запустила тестирование раздела для заказа еды из ресторанов
• Стоимость биткоина впервые превысила $2000
• Почему криптовалюты дорожают и стоит ли их покупать
• Новый кампус Apple Park. Последняя презентация Стива Джобса
• Биткоин — пузырь. Но почему он никак не лопнет?
• Контроль и свобода: Как отличается корпоративная культура Apple и Google
• Как бывший инженер Google построил компанию на $1,5 млрд за 21 месяц

We apologize for any typos or broken / duplicated links. If you notice a problem - please write in a personal email, we try to quickly fix them.

← Digest last week
Material prepared dersmoll and alekskorovin