Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
• Подкаст «devschacht»: Ночной фронтенд #14 — HolyJS. День 1
• Подкаст «Пятиминутка Angular» #7 — HolyJS, Articles, Angular-RU/Universal/OfflineMoscow, NewHR
• Подкаст «Drinkcast», #20 — «Поймать опенсорсера»
• «ALL YOUR HTML» #26: «SVG и WebGL маски»
• 31 видео с KharkivJS #8 2017
• 3 видео с MinskCSS Meetup #3
•
16 видео с Fronteers Conference 2017
Веб-разработка
• Google анонсировал изменения в сканировании AJAX
• Краткие итоги фронтенд-разработки в 2017
• Делаяем оффлайн поддержку для вашего веб-приложения: часть 1 — настройка, часть 2: реализация
• Руководство по подготовке к собеседованию на позицию фронтендера
• Узнайте большое о предупреждениях об уязвимостях
• “Что не так с современным фронтендом”, — доклад Максима Корабельского на ThinkPHP
- Производительность:
•Эволюция «img»: Gif без формата GIF
•Производительность как восприятие: управление восприятием
•Средняя скорость загрузки страницы в 2018 – как, что и зачем измерять.
•Производительность — это преимущество
- Инструменты:
•Встречайте Turbo: пакетный менеджер, который в 5 раз быстрее Yarn и NPM и работает в браузере
•wordpressify — система сборки, созданная для автоматизации процесса разработки на WordPress
•parceljs — новый быстрый бандлер веб-приложений
•Webpack: мягкое введение в модульный бандлер
•Настраиваем webpack для любого проекта
•Visual Studio Code добавил интеграцию с Avocode для работы с дизайном прямо в редакторе
- Accessibility:
•Пересмотр подхода к созданию доступных ссылок
•5 основных заблуждений на тему веб-доступности
•Предоставляем альтернативный контент для пользователей скринридеров
•Руководства по веб-доступности контента для людей, которые их не читали
•Автоматизация тестов доступности
•Создание инклюзивного веба: почему доступность имеет значение
•HTML5 Accessibility. Ресурс, где можно узнать об актуальном статусе поддержки свойств HTML5 в основных браузерах
- Анимация:
• Еженедельная подборка красивых эффектов на CSS/SVG/JS #65
•Создание анимации на SVG с помощью линий на примере велосипеда с помощью GSAP
•Mountains Adventure — SVG filters, clip-path & morphing
•Анимация заполнения страницы в виде пиксельной волны
CSS
• <i is=«морж»>
• iota — отзывчивый микро-фреймворк для гридов, использующй кастомные свойства CSS
• Несколько идей для чего можно использовать Grid Layout
• Анимация бордеров
• Как сделать ваш HTML отзывчивым с помощью добавления одной строки кода CSS
• Почему CSS Grid лучше, чем Bootstrap для создания лейаутов
• Понимание CSS переменных
• Календарь на CSS Grid
• Пересмотр вариантов реализации вертикального текста с помощью writing-mode
• Отладка CSS Grid Layouts с помощью Firefox Grid Inspector
• normalize.email.css — CSS reset для шаблонов HTML писем
JavaScript
• Анализ шести веб-фреймворков: плюсы, минусы и особенности выбора
•
Как написать безопасное приложение для JavaScript
• Вот что говорили технические люди о дебюте JavaScript в 1995-м
• Итак, вы изучили JavaScript – что теперь?
• Нейронные сети на JavaScript с помощью deeplearn.js
• В будущем JavaScript будет меньше JavaScript
• Как я создал тепловую карту истории моих посещений с JavaScript и Google Maps
• Поиск неуникального элемента в Javascript
- ES2015+:
• Промисы на примерах из жизни
•await vs return vs return await
•Как отменить свои промисы
- Теория и руководства:
•JavaScript. Ядро: 2-ое издание
•Разные способы понимания this в JavaScript
•Руководство фронденд-разработчиков по GraphQL
•Узнайте об Internationalization API в JavaScript
•Ответы на каверзные вопросы на собеседованиях по JS
React:
•Анализ производительности React 16 приложений с помощью инструментов разработчика Chrome
•Как Фейсбук приобрел Инстаграм и почему это привело к открытию исходного кода React.js
• Redux: шаг за шагом
•Быстрое введение в React для разработчиков Angular 2/4+
•Два новых (бесплатных) React курса на 2.5 часов. 1 — Руководство для новичков по ReactJS, 2 — продвинутые компоненты шаблонов React
•Демистификация подходов к стилизации React
•Как создать простой блог с помощью React и GraphQL
•Испраление производительности React на листинг страницах Airbnb
•mdbootstrap — React Bootstrap с Material
•jQuery лучше, чем React :)
VueJS:
•Безжаргонное введение в Webpack для пользователей VueJS
•Что за виртаульный DOM во Vue?
•Анимация VueJS
Angular:
•11 библиотек компонентов Angular, которые вы должны знать в 2018
•Angular 5.1 & и другие новинки уже доступны
•Почему мы выбрали Angular 2, а не React для нашей работы над энтерпрайзом
- Libs & Plugins:
•Визуализация динамических волновых графиков с помощью wavesurfer.js
•npmgraph — инструмент для визуального изучения NPM модулей и зависимостей
•Animate Plus — библиотека для анимации, сфокусированная на производительности и гибкости разработки
•Muuri — адаптивная, фильтруемая, сортируемая сетка с поддержкой перетаскивания элементов в стиле masonry
•country-iso — возвращает код страны по географическим координатам
•Reshader — настраиваемая микро-библиотека для получения оттенков цветов
Браузеры
• Выпуск web-браузера Chrome 63
• Google начала «убивать» приложения Chrome и отключила соответствующий раздел магазина Chrome Web Store на Windows, Mac и Linux
• Что нового в Facebook: все изменения ленты новостей за 2017 год
• Chrome для Windows будет блокировать внедрение кода сторонними приложениями, которое часто приводит к сбоям
• Петиция о скорейшей эвантазии Internet Explorer-а раз и навсегда
• Детали релиза Safari Technology Preview 45
Занимательное
• Мастер-класс «Почему Стив Джобс любил шрифты» (Алексей Каптерев)
• Mozilla и Yahoo обменялись судебными исками
• Что влияло на выдачу поисковиков в 2017 году
• Что не так с криптокотиками и чем это кончится
• В NVIDIA создали нейросеть, реалистично подделывающую видео
• Дизайнер изобразила главные мировые события 2017 года на одной картинке
• Что случилось с парнем, который купил пиццу за биткоины
• Лучшие книги о программировании, отобранные по многочисленным комментариям в reddit
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: alexzfort