Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.
Веб-разработка |
CSS |
Javascript |
Браузеры |
Занимательное |
Веб-разработка
- Правила использования ARIA в HTML
- Подкаст Веб-стандарты, Выпуск №59: Chrome 57, бета Samsung Internet, Safari TP, гриды на практике, выражения от контейнера, прокрутка в вебе, оптимизация шрифтов.
- Фронтёрки: новый подкаст про фронтенд и людей, который ведёт Тим Маринин. Первый выпуск с Вадимом Макеевым в гостях
- Незрячий программист — о разработке «на слух» и доступности интернета
- Web Developer Roadmap — 2017
- Создание HTML писем под Gmail: 12 вещей, о которых вы должны знать
- HTML5 Video и Audio: разметка
- Формы HTML5: типы полей ввода (часть 2)
- Что такое цветные шрифты?
- Виталий Фридман представляет новую версию Smashing Magazine
- Эффект многослойного движения по наведению
- SVG:
- Оформление SVG-фигур бесплатный курс HTML Академии
- Трибьют анимации Miyazaki – с SVG и GSAP
- 7 решений для создания более доступных SVG
- shapeshifter — веб-приложение для создания морфинг-анимации в SVG
- Производительность:
- Веб-производительность топ 100 сайтов для путешествий
- Что такое HTTP/2?
- Преимущества производительности в технике прогрессивого улучшения
- Почему WebAssembly быстрее asm.js
- Первый взгляд на WebAssembly
- Итоги AMPconf: AMP — производительный фреймворк, который взрослеет
- Мы верим в AMP (In AMP we trust)
- Инструменты:
- Создание Alix, Chrome-расширения для линтинга HTML
- Как передавать параметры через командную строку в Gulp задачи
- animista — онлайн-сервис для удобного создания CSS анимации
- Console Importer — простой импорт JS и CSS ресурсов через консоль в Chrome
- Практика
- Реализуем пуш-уведомления на фронтенде и бэкенде
- Minecraft в WebVR с помощью HTML используя A-Frame
- Web Components: как создать свои собственные кастомные компоненты
CSS
- Проблема выбора структуры документа
- Новая версия оптимизатора CSSO 3.0.0, с отдельным CLI и новым парсером CSSTree
- CSS Grid Layout:
- Как грид-раскладка (Grid Layout) провела лето
- Начинаем работать с CSS Grid , от Robin Rendle на css-tricks
- Как организовывать и выравнивать элементы в Grid Layout
- CSS Grid Layout и прогрессивное улучшение
- CSS Grid VS Flexbox: практическое сравнение
- Знакомимся с CSS Grid Layout, подробная статья от Chris Wright
- CSS Grid Layout здесь, чтобы остаться. История, о разработке CSS Grid Layout в Chromium/Blink и Safari/WebKit, выполненной Igalia с помощью поддержки Bloomberg
- Пишем модульный CSS (часть 1)
- Как модернизировать ваш CSS с помощью css-js-loader
- Waffle grid — простая система гридов на flexbox
- Предотвращение reflow
JavaScript
- Краткая история JavaScript. Часть 1
- Эволюция модульного JavaScript
- Фильтрация и создание цепочек в функциональном JavaScript
- Асинхронный JavaScript против отложенного
- Вышел jQuery 3.2.0. Среди всего прочего — поддержка кастомных свойств CSS
- Привычкаи эффективных JavaScript разработчиков
- Заменит ли WebAssembly JavaScript?
- Три хака при работе с массивами
- Управление асинхронными зависимостями с JavaScript
- Вещи, которые вы должны знать про объекты и иммутабельность в JavaScript
- ES2015+:
- Новинки JavaScript: Асинхронные итераторы
- 5 особенностей, которые вы можете использовать в ES6 уже сегодня
- Понимание классов в ES6
- Communicating Sequential Processes: альтернатива асинхронным генераторам от Dr. Axel Rauschmayer
- React:
- Готовим плацдарм для react-приложения
- Представление библиотеки React Loadable
- Представление React Native App (Introducing Create React Native App)
- Жизненный цикл методовв react, объясненный на примере детского танца
- Angular 2 vs React – финальная битва – раунд 2
- Маршрутизация в React, несложный способ
- Мемоизация React компонентов
- React Router — изучение роутинга
- Быстрые советы для React-Redux приложений
- Vue:
- Как создать SPA c помощью Vue 2 (часть 1)
- Откуда взялся Vue.js?
- Быстрое введение в VueJS
- Пишем компоненты Vue.js с Flow
- Простой серверный рендеринг с Vue.js и Express
- bottle-vue-kickstart — стартовый пакет с Vue.js, включающий Axios, Bulma.io, Babel и Webpack 2
- Eagle.js — слайдшоу фреймворк на Vue.js для хакеров
- Angular:
- Планируем приложение на Angular
- 5 функций, на которые нужно обратить внимание в Angular v4
- Понимание архитектуры компонентов: рефакторинг Angular приложения
- Как создать Angular приложение: добавление стилей с Kendo UI
- Plugins & libs:
- HyperApp — JS библиотека на 1kb для создания фронтенд приложений с привкусом Elm
- Sazerac — модульное тестирование, основанное на данных для Jasmine, Mocha и Jest
- Fetch Inject — вставка ресурсов в DOM с использованием Fetch Injection
- Planck.js — физический 2D движок
Браузеры
- Тестирование Firefox 53-beta и Firefox Developer Edition 54
- Причина прекращения поддержки звуковой системы ALSA в Firefox
- Chrome 57 умерил аппетиты фоновых вкладок для экономии энергии
- Chrome 56 получил поддержку WebGL 2.0
- Разработчики Chrome намерены перейти к полной остановке выполнения фоновых вкладок
- В Chromium добавлена поддержка анимированных PNG-изображений
- Chrome 57 научился «душить» фоновые вкладки для снижения энергопотребления
Занимательное
- Новый алгоритм Google позволяет сжать JPEG-файлы на 35%
- GitLab объявил о покупке Gitter и планирует открыть его код
- Google выложил в открытый доступ код алгоритма, ужимающего изображения на 35%
- В Telegram началось тестирование зашифрованных голосовых звонков
- Microsoft запустила конкурента Slack для Office 365 в международном масштабе
- Конец еще одной эпохи: Windows Vista официально перестанут поддерживать с 11 апреля
- На каких принципах построен дизайн продуктов, которыми пользуется весь мир — примеры Airbnb, Facebook, Apple и других компаний
- В Google теперь можно искать фразы с символами ||, === и другими программистскими обозначениями
- Сооснователь Yahoo рассказал, что фиолетовый стал фирменным цветом компании по ошибке
- Если бы Стив Джобс воскрес или 7 смертных грехов Apple
- 7 навыков, которые необходимы IT-специалистам, чтобы получить работу в Apple, Google или Microsoft
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: Zfort Group