Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
•
Подкаст «Веб-стандарты», Выпуск №134: Невидимый DOM и файлы, новые атрибуты для картинок, веб-компоненты в Firefox, новости из леса, хорошая конференция.
•
Подкаст «Пятиминутка Angular» #11 — WSD, Community, ngrx-data, websocket, Angular 7.0, CLI 6.2 beta
•
Подкаст «Frontend Weekend» #66 — Жанна Круглова о судьбе разработчиц в декрете и истории Больших Интервью
•
«Девшахта-подкаст»: #46 — Путь джуна — как за год полностью сменить профессию
•
Подкаст «Фронтенд Юность (18+)» #61 О, Лисп-машина
•
Интервью с преподавателем ШРИ Дмитрием Андрияновым
•
Web Standards Days, запись конференции, прошедшей 18 августа в Санкт-Петербурге
•
JSCamp Barcelona 2018, 13 videos
•
WebAssembly: как и почему
•
Изучение веб-разработки в 2018
•
Полная анатомия редактора Gutenberg WordPress
•
Создание сайтов для Safari Reader Mode и других приложений для чтения
•
API датчиков для веб
•
Семь лучших онлайн-песочниц для написания кода
•
Accessibility: ваши ссылки пропуска контента сломаны
•
Максимальная адаптивность с минимальным количеством медиа запросов, или метод обратной адаптивности
•
5 приемов работы с CSS, о которых вам следует знать
• Стандарт для нестандартного
• Первый публичный черновик модуля величин и единиц CSS 4 уровня
•
Вариативные шрифты: что они такое и как их использовать
•
Все возможности свойства color-adjust
•
Функции 3D трансформации в CSS
•
О переключении с HEX & RGB на HSL
•
Техники экономии времени при работе с отзывчивыми изображениями в CSS
•
Синхронизация между табами с помощью Web Locks API
•
Встроенные функции в V8 (builtins)
•
Как создать простой компонент для работы с камерой
•
Какие видеокодеки (не) используют браузеры для видеозвонков
• Инженеры Mozilla удалили 23 аддона для Firefox, собиравших информацию о пользователях
• Вышла Opera 55: новый интерфейс настроек и упрощенная установка расширений Chrome
•
Создание расширения Chrome в 2018-м: хороший, плохой и злой
• Новая система ИИ DeepMind способна диагностировать и назначить лечение по более чем 50 заболеваниям глаз
• «Мы здесь власть». Как «Двач» спасает и калечит чужие жизни
• Как Amazon создает из Twitch конкурента YouTube
• Три десятилетия «Меча и Магии»: разбираемся в истории легендарной франшизы
• Искусственный интеллект в действии
• Реально ли создать супер-язык программирования — отвечают эксперты
• «Не понравится — выращу новую руку»: дизайнер протезов о выращивании конечностей и киберпанке в России
• В процессорах Intel обнаружен новый набор уязвимостей класса Spectre: Foreshadow или L1TF
← Дайджест за прошлую неделю
Материал подготовили dersmoll и alekskorovin
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
•
![podcast](https://habrastorage.org/web/259/2f4/069/2592f40697cc49dc939e9fc3983fc737.png)
•
![podcast](https://habrastorage.org/web/259/2f4/069/2592f40697cc49dc939e9fc3983fc737.png)
•
![podcast](https://habrastorage.org/web/259/2f4/069/2592f40697cc49dc939e9fc3983fc737.png)
•
![podcast](https://habrastorage.org/web/259/2f4/069/2592f40697cc49dc939e9fc3983fc737.png)
•
![podcast](https://habrastorage.org/web/259/2f4/069/2592f40697cc49dc939e9fc3983fc737.png)
•
![video](https://habrastorage.org/storage3/976/d3e/38a/976d3e38a34b003f86f91795524af9f8.gif)
•
![video](https://habrastorage.org/storage3/976/d3e/38a/976d3e38a34b003f86f91795524af9f8.gif)
•
![video](https://habrastorage.org/storage3/976/d3e/38a/976d3e38a34b003f86f91795524af9f8.gif)
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
Веб-разработка
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
- Производительность:
•18 советов о том, как ускорить WordPress
•Friday Frontend: Client Side Performance Edition
- Анимация:
•Foot tap loader | SVG + GreenSock
•Chromatic aberration effect
•Прокрутка сайта эффектом отскока
CSS
•
![habr](https://habrastorage.org/storage2/c57/b92/af4/c57b92af4ee0d37f787c211a068b1b95.png)
•
![habr](https://habrastorage.org/storage2/c57/b92/af4/c57b92af4ee0d37f787c211a068b1b95.png)
• Стандарт для нестандартного
• Первый публичный черновик модуля величин и единиц CSS 4 уровня
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
- Практика:
•Простой интерактивный круговой график с помощью CSS Variables и магии Гудини
•CSS Scroll Snapping на практике
•Создание морского боя на CSS
- Лейауты:
•Простой и отзывчивый современный шаблон на CSS Grid Layout
•Экспериментальные раскладки с помощью CSS Shapes и clip-path
•Редизайн сайта с использованием CSS Grid раскладки
•Все что вам нужно знать о выравнивании в Flexbox
JavaScript
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
- Подкасты:
•JSJ 326: Разговор с создателем Ember Томом Дейлом об Ember 3.0 и будущем Ember
•«JavaScript & SEO», подкаст The Web Platform, выпуск #168
•«REST easy, GraphQL is here», подкаст JS Party – Episode #38. Ведущие разговаривают с John Resig (создателем jQuery) о том, как он использует GraphQL в Khan Academy, а также о мыслях Джона о настоящем и будущем jQuery
- Теория:
• Задачки с собеседований. Сборник решений — Fun ES #5: для нердов, Fun ES #6: перевернуть число
•Разбор паттерна «Модуль» в JavaScript
•Иван Тулуп: асинхронщина в JS под капотом
•Основы движка JavaScript: оптимизация прототипов
Angular:
•Исследование Ivy — нового компилятора Angular
• Начните работу с Angular Grid за 5 минут
• Команда Angular выпустила инструменты, упрощающие переход с AngularJS на Angular
•Angular 7 грядёт
•Отладка приложений Angular CLI в Visual Studio Code
•10 наиболее полезных свойств Angular, о которых вы, возможно, не слышали
•Как Angular CLI Budgets спасли мой день, и как он может спасти ваш
VueJS:
•Vuex: структурирование больших проектов и работа с модулями
• Паттерны Vue. Полезные паттерны, методы, советы и рекомендации, а также тщательно подобранный список ссылок по Vue. Если вам нравится перевод, то поставьте лайк-звездочку репозиторию перевода
•Три причины использовать Vue.js в вашем следующем проекте
•Как я создал расширение для браузера на Vue: Часть 1, Часть 2
React:
• Практический React: управляем рендерингом — производительность
•Работа с refs в React
•Как вы можете распланировать три дня наперед с помощью React
•Простая интернационализация приложений на React
- Libs & Plugins:
•Tone.js — фреймворк для создания интерактивной музыки в браузере с помощью Web Audio API
•from-html — получи ссылку на элемент прямо из строки HTML
•TheoremJS — математическая библиотека для вычислений в JavaScript
Браузеры
•
![habr](https://habrastorage.org/storage2/c57/b92/af4/c57b92af4ee0d37f787c211a068b1b95.png)
• Инженеры Mozilla удалили 23 аддона для Firefox, собиравших информацию о пользователях
• Вышла Opera 55: новый интерфейс настроек и упрощенная установка расширений Chrome
•
![en](https://habrastorage.org/storage3/2e2/522/737/2e2522737ec404a9f76047e108dfaea0.gif)
Занимательное
• Новая система ИИ DeepMind способна диагностировать и назначить лечение по более чем 50 заболеваниям глаз
• «Мы здесь власть». Как «Двач» спасает и калечит чужие жизни
• Как Amazon создает из Twitch конкурента YouTube
• Три десятилетия «Меча и Магии»: разбираемся в истории легендарной франшизы
• Искусственный интеллект в действии
• Реально ли создать супер-язык программирования — отвечают эксперты
• «Не понравится — выращу новую руку»: дизайнер протезов о выращивании конечностей и киберпанке в России
• В процессорах Intel обнаружен новый набор уязвимостей класса Spectre: Foreshadow или L1TF
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
← Дайджест за прошлую неделю
Материал подготовили dersmoll и alekskorovin