Поздравляем с серединой июня! На этой неделе у нас было несколько отличных статей, посвященных доступности — как на философском уровне, так и с конкретными тактиками, которые следует использовать или избегать. Мне особенно понравилась статья о веб-доступности в контексте.
Есть также куча других замечательных вещей… пост о мышлении CSS хорош, особенно для разработчиков, которые не знакомы с CSS, статья о преобразователях JavaScript полностью поразила меня, а Vue RFC для API, вдохновленного хуками, заставил меня больше волноваться. будущее веб-разработки, чем я был в то время. Наслаждаться!
Лучший,
KBall от ZenDev
P.S. На следующей неделе я буду вести панель на NodeConf Columbia — если вы окажетесь на конференции, напишите мне, и давайте встретимся за чашечкой кофе!
CSS и SCSS
Одна из самых больших проблем, с которой сталкиваются многие новые разработчики при работе с CSS, заключается в том, что он использует совершенно другую ментальную модель, чем более «традиционные» языки программирования. CSS является декларативным, отказоустойчивым и предназначен для среды со многими неизвестными переменными (длина/размер/формат контента и т. д.). Поэтому лежащие в его основе идеи и лучшие практики сильно отличаются от того, что стоит за чем-то вроде JavaScript. Тем не менее, определенно существует набор концепций более широкой картины, которые можно понять, и в этой статье хорошо перечислены некоторые из них.
Сетка, изменение порядка контента и доступность
Поскольку с CSS Grid и Flexbox стало проще упорядочивать и перемещать элементы на странице, инструменты для того, как эти элементы считываются вспомогательными технологиями, не поспевают за ними. Теперь очень легко создать красивый макет, полностью несвязный и пригодный для использования в программе чтения с экрана. Это очень важное чтение, содержащее как предупреждение о том, на что следует обратить внимание, так и призыв к улучшениям на уровне инструментов.
Создание статического портфолио с расширенной линейчатой диаграммой CSS
Отличный пошаговый учебник по созданию гистограммы с помощью CSS. Охватывает множество тем — flexbox, пользовательские свойства, преобразования, переходы и многое другое. Если вы предпочитаете обучать с помощью учебных пособий, в этом есть что вам понравиться.
20 лучших кнопок CSS (+ анимация)
С другой стороны, если вам нравится учиться на примере (после примера за примером), то это может быть больше для вас. Массивные 20 различных примеров кнопок CSS с очень классной анимацией, все в собственном коде, так что вы можете играть и возиться (или просто смахивать вверх) сколько угодно.
JavaScript
Волшебные, мистические преобразователи JavaScript
Увлекательное чтение о том, как работают преобразователи, о создании их с нуля из преобразователей с использованием JavaScript, а затем о том, как использовать встроенные преобразователи от Ramda. И если все это звучит как тарабарщина, вы не одиноки — но прочитайте эту статью, и она начнет обретать смысл. :) Это очень мощный подход, который позволяет вам комбинировать простые функции для создания мощного и эффективного конвейера обработки данных.
Повысьте уровень своей игры .sort
Пошаговое руководство по использованию встроенного метода Array.sort для ряда различных сценариев, которые постепенно усложняются. Хорошее дополнение к вашему репертуару основ JavaScript.
Все, что вам нужно знать о датах в JavaScript
Даты OMG в JavaScript — такая головная боль. Я много раз использовал moment.js, чтобы сделать его проще, но moment — удивительно тяжелая библиотека (минимизировано 52 КБ даже без локалей). Если вам не нужен такой вес, возможно, стоит освоить работу с нативными датами, и если вы хотите это сделать… эта статья — самая подробная, которую я когда-либо видел.
Довольно крутой список трюков! Мне особенно нравятся некоторые трюки с распространением и деструктурированием. Пример использования деструктуризации для разделения объекта на два объекта очень аккуратный.
Это увлекательное чтение. Это RFC для нового набора API-интерфейсов для Vue, вдохновленных хуками React, но использующих преимущества модели реактивности Vue для создания чего-то, что нам гораздо больше «похоже на Vue». Перекрестное опыление идей и улучшений в основных JavaScript-фреймворках здесь действительно удивительно наблюдать, и чтение этого очень вдохновило меня на будущее фронтенд-разработки.
Другое
Поговорим о тестировании: 4 коротких урока по философии тестирования
(Предупреждение о предвзятости: я написал это) Такие инструменты, как Mocha, Jasmine и Jest, значительно упростили письменные тесты… Но пробел все еще есть. Чрезвычайно сложно найти информацию о философии тестирования. Что тестировать и зачем. Сколько достаточно? Какие типы тестов я должен писать, и когда это вписывается в мой процесс? В этой статье извлекаются некоторые ключевые уроки философии тестирования из разговора о недавнем эпизоде JSParty.
Каков интерфейсный эквивалент микросервисной архитектуры? Архитектура микрофронтендов, конечно. Такой подход имеет массу смысла, хотя, на мой взгляд, вам обязательно понадобится внутренняя библиотека компонентов и некоторая координация между интерфейсами, чтобы ваш пользовательский интерфейс не превратился в серию разрозненных, разрозненных событий.
Увлекательное чтиво, освещающее исторический контекст специальных возможностей и вспомогательных технологий, а также погружающееся в то, как мы делаем доступность в Интернете сегодня. Я настоятельно рекомендую прочитать это.
Указание фокуса на улучшение доступности
Взгляд на важность стилей фокусировки, обсуждение способов стилизации фокусировки (ради бога, не удаляйте их полностью, но вы не единственный, кто считает стандартные кольца фокусировки уродливыми) и некоторое обсуждение будущего. улучшения в управлении стилями фокуса.
Анатомия доступных форм: проблема с заполнителями
Обзор некоторых проблем доступности (и общего удобства использования) с заполнителями. Я думаю, что это отличный пример того, как хорошие методы доступности часто на самом деле являются хорошими практиками юзабилити для всех. Хотя выделенные проблемы больше всего влияют на тех, у кого есть проблемы, я обнаружил, что каждая альтернатива также предлагает улучшенное удобство использования для меня.
Как избежать выгорания в качестве веб-разработчика
Перегруженность — одна из самых распространенных проблем в веб-разработке, о которых я слышал от вас сегодня, и перегруженность часто может привести к выгоранию. Но есть и другие факторы, и многие из них способствуют высокому уровню эмоционального выгорания среди веб-разработчиков. В этой статье рассказывается о некоторых из этих факторов, о том, как их увидеть, и о некоторых тактиках, позволяющих избежать эмоционального выгорания.
Счастливой пятницы!
Хотите получать это как информационный бюллетень прямо на ваш почтовый ящик? Каждую пятницу я рассылаю 15 ссылок на лучшие статьи, уроки и анонсы по CSS/SCSS, JavaScript, а также множество других замечательных Front-end новостей — подпишитесь здесь: https://zendev.com/friday-frontend.html
Первоначально опубликовано на https://zendev.com 14 июня 2019 г.
