Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.
Веб-разработка |
CSS |
Javascript |
Браузеры |
Занимательное |
Веб-разработка
- Основные принципы разметки в HTML 5.1 (Document Outlines in HTML 5.1)
- Маскирование изображений с помощью SVG
- Самый простой и производительный способ подключать ссылки для социальных медиа
- Нам нужно поговорить о техническом долге (We Need to Talk About Technical Debt)
- Девять ресурсов, на которых можно учиться кодить по 15 минут в день
- Тренды:
- Языки, фреймворки и инструменты, которые вы «должны» изучить в 2017-м
- Топ JS фреймворков и тем для изучения в 2017-м
- 5 «лучших» Javascript фреймворков для изучения в 2017-м
- Размышления о будущем веба (Access and Experience: The Future Web)
- Производительность и оптимизация:
- Про оптимизацию рендеринга — с оптимизмом
- Мгновенные статические веб-страницы с помощью Service Worker
- Анимация 60fps в вебе
- Сохраняем интернету 2000 терабайт в день благодаря оптимизации Font Awesome
- Доступность:
- Accessibility — обновленное руководство MDN по доступности: основы WAI-ARIA, HTML и CSS, мультимедиа и мобильная доступность
- Доступность в вебе — разработка веба с эмпатией (Web Accessibility — Developing web with empathy)
- Опасайтесь вложенности ролей (Be Wary of Nesting Roles)
- AMP & PWA:
- Progressive Web AMPs
- Урок, который я получил, работая с AMP от Google
- CloudFour делится опытом перевода сайта в PWA (Hey, Hey, Cloud Four is a PWA!)
- Создание Web Bluetooth Progressive Web App
Медиа
- Подкаст «Веб-стандарты», Выпуск №45: Chrome 55, отладка гридов, парсер URL, PWA как APK, Supports, CSS в JS и бэктики, шрифты в Медузе, инструменты 2016.
- Подкаст radiojs, Выпуск 43: Фиолетовый паттерн. RxJS 5, PRPL паттерн, HTTP 2.0 vs бандлинг
- Я.Субботник по фронтенду — запись прямой странсляции и слайды (10 декабря)
- KharkivJS #7 2016
- Chrome DevTools: Optimise your Web Development Workflow 2016. Материалы по докладу от Umar Hansa, включающий в себя видео, 177 слайдов и бонусный контент
- CSSConf.Asia 2016
- JSConf.Asia 2016
- ffconf 2016
- ReactiveConf 2016
CSS
- Анимации на GPU: делаем это правильно
- Битва css-in-js
- Директива CSS @support и ее двойник в JS. Готовы к использованию! (CSS support directive and its JS twin. Ready to use!)
- CSS Grid! Оптимистичное мини-интревью Эрика Мейера о грядущем CSS Grid Layout
- Virtual CSS c помощью Styletron
- BEM и поддерживаемый CSS
- Мощь селекторов CSS и как их использовать
- Балансировка текста в отзывчивом дизайне
- Гибкая типографика с помощью :root
- Сокращенный синтаксис CSS рассматривается как антипаттерн (CSS Shorthand Syntax Considered an Anti-Pattern)
- Изучение linear-gradient() с помощью разработки сложного шахматного узора
- Новый мир: написание CSS в ClojureScript и жизнь после Sass
- Использование CSS переменных в разработке сайтов (Using CSS Variables in Site Development)
- Циклы в CSS препроцессорах
- CSS object-fit для добавления мощности вашей верстке
JavaScript
- Нейронные сети на JS. Создавая сеть с нуля
- Дорогой JavaScript, мне хочется рассказать тебе о проблеме в нашем сообществе.
- React, Web Components, Angular и jQuery — друзья навеки. Универсальные JavaScript-компоненты
- Челендж JavaScript30
- Распутываем спагетти-код: как писать поддерживаемый Javascript
- Забавные хаки для ускорения контента
- Нативная разработка JavaScript после Internet Explorer
- Отображаем динамические сообщения с помощью Web Notification API
- Как должны работать табы по версии Реми Шарпа
- Примеры JavaScript кода, актуального для 2016-го года по версии автора (Enough JavaScript to be dangerous in 2016)
- Урок по созданию Scrollspy-навигации на JS
- styletron — универсальные высокопроизводительные стили css-in-js
- Новости:
- Релиз V8 версии 5.6 (V8 Release 5.6)
- Angular 1.6 уже здесь, и вот что вы должны по этому поводу знать
- Релиз Angular 2.3.0
- Текущее состояние Babel и его планы на будущее
- Анонс TypeScript 2.1, TypeScript 2.1: async/await для ES3/ES5
- Async/Await заработали в Firefox
- ES6:
- Путеводитель по JavaScript Promise для новичков
- Неизменяемый JavaScript: как это делается с ES6 и выше
- Что и как в ES6: хитрости, лучшие практики и примеры. Часть вторая. Мэпы, слабые мэпы, обещания, генераторы, async / await, геттеры / сеттеры, символы
- Статическая типизация и Flow:
- Основы Flow за 10 минут (The Fundamentals of Flow in 10-ish Minutes)
- Проверка типов в JavaScript: Начало работы с Flow. (Type Checking In JavaScript: Getting Started with Flow.)
- Зачем использовать статические типы в JavaScript? Часть I, II & III
- Возможно вам не понадобится TypeScript (или статические типы) (You Might Not Need TypeScript (or Static Types))
- Фреймворки:
- Основы производительности React-приложений
- Можно ли обойтись без jsx и зачем?
- Переведена документация Vue.JS 2.x
- 5 бесплатных туториалов по VueJS
- Laravel выбрал Vue, но вы не должны (заменив его на React)
- Если вы перешли с React на Vue, почему вы это сделали? Большой тред на reddit
- React на серверной стороне (Server Side React)
- Начало квеста по написанию кода: Как написать свой первый React компонент
- Ошибочное сравнение React и Angular (Wrong comparisons between React and Angular)
- Почему мы выбрали Angular 2 вместо React для нашей ентрейпрайз разработки
- Плагины:
- pulltorefresh.js — быстрый и мощный плагин для реализации pull-to-refresh в вашем веб-приложении
- myScale — Quick SVG Icon Resizer
- Siema — очередная легкая и простая карусель без зависимостей
- es-beautifier — ECMAScript beautifier based on eslint
Браузеры
- Инструмент разработки Firebug закрывается: «Пользуйтесь Firefox DevTools»
- Новая версия браузера Chrome 55 использует примерно на 30% меньше оперативной памяти, нежели предыдущая Chrome 54
- Chrome 56 Beta: “Not Secure” warning, Web Bluetooth и CSS position: sticky
- Google Chrome полностью прекращает поддержку Adobe Flash Player
- Google добавила в Chrome для Android возможность скачивать музыку и видео
- Детали свежего обновления Microsoft Edge — частичная поддержка CSS Custom Properties, Async/await, улучшенная производительность DOM и другое
- Release Notes for Safari Technology Preview 19
Занимательное
- Свершилось! Полноценная Windows 10 приходит на ARM
- YouTube выплатил $1 млрд авторских отчислений музыкантам и лейблам за последние 12 месяцев
- Куда пойти учиться программисту: советы опытного тимлида, преподавателя и новичка
- Мифы, в которые верят программисты
- «Уберите всё со стола» — рассказ разработчика о дистанционном собеседовании в Amazon
- О техподдержке Google или робот с человеческой душой
- Depositphotos назвал 12 главных трендов видео и фото на 2017 год
- Magic Leap — афера на $1.4 миллиарда?
- Самые яркие технологические тренды на Web Summit 2016: как изменится мир в ближайшем будущем
- В Google Play Movies теперь доступны 4K-фильмы
- 4 эксперимента с рукописным текстом с помощью нейронной сети
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: Zfort Group