Дайджест свежих материалов из мира фронтенда за последнюю неделю №218 (27 — 3 июля 2016)
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда
Веб-разработка |
CSS |
Javascript |
Браузеры |
Новости и занимательное |
Веб-разработка
-
Собираем ваш первый 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 strong is 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.