#Frontend WhiteList Frontend WhiteList — это список полезных и интересных авторских статей, переводов, докладов и ресурсов на русском языке для разработчиков интерфейсов.
##Задачи
- Составить список полезных ресурсов для разработчиков интерфейсов
- Продвинуть в массы имена авторов, которые делают отрасль лучше
##Содержание
- Верстка
- CSS
- JavaScript
- Анимация
- Инструменты
- Accessibility
- Браузеры
- Оптимизация скорости загрузки
- Разработка
- [О жизни](README.md#О жизни)
- [О коде](README.md#О коде)
- О готовых решениях
- User Experience
- Progressive Enhancement и Graceful degradation
- Книги
##Верстка
- Валидация форм на HTML и CSS. Chris Coyier. Перевод Алёны Батицкой
- Типографика восток. Роман Прудников (Видео 🎥)
- input. Артём Кувалдин (Видео 🎥)
- Слова, часто используемые в CSS-классах. Юлия Бухвалова
- Логотип не отвечает или временно недоступен. Юлия Бухвалова
- Методическое пособие для начинающих. Стас Мельников
####О мобильных устройствах
- Делать ли мобильную версию? 5 распространенных проблем, которые решает адаптивная верстка. Опыт Яндекса. Артём Курбатов
- Вёрстка для мобильных устройств. Артём Кувалдин и Олег Мохов (Видео 🎥)
####О позиционировании
- Центрирование в CSS: полное руководство. Chris Coyier. Перевод Натальи Фадеевой
- Что такое Flexbox? Описание всех css свойств, основные принципы, преимущества и недостатки. Дмитрий Дудин
- Можно вообще всё. Раскладка по гриду. Вадим Макеев (Видео 🎥)
####HTML Cоветы
- FrontendLab: Признаки хорошей верстки. Роман Братченко (Видео 🎥)
- Распространенные ошибки начинающего HTML-верстальщика. Стас Мельников
- Краш-тест вёрстки
- "Что поправить в верстке перед выпуском в продакшн?". Антон Ахатов
##CSS
####О свойствах
- Свойство background-clip и его применения. Ana Tudor. Перевод css-live.ru
- Как я научился любить скучные мелочи CSS. Peter Gaston. Перевод Веб-стандарты
- Кружевные орнаменты на CSS. Марина Кузнецова
####Об организации
- Основные правила и принципы написания CSS. Гарри Робертс. Перевод Владимира Старкова
- Как работать с CSS-препроцессорами и БЭМ. Николай Громов
- Организация кода для CSS препроцессоров. Brian Rinaldi. Перевод Руслана Каймакова
- Битва архитектур. Mariano Miguel. Перевод css-live.ru
- Способы организации CSS-кода
- «Пишем БЭМ правильно». Игорь Зенич (Видео 🎥)
- А вы верите в систематизацию, или методологии верстки? Елизавета Селиванова и Ирина Левина
- BEMup для начинающих 09.12.2016. Владимир Гриненко. (Видео 🎥)
##JavaScript
- 4 вида утечек памяти в JavaScript и как с ними бороться. Андрей Алексеев
- S.O.L.I.D-ый JavaScript. Алексей Охрименко (Видео 🎥)
- Классическое программирование для фронтендеров. Игорь Алексеенко (Видео 🎥)
- Функциональное программирование в браузере. Никита Прокопов
- Делаем свой JavaScript чистым. Jack Franklin. Перевод prgssr.ru
####Об основах
- Современный учебник JavaScript. Илья Кантор
- Сводная таблица с результатами работы условий
- Область видимости в JavaScript и «поднятие» переменных и объявлений функций
- Как работают замыкания (под капотом) в JavaScript. Hexlet
- Асинхронность в JavaScript: Пособие для тех, кто хочет разобраться. Wrike
- Техники работы с DOM: родительские, дочерние и соседние элементы. Louis Lazaris. Перевод prgssr.ru
- Фронтенд. DOM, Events. Артем Мезин (Видео 🎥)
####JavaScript Советы
####Руководства по библиотекам и фреймворкам
- Handlebars. Руководство к действию. Олег Лазарев
- Правила хорошего тона при написании плагина на jQuery. Валерий Чупурнов
- Руководство по Flux в картинках. Lin Clark. Перевод Анастасии Абакумовой
- Redux в картинках. Lin Clark. Перевод Анастасии Абакумовой
####О библиотеках и фреймворках
- Цена использования фреймворков. Paul Lewis. Перевод Mail.Ru Group
- Жизнь после js-фреймворков. Андрей Ваганов (Видео 🎥)
##Анимация
- Производительность визуализации
- Аппаратное ускорение. Александр Завьялов (Видео 🎥)
- Веб-анимация на JS и CSS. Александр Завьялов (Видео 🎥)
####CSS-анимации
- CSS Triggers. Таблица со свойствами и процессами, происходящими при изменении свойств
- Руководство по CSS Animation. Юлия Бухвалова
- Всё, что вам нужно знать о CSS-свойстве will-change. Sara Soueidan. Перевод Opera Software
####JavaScript-анимации
####SVG-анимации
####Руководства по созданию анимаций
##Инструменты
- Автоматизация для фронтендеров. Роберт Харитонов (Видео 🎥)
- Bower: зачем фронтенду нужен менеджер пакетов. Артём Сапегин
- Введение в пакетный менеджер NPM для начинающих. Peter Dierx. Перевод prgssr.ru
- Автоматизация регрессионного тестирования CSS. Garris Shipon. Перевод prgssr.ru
- Перевод книги "Pro Git"
- Модульная сборка БЭМ-проектов. И никаких bem-tools. Владимир Гриненко (Видео 🎥)
- Автоматизация хранения графики. Тимофей Чаптыков (Видео 🎥)
- Cистемы сборки фронтенда. Gulp (Видео 🎥)
- Суперсилы Chrome Dev Tools. Роман Сальников (Видео 🎥)
- Стек технологий JavaScript с нуля. Jonathan Verrecchia. Перевод от UsulPro
##Accessibility
- Недоступный веб: как мы развели такой бардак. Mischa Andrews. Перевод Алексей Уколов
- Браузеры наши меньшие, или Нам нужно серьёзно поговорить. Вадим Макеев
- Альтернативный текст для изображений. Ire Aderinokun. Перевод prgssr.ru
- Дизайн государственных систем
- Слепая доступность. Юрий Артюх
##Браузеры
- Модель отображения. Основы. Олег Мохов (Видео 🎥)
- Модель отображения. Тонкости. Олег Мохов (Видео 🎥)
- Модель отображения. Браузеры. Олег Мохов (Видео 🎥)
- WebAPIs. Сергей Гоголев, Максим Воронцов, Олег Семичев (Видео 🎥)
- Принципы работы современных веб-браузеров. Tali Garsiel и Paul Irish. Перевод html5rocks.com
- Фронтенд. Хранение данных.Иван Чашкин (Видео 🎥)
##Оптимизация скорости загрузки
- Условная загрузка для адаптивного веб-дизайна. Андрей Голуменов
- Критический путь рендеринга веб-страниц. Николай Лавлинский
- Клиентская точка отказа: SPOF за счет внешних JS-библиотек Николай Лавлинский
- Представляем RAIL: модель оценки производительности сайта. Paul Irish и Paul Lewis. Перевод Николай Мациевский
- В погоне за производительностью. Денис Мишунов (Видео 🎥)
- Производительный client-side. Роман Парадеев (Видео 🎥)
- Верстка. Вид снизу. Марина Широчкина (Видео 🎥)
- Жесточайшая оптимизация загрузки веб-страниц. Дмитрий Дудин (Видео 🎥)
- Фронтенд. Сетевое взаимодействие. Артем Мезин и Егор Дыдыкин (Видео 🎥)
- Загрузка главной страницы. Павел Минеев (Видео 🎥)
- Оптимизация фронтенда. Олег Мохов (Видео 🎥)
- Improving Smashing Mag's Performance. Виталий Фридман (Видео 🎥)
##Разработка
- Словарь терминов по фронтенду. Вадим Макеев и Ольга Алексашенко
- О чём должен помнить веб-дизайнер. Николай Громов и Андрей Алексеев
####О жизни
- 36. Вадим Макишвили (Видео 🎥)
- Как я перестал верить технологиям. Алексей Симоненко (Видео 🎥)
- "Старикам здесь не место?". Олег Мохов и Алексей Симоненко (Видео 🎥)
- Ошибка. Осознание, примирение, извлечение пользы. Вадим Макишвили (Видео 🎥)
- Заметки о собеседованиях для веб-разработчиков. Артём Сапегин
####О коде
- Принципы и приёмы написания эффективного кода. Александр Завьялов (Видео 🎥)
- Типичные ошибки начинающего верстальщика. Олег Мохов (Видео 🎥)
####О готовых решениях
- Не учите фреймворки, учите архитектуру
- О jQuery и Bootstrap: расставляем точки над «i». Андрей Романов
- NPM и left-pad: мы разучились программировать?. David Haney. Перевод Анатолий Ализар
##User Experience
- UX-мифы. Zoltán Gócza и Zoltán Kollin. Перевод Ринат Рехимкулов и Петр Андрианов
- Как отравить мобильного пользователя. Martin Michálek. Перевод prgssr.ru
##Progressive Enhancement и Graceful degradation
- Идеологии разработки веб интерфейсов. Сергей Горобцов (Видео 🎥)
- Улучшение формы комментариев. Michael Scharnagl. Перевод Анны Кухаревой, редактура Вадима Макеева, Юли Бухваловой и Алексея Симоненко
##Книги
- Реактивные веб-сайты. Клиентская оптимизация в алгоритмах и примерах
- JavaScript. Шаблоны
- Секреты JavaScript ниндзя
- JavaScript. Подробное руководство
- JavaScript. Оптимизация производительности
- Отзывчивый веб-дизайн
- Выразительный JavaScript
- Паттерны для масштабируемых JavaScript-приложений
##Как помочь проекту
- Предложить ресурс с указанием автора(по возможности) в задачах или сделать пулреквест
- Поделиться ссылкой с друзьями и коллегами
Главные редакторы: Стас Мельников и Артем Андреев. Все редакторы. Распространяется по лицензии CC-BY-SA 4.0.