Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
UPD: На следующей неделе дайджеста не будет, отпуск, все дела.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
| Веб-разработка |
| CSS |
| Javascript |
| Браузеры |
| Новости |
Веб-разработка
Важные аспекты работы браузера для разработчиков. Часть 2- Подкаст Веб-стандарты, Выпуск №23: HTML 5.1, Dreamweaver, Гудини, ссылки, безопасность и наставничество.
- Как эмодзи могут улучшить ваш код — серьёзно
- Улучшение путей взаимодействия пользователя (user flow) через переходы по странице
Запись трансляции Летнего Я.Субботника, секция Фронтенд
Фронтенд разработка в мире интернета вещей (Front-End Development in an Internet of Things World)- Планируемый requestAnimationFrame для ботанов (requestAnimationFrame Scheduling For Nerds)
- Что такое прогрессивное веб-приложение, и должен ли я его создавать (What’s a Progressive Web App, and Should I Build One?)
- Осведомленность фронтенд разработчика (A Front End Developer is Aware)
- Сложности бесконечного скроллера (Complexities of an infinite scroller)
- Жизненный цикл Service Worker, один из уроков бесплатного курса Offline Web Applications на udacity
- Десять требований по созданию каруселей на главной странице (Ten Requirements For Making Home Page Carousels Work For End Users (If Needed))
- Мысли о HTML5 (Thoughts on HTML5)
- Отзывчивые изображения: меньший вес страницы с элементом picture и WebP (Responsive images: Smaller page sizes with the picture element and WebP)
- Кросс-браузерность: Делайте веб работающим для всех (Make the Web Work For Everyone)
- Доступность:
- Как правильно использовать альтернативный текст (Writing for all people: how to use alternative text well)
- Всегда используйте label (Always use a label)
- Поля для поиска без label (Unlabelled search fields)
- Подробно о доступности SVG (Accessible SVGs)
- Инструменты:
- 10 вещей, которых вы не знали о WebPageTest.org
- Webpack: представление команды и призыв к поддержке проекта (webpack: It’s getting real)
- Эффектный веб:
- Техники манипулирования изображениями в Canvas (Canvas image manipulation techniques)
- Простая анимация статики в Canvas (Animating Static in HTML5 Canvas)
- Визуализация отрисовки элементов на WebGL в замедленном режиме
- Еженедельная подборка красивых эффектов на CSS/SVG/JS #45
CSS
- Относитесь к сеткам (на флексбоксах) проще. Перевод статьи Don’t Overthink It (Flexbox) Grids
- Битва архитектур. Перевод статьи Battle of the architectures
- Современный CSS мощнее, чем вам кажется: N примеров, в которых вам не нужен JavaScript
- Компоненты интерфейса, созданные без JS (You Don't Need JavaScript)
- Довольны ли вы своими CSS файлами в ваших больших приложениях? Атака на CSS методологии (Happy with your CSS files in your big app? OOCSS, BEM, SMACSS, ITCSS, ACSS, ITCSS under attack.)
- Структурирование CSS для больших проектов (Structuring CSS in large projects)
- Создаем пользовательский курсор ввода (Creating a custom input cursor/caret)
- Front-End вызов принят: CSS 3D Куб (Front-End Challenge Accepted: CSS 3D Cube)
- Трюки с :target (The :target Trick)
- CSS: идеальные стили для печати (CSS: The Perfect Print Stylesheet)
- Создаем динамические темизирующиеся сайты с помощью currentcolor (Creating dynamically theme-able websites using CSS currentColor)
- Являются ли проценты viewport доступными единицами? (Accessibility of viewport percentage units)
- Воссоздание анимационного эффекта Twitter Heart (с помощью одного HTML-элемента, без изображений и JavaScript) (Recreating the Twitter Heart Animation (with One Element, No Images, and No JavaScript))
- CssToReact — простой маленький инструмент, позволяющий транслировать CSS в специфический инлайновый JSON для React
- ress — современный сброс стилей (ress — a modern CSS reset)
- < LINK > Видео доклада Yoav Weiss c HTML Special, CSS Day
JavaScript
- Бесплатные игровые движки на HTML5 и JavaScript
- Да. JavaScript восходит (Yes. JavaScript rises)
- Релиз jQuery 3.1.0 – больше никаких тихих ошибок
- Релиз ESLint v3.0.0 (ESLint v3.0.0 released)
- Предупреждение по поводу jQuery 3 (A Warning About jQuery 3)
- Трюки консольной отладки (Beyond Console Debugging Tricks)
- Введение в функциональное программирование на JavaScript, ч.1 (Introduction to Functional Programming in JavaScript (Part 1))
- You-Dont-Need-Lodash-Underscore — список JS методов, которые можно использовать нативно (без Lodash или Underscore) (You-Dont-Need-Lodash-Underscore — lists of Javascript methods which you can use natively)
- Как создать нейрон: исследование ИИ в JavaScript, часть 2 (How to Build a Neuron: Exploring AI in JavaScript Pt 2)
- Три трюка для лучшей работы с npm модулями (3 tricks to better handle npm modules)
- Заимствование методов в JavaScript (Borrowing Methods in JavaScript)
- Отслеживание GPS информации с Tessel 2 (Tracking GPS data with the Tessel 2)
- Три отличных совета по отладке JavaScript в DevTools (3 Splendid JavaScript Debugging Tips)
- ES6:
- Понимание ES6 модулей через их историю (Understanding ES6 Modules via Their History)
- ES6 для людей (ES6 for Humans)
- Выживание в ECMAScript 6 (Surviving ECMAScript 6)
- Фреймворки:
- Вы можете не захотеть использовать [хипстерский_js_фреймворк] (You may not want to use [hip_js_framework])
- Написание JavaScript фреймворка — структура проекта (Writing a JavaScript Framework — Project Structuring)
- 6 уроков, которые я получил, перейдя на продакшен с React-Redux (6 lessons learned from going to production with React-Redux)
- Лучшие практики для React и Flux на продакшене (React and Flux in Production Best Practices)
- racket — стартовый пакет с React/Redux веб приложениями и генераторами
- Функциональные компоненты с React stateless функциями и Ramda (Functional Components with React stateless functions and Ramda)
- Особенности React (React Gotchas)
- Начало работы с React, GraphQL и Relay (часть 1 из 2) (Getting Started with React, GraphQL and Relay (Part 1 of 2))
- Создание мобильного приложения с Angular 2 и Ionic 2 (Build a Mobile App with Angular 2 and Ionic 2)
- Плагины:
- zingtouch — библиотека для определения жестов (zingtouch — a JavaScript gesture detection library for the modern web)
- Segment — небольшой JS класс для рисования и анимации SVG кривых (Segment — a little JavaScript class (without dependencies) to draw and animate SVG path strokes)
- ejs — эксперимент с window.onerror, упрощающий отладку JavaScript
- Fela — библиотека для работы с динамическими стилями в JavaScript (Fela — Fast & Dynamic Styling in JavaScript)
- 10 jQuery плагинов для загрузки файлов (10 jQuery File Upload Plugins)
Браузеры
- Context Graph в Firefox будет подсказывать пользователям на какой сайт пойти дальше
- В браузере Chrome появилась поддержка потоковой трансляции изображения на телевизоры
- В Chrome добавлены средства шифрования, стойкие к подбору на квантовом компьютере
- Как в Chrome избавиться от прыжков страницы во время загрузки изображений
- Покупателю Yahoo придётся выплатить Mozilla $1 млрд за использование поисковика в Firefox
- Новости браузера UC
- Будущее «Истории» в браузерах (The Future of Browser History)
Новости и занимательное
- eBay анонсировал, что теперь они обсуживают более 8 млн. страниц, используя AMP
- Google работает над доступностью любого сайта в VR (Google is working to make every website viewable in VR)
- Facebook блокирует крупные страницы за ссылки на сайты с социальным замком
- Google купил платформу дистрибуции видео Anvato, пользователи ожидают ее интеграции с YouTube
- 32 бита всё
- Почему если все уйдут в IT, станет только хуже
- Исходный код Apollo 11 полностью опубликовали на GitHub, программисты обсуждают баги
- Несмотря на более низкие скидки в этом году, распродажа в Steam прошла более успешно
- Путин подписал закон Яровой о хранении и расшифровке данных пользователей
- Хронология продажи LinkedIn: Предложения от Google, Facebook, Microsoft и других
- Ученые записали в ДНК рекордные 200 мегабайт данных
- Рутина, стресс, недостаток сна и депрессия Сотрудники компаний Кремниевой долины поделились в комментариях на Quora обратной стороной своей работы: бесконечная рутина, недостаток сна, стресс и прочее.
- Улучшаем дизайн форм. Как исправить распространенные ошибки дизайнеров
- Игра, где требуется найти цвет по названию (Find the colour)
- The History of the URL: Domain, Protocol, and Port
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
UPD: На следующей неделе дайджеста не будет, отпуск, все дела.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
