Дайджест свежих материалов из мира фронтенда за последнюю неделю №218 (27 — 3 июля 2016)04.07.2016 03:48

Веб-разработка

• Собираем ваш первый WebAssembly-компонент
• Важные аспекты работы браузера для разработчиков. Часть 1
• Подкаст Веб-стандарты, Выпуск №22. Покупка Joyent, Element Queries, React в Mail.Ru, стандарты и семантика, собеседования, как верстальщику стать замтехдира c Андреем Суминым из Mail.Ru.
• Путь наставника. Статья Максима Усачева с развернутыми комментариями Алены Батицкой
• Создание интерактивного видео на HTML5
• Дело не в моральных принципах: доступность нужна всем. Перевод статьи It«s Not About Morals: Accessibility is for the Masses сообществом css-live.ru
• Лучшие практики кэширования. Перевод статьи Caching best practices & max-age gotchas Джейка Арчибальда
• AMP HTML, обзор
• Как стать великим фронтенд {вставьте баззворд}? (How to be a great Front-End {insert buzzword}?)
• Как инспектировать и модифицировать анимацию с помощью Chrome DevTools Animation Inspector.
• Методы создания доступных интерфейсов (Ways to Make a UI Accessible — Part I)
• В поисках времени для улучшения своих навыков разработчика (Finding Time to Become a Better Developer)
• Dreamweaver возвращается для нас, кодеров. (Dreamweaver is back for us, coders.)
• Website Grader — тестирование сайтов на предмет оптимизации (How strongis your website?)
• Предзагрузка веб-шрифтов для игр на HTML5 (Web Font preloading for HTML5 games)
• Имитация относительного позиционирования внутри SVG с вложенными SVG (Mimic Relative Positioning Inside an SVG with Nested SVGs)
• Запись стрима с Web Rebels 2016: День 1, День 2
• Эффектный веб:
  
  • Стрелочные SVG-часы (SVG Working Clock)
  • Трансформирующиеся тетраэдры от Anna Tudor (tetrahedron truncation sequence)
  • Эффект заката с помощью прокрутки с JS и SVG (A Scrolling SVG Sunset)
  • SVG-анимация для появляющихся на странице элементов (Item Reveal Animations with SVG)
  • Эффектные концептуальные анимации для различных элементов интерфейса (How To Use Code As Your Primary Design Tool)
  • Еженедельная подборка красивых эффектов на CSS/SVG/JS #44
  
  

CSS

• Магия CSS. Глава 6: Переходы. Все, что вам нужно знать о переходах в CSS
• Языки, которые могли бы стать CSS-ом (The Languages Which Almost Became CSS)
• Битва архитектур. Взгляд на два популярных метода написания CSS, и объяснение, почему они не достаточно хороши (Battle of the architectures)
• Взаимодействие между JavaScript и CSS c помощью нативных CSS переменных (Communicating Between JavaScript and CSS Using CSS Variables)
• Демонстранция 16-ти эффектов смешивания средствами CSS
• PostCSS — трансформация вашего CSS с помощью JS (PostCSS — Transforming Your CSS with JavaScript)
• Переход в будущее CSS с PostCSS (Jump into the future of CSS with PostCSS)
• Работа с критическим CSS с помощью плагина на PostCSS (Manage your Critical CSS with this PostCSS plugin)
• Все типы данных в CSS (All the Generic CSS Data Types)
• Представление CSS-свойства text-align-last (Introducing the CSS text-align-last Property)
• История техник замены изображений с помощью CSS (A History of CSS Image Replacement)
• Michelangelo Styleguide — живое руководство по стилям, базирующиеся на комментариях в коде
• CSS-изображения, реализованные одним div-ом (A Single Div:)
• Nth-child Sass Mixins
• progress-tracker — гибкий SASS компонент для создания пошагового процесса заполнения форм, опросов, таймлайнов и т.п.

JavaScript

• Нейронные сети на Javascript
• D3.js. Визуализация графов
• Все, что нужно знать о теге script
• Введение в функциональный JavaScript: Часть 3
• Новая игра для программистов появилась в Steam: управление виртуальным миром с помощью JavaScript
• Автоматическое улучшение качества фронтенд проектов, ч.3 — JavaScript и Accessibility (Improving the Quality of Front End Projects, Automatically!)
• Юнит-тестирование JavaScript для начинающих (JavaScript Unit Testing For Beginners)
• Интеграция и сравнение ES6 (Integration and Comparison for ES6)
• ES5 Objects vs. ES6 Maps — разница и сходство
• Введение в асинхронный JavaScript (Introduction to asynchronous JavaScript)
• Что необходимо знать, чтобы пройти собеседование по JavaScript, как ас? (What Do I Need to Know to Ace a JavaScript Interview?)
• JavaScript паттерны: синглтон (JavaScript Design Patterns: The Singleton)
• Создание массивов в JavaScript (Power up the array creation in JavaScript)
• Реальные примеры использования Mutation Observer (Three Real-World Uses for Mutation Observer)
• Что необходимо знать (и потенциально опасно) о сторонних скриптах (Things to Know (and Potential Dangers) with Third-Party Scripts)
• Подсказки при наборе JS кода (Type Hinting in JavaScript)
• DOMContentLoaded vs jQuery.ready vs onload, или как выбрать, когда ваш код должен выполниться
• Фреймворки:
  
  • Введение в Redux (An Introduction To Redux)
  • Анимация интерфейсов с помощью React — правильный путь (UI Animations with React — The Right Way)
  • Библиотеки React UI (React UI Libraries)
  • Проектируем, используя концепции React (Thinking in React)
  • Использование JSX и React (Using JSX and React)
  • Назад в будущее, или получение данных в React.js (Forward to the Past or data fetching in React.js)
  • [ReactRouter] в чем разница между HashHistory и BrowserHistory? ([ReactRouter] BrowserHistory in Production)
  • react-modal-box — модальные окна для приложений (react-modal-box is a simple dependency free and customizable React Component to display Modals on your application)
  • NativeBase — мощное дополнение к React Native (NativeBase — the missing piece of React Native)
  • Урок по Angular 2: как создать CRUD приложение с Angular CLI (Angular 2 Tutorial: Create a CRUD App with Angular CLI)
  • Angular 2 — лучшие практики повышения своего уровня (Angular 2 — Best Practises to Level Up)
  • Быстрая кросс-платформенная разработка с Angular 2 CLI (Rapid Cross-Platform Development with the Angular 2 CLI)
  • Подготовка Angular 2 приложения для продакшена (Building an Angular 2 Application for Production)
  
  
• Плагины:
  
  • Введение в разработку jQuery плагинов (Introduction to Developing jQuery Plugins)
  • anime-js — новая библиотека для анимации, которая работает с CSS, индивидуальными трансформациями, SVG, атрибутами DOM и объектами JS
  • Vidage — решение для полноэкранного видео и изображения (Vidage — your solution to full-screen background video & image combined)
  • crio — неизменяемые объекты и массивы (crio — immutable objects and arrays in a natural way)
  
  

Браузеры

• Никогда не сдавайся: как Netscape вел неравную борьбу с Internet Explorer
• Браузер Chrome для Android получит поддержку виртуальной реальности
• В Firefox появились контейнеры
• Браузерные тренды июля 2016
• Улучшенная загрузка шрифтов в WebKit (Improved Font Loading)

Новости и занимательное

• Выпущен неофициальный консольный клиент для Stack Overflow
• Google запустила открытую hardware-платформу для обучения детей программированию
• Facebook запустил возможность публиковать посты на 45 языках одновременно
• Картографические сервисы Google обновились: качество снимков увеличилось
• Масштабная чистка аккаунтов в YouTube лишила блогеров сотен тысяч подписчиков
• Каждый пятый компьютер работает на Windows 10
• «Пять законов робототехники»: Google изложила свое видение безопасного ИИ
• «Со смертью кодинга инженеры повернутся лицом к остальной части человечества». Разработчик компании AnyPerks Лорен Мендоза написала на Medium заметку о том, что написание кода и профессия программиста переоценены и в будущем необходимость в них снизится.
• Стартапы, которые покупает Google: обзор сделок корпорации за последние 15 лет
• 9 новых технологий, которые вы можете освоить за лето и стать ценнее на рынке труда
• День, когда Evernote умер для меня и что теперь делать?
• Сотрудники Microsoft назвали главные преимущества и недостатки работы в компании
• Давид Хомак: Лекция про интернеты
• Диджитал джоинт: зачем Microsoft и остальные связываются с продажей марихуаны
• 10 названий технологических брендов, которые вы наверняка произносите неправильно

Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.

Комментарии (2)

• Denai

  4 июля 2016 в 01:04 (комментарий был изменён)

  +1

  ↑

  ↓

  Насчёт «чистки» Youtube — просто поправили баг счётчика, вызванный youtube gaming. Раньше человек считался за двух в некоторых ситуациях, теперь цифра ближе к правде. Настоящих подписчиков никто не лишался.

• Extraz

  4 июля 2016 в 01:18

  0

  ↑

  ↓

  Спасибо! Немало интересного