Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
•
Подкаст «Frontend Weekend» #26 — Владислав Козуля про идеальное собеседование и как избавиться от образа шутника в твиттере
•
Подкаст «devschacht»: Ночной фронтенд #9?—?Может быть не React?
•
Подкаст «Drinkcast», Выпуск #15 — «Юные Бобби»
•
Подкаст «Пятиминутка Angular» #5 — Angular 5, CLI 1.4, meetups (NYC, MIX, Moscow), Acronis on Angular
•
Подкаст «Фронтенд Юность (18+)» : Первый стрим
•
О девушках в программировании и честности. Frontend Юность в гостях у loftblog
•
Запись трансляции WSD, прошедшей в эту субботу в Киеве
•
«ALL YOUR HTML» #21: «SVG кривые и анимация лого css-live.ru на snap.svg»
•
Шоу «Totally Tooling Tips»: Тестирование доступности
•
Кроссбраузерная ве?рстка. Что такое кроссбраузерная вёрстка? Какие есть браузеры и нужен ли пиксель-пёрфект
•
Пробел в знаниях основ веб-разработки
•
Как рассказать о современной веб-разработке путешественнику во времени из 2007 года
• Новости Node.js: Выпуск серверной JavaScript-платформы Node.js 9.0, Node.js 8 переходит на долгосрочную поддержку, а ветка Node.js 9 становится текущей. Итого, Что же нового в Node.js 9?
•
Будущее производительности — бандлинг
•
Как прятать. Когда display: none, а когда visibility: hidden
• Понимание вьюпорта WebView в iOS 11
•
Крис Койер о преимуществе кастомных свойств CSS перед data-атрибутами в разметке
•
Flexbox и Grid, ваши лучшие лейаутные друзья
•
Подробно о создании отзывчивых доступных таблиц
•
CSS in JS: преимущества, недостатки и инструменты
•
Продвинутая стилизация форм средствами CSS
•
О трудностях преодоления проблем глобального CSS
•
Как Sass может сохранить вам кучу времени
•
Священная CSS война, или как выйти за рамки догмы
•
Как лучше струкрутировать CSS по компонентам
•
Как написать TODO приложение на HTML и CSS без использования JavaScript
• JS: Настройка окружения. Новый бесплатный курс на Hexlet
• Плавильный котел JavaScript.. Перевод статьи Дэна Абрамова «The melting pot of JavaScript»
•
Чем хорош (и чем плох) Typescript: опыт UI-разработчиков
•
JavaScript, Node, Puppeteer: автоматизация Chrome и веб-скрапинг
• 3+ года Ember, 6 месяцев React
•
Лямбда-исчисление с помощью JavaScript. Введение в корни функционального программирования
•
Как работает JavaScript: глубокое погружение в WebSockets и HTTP/2 с SSE + как выбрать правильный путь
•
В Firefox 58 появится защита от скрытой идентификации пользователей при помощи Canvas
•
Сотрудник Microsoft прямо посреди презентации возможностей Azure установил Chrome, поскольку Edge постоянно зависал
•
Google выпустила бета-версию браузера Chrome 63
•
Firefox получит инструмент анонимности из Tor Browser
•
Преставляем новые оптимизации JavaScript, WebAssembly, SharedArrayBuffer, и Atomics в EdgeHTML 16
•
Технические подробности Safari Technology Preview 43
• Статистика операционных систем и браузеров за октябрь 2017 года
• Комитет IETF одобрил код 103 ответа HTTP
• GitHub запустил форумы сообщества для объединения разработчиков
• Доступно о машинном обучении: распознавание речи
• Студентам MIT удалось обмануть ИИ Google, заставив думать, что черепаха – это винтовка
• Результаты поиска Google больше не зависят от домена верхнего уровня
• AliExpress наняла инженеров из «Яндекса» для обучения сервисов русскому языку
•
Полное руководство по SEO в 2018
?
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.

Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
•
Подкаст «Frontend Weekend» #26 — Владислав Козуля про идеальное собеседование и как избавиться от образа шутника в твиттере•
Подкаст «devschacht»: Ночной фронтенд #9?—?Может быть не React?•
Подкаст «Drinkcast», Выпуск #15 — «Юные Бобби»•
Подкаст «Пятиминутка Angular» #5 — Angular 5, CLI 1.4, meetups (NYC, MIX, Moscow), Acronis on Angular •
Подкаст «Фронтенд Юность (18+)» : Первый стрим•
О девушках в программировании и честности. Frontend Юность в гостях у loftblog •
Запись трансляции WSD, прошедшей в эту субботу в Киеве •
«ALL YOUR HTML» #21: «SVG кривые и анимация лого css-live.ru на snap.svg» •
Шоу «Totally Tooling Tips»: Тестирование доступности
Веб-разработка
•
Кроссбраузерная ве?рстка. Что такое кроссбраузерная вёрстка? Какие есть браузеры и нужен ли пиксель-пёрфект•
Пробел в знаниях основ веб-разработки•
Как рассказать о современной веб-разработке путешественнику во времени из 2007 года• Новости Node.js: Выпуск серверной JavaScript-платформы Node.js 9.0, Node.js 8 переходит на долгосрочную поддержку, а ветка Node.js 9 становится текущей. Итого, Что же нового в Node.js 9?
•
Будущее производительности — бандлинг- AMP/PWA:
•
service workers в Safari и другие хорошие новости для PWA
•
Дерзкие планы Microsoft по поводу PWA в Windows 10
•
Новый Angular Service Worker? — автоматическое создание ?PWA: Часть 1: теория, Часть 2: практика. Полное практическое руководство по Angular Service Worker: caching, push, updates
•
Shadow DOMs: Инкапсуляция в PWA
•
The meaning of AMP. Критическая статья Jeremy Keith о предназначении AMP
- Инструменты:
•
Список лучших инструментов для web-анимации
• Chrome Headless. Запускаем на удаленном сервере с режимом отладки
•
Состоялся релиз SVGO 1.0.0, одного из лучших оптимизаторов SVG
•
Как дебажить фронтенд: Console
•
Новый уровень Webpack Dashboard
•
Дорожная карта разработки VS Code в 2018
•
icongram — сервис для использования популярных иконок на лету
•
Bootstrap 4 Buffet — интерактивный визуальный выбор компонентов Bootstrap 4 для быстрого использования
•
gifski — конвертер видео в высококачественные GIF, базирующийся на pngquant
- Анимация:
• Еженедельная подборка красивых эффектов на CSS/SVG/JS #60
• Создание анимации на базе JavaScript с помощью библиотеки Anime.js. Часть 2
•
Анимация обрезанных фигур
•
3D Movie Booking App UI на CSS/HTML
•
Эмуляция плавной CSS анимации средствами JavaScript
•
Прелоадер страницы на CSS в виде Kylo Ren
CSS
•
Как прятать. Когда display: none, а когда visibility: hidden• Понимание вьюпорта WebView в iOS 11
•
Крис Койер о преимуществе кастомных свойств CSS перед data-атрибутами в разметке•
Flexbox и Grid, ваши лучшие лейаутные друзья•
Подробно о создании отзывчивых доступных таблиц•
CSS in JS: преимущества, недостатки и инструменты•
Продвинутая стилизация форм средствами CSS•
О трудностях преодоления проблем глобального CSS•
Как Sass может сохранить вам кучу времени•
Священная CSS война, или как выйти за рамки догмы•
Как лучше струкрутировать CSS по компонентам•
Как написать TODO приложение на HTML и CSS без использования JavaScript- Типографика:
•
Типографика и современный CSS
• MyFonts представила мобильное приложение для распознавания шрифтов
•
CSS font-display: будущее рендера шрифтов в вебе
•
Управление загрузкой шрифтов больше не является проблемой. Zach Leatherman о postcss-foft-classes
•
Веб-типографика: создаем таблицы для того, чтобы их читать, а не рассматривать
•
Тесты размеров вариативных шрифтов
JavaScript
• JS: Настройка окружения. Новый бесплатный курс на Hexlet
• Плавильный котел JavaScript.. Перевод статьи Дэна Абрамова «The melting pot of JavaScript»
•
Чем хорош (и чем плох) Typescript: опыт UI-разработчиков•
JavaScript, Node, Puppeteer: автоматизация Chrome и веб-скрапинг• 3+ года Ember, 6 месяцев React
•
Лямбда-исчисление с помощью JavaScript. Введение в корни функционального программирования•
Как работает JavaScript: глубокое погружение в WebSockets и HTTP/2 с SSE + как выбрать правильный путь- ES2015+:
•
Введение в часто используемые особенности ES6. Часть 2
•
Рефакторинг старой и сломанной библиотеки с использованием async/await c TDD
Angular:
• Выпущено обновление JS-фреймворка Angular 5.0.0
•
Angular v5 вышел, ознакомьтесь с новыми функциями, изменениями и улучшениями
•
18 советов от keycdn по улучшению производительности Angular
•
Эти 5 статей помогут вам стать экспертом Angular Change Detection
VueJS:
•
Демистификация методов жизненного цикла Vue
•
VueJs: введение в Vuex
•
Интеграция React и Vue компонентов в одном приложении
•
Создание Vue приложения с Nuxt.js и Server-Side рендерингом
•
Создание игры 2048 на Vue.js
React:
• Правила жизни с Редаксом
•
История React: как покупка Инстаграмма Фейсбуком привела к опенсорсингу React.js
•
Netflix ускорился в два раза, отказавшись от client-side React
•
Шаблоны компонентов React
•
svgr — трансформация SVG в компоненты React
- Libs & Plugins:
•
Frappe Charts — простые и современные графики, вдохновленные GitHub, без зависимостей
•
Введение в тепловые карты на Mapbox GL JS
•
handorgel — доступный аккордеон, соответствующий стандартам W3C и написанный на ES6
•
Focusingly — JavaScript библиотека для улучшения стилизации фокуса на элементах
Браузеры
•
В Firefox 58 появится защита от скрытой идентификации пользователей при помощи Canvas•
Сотрудник Microsoft прямо посреди презентации возможностей Azure установил Chrome, поскольку Edge постоянно зависал•
Google выпустила бета-версию браузера Chrome 63•
Firefox получит инструмент анонимности из Tor Browser•
Преставляем новые оптимизации JavaScript, WebAssembly, SharedArrayBuffer, и Atomics в EdgeHTML 16•
Технические подробности Safari Technology Preview 43• Статистика операционных систем и браузеров за октябрь 2017 года
Занимательное
• Комитет IETF одобрил код 103 ответа HTTP
• GitHub запустил форумы сообщества для объединения разработчиков
• Доступно о машинном обучении: распознавание речи
• Студентам MIT удалось обмануть ИИ Google, заставив думать, что черепаха – это винтовка
• Результаты поиска Google больше не зависят от домена верхнего уровня
• AliExpress наняла инженеров из «Яндекса» для обучения сервисов русскому языку
•
Полное руководство по SEO в 2018?
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Valery4
«18 советов от keycdn по улучшению производительности Angular» на самом деле про AngularJS и на мой взгляд не очень актуальна на сегодняшний день. Разве что, кто-то всерьёз решил остаться на AngularJS и улучшать его производительность, вместо того, чтобы перейти на что-то по-современнее.
Archusha
На удивление очень много компаний используют «полторашку» и не собираются пока переходить.
belkamax05
Лично мне нравился 1.5, хоть он и был перенасыщен. С новыми версиями как-то подружиться не получилось, спрыгнул в сторону реакта. Но по прежнему часто замечаю требования именно полуторной версии ангулара в вакансиях, да и на собеседованиях интересуются.
akass
Те задачи, которые он решал он так и решает. До сих пор вижу как его берут на новые проекты.