На этой неделе я был на VueConf.US в Новом Орлеане и прекрасно провел время. Это была первая конференция Vue в США, и организаторы проделали замечательную работу с гостеприимной атмосферой, прекрасными докладами и уникальным вкусом Нового Орлеана. Впервые я маршировал по улице с марширующим оркестром и полицейским эскортом на технологической конференции. :)
В честь VueConf, ссылки на JavaScript на этой неделе в основном ориентированы на Vue, но, конечно же, у нас также есть ряд других отличных статей, включая супер классную технику работы с пробелами в тексте, глубокое погружение в адаптивные изображения и многое другое. более.
Счастливой пятницы!
KBall от ZenDev
P.S. Если вы пропустили VueConf и хотите узнать больше о том, что произошло, проверьте #vueconfus в Твиттере или посмотрите мой профиль InfoQ, где я буду публиковать резюме и интервью с конференции в течение следующих нескольких недель.
CSS и SCSS
«Как отображать: содержимое; Работает"
Я никогда не использовал display: contents; — вероятно, потому, что на сегодняшний день поддержка браузеров довольно ограничена — но эта статья отлично объясняет, что это такое и почему это может быть полезно. Поскольку оно получает более широкую поддержку браузеров, я ожидаю, что это свойство станет ключевым инструментом в нашем наборе инструментов при создании макетов с поддержкой CSS-сетки.
Вдумчивая статья архитектора пользовательского интерфейса для URBN о том, как они объединили 3 сайта и команды в один. Охватывает процесс, дизайн и архитектуру CSS.
Обрезка негативного влияния высоты строки
Очень интересный метод и связанный с ним инструмент для обрезки пробелов над и под текстом. Шрифты чертовски сложны, и если вы когда-нибудь тратили кучу времени, пытаясь совместить текст разного размера с нетекстовыми элементами, вы очень оцените это.
Реализация режима уменьшенного движения
Одна из вещей, о которой говорила удивительная Рэйчел Наборс на VueConf, заключается в том, что, хотя для подавляющего большинства пользователей анимация добавит опыта и снизит когнитивную нагрузку, есть подмножество пользователей, для которых анимация может существенно ухудшить их способности. использовать ваш веб-сайт. В этой статье Хьюго Жирар показывает, насколько просто можно предложить параметр, отключающий анимацию, с помощью одного пользовательского свойства CSS.
Полное руководство по фоновым изображениям в электронной почте
Итак, стилизация электронных писем — это совершенно другой мир, чем стилизация для Интернета, несмотря на то, что в нем используются номинально одни и те же инструменты, но этот ресурс слишком хорош, чтобы им не поделиться. Litmus составил невероятное руководство по различным методам фоновых изображений электронной почты, а также руководства по совместимости, чтобы вы знали, что будет работать в каких почтовых клиентах.
JavaScript
7 секретных шаблонов, о которых консультанты Vue не хотят, чтобы вы знали — Крис Фриц
Крис выступил с этим докладом на VueConf, и это было феноменально. Я выучил несколько новых паттернов, которые планирую немедленно применить на практике. Эта запись с другого мероприятия, но я настоятельно рекомендую ее посмотреть.
Компоненты без рендеринга в Vue.js
Отличное глубокое погружение в более продвинутый шаблон для разработки компонентов Vue.js: отделение презентационных компонентов от чисто логических/контейнерных компонентов (здесь они называются компонентами без рендеринга). Этот шаблон поможет вам создать более многоразовый код; Я бы особенно рекомендовал его тем, кто разрабатывает библиотеки и фреймворки.
Vue CLI 3: революционный подход к фронтенд-разработке
Хотя я не уверен, что могу назвать новый интерфейс командной строки переломным моментом во всей фронтенд-разработке, это, безусловно, большой шаг вперед и, возможно, намек на будущее для интерфейсов командной строки FE framework в целом. Одним из больших улучшений является то, что Vue опирается на веб-пакет как на платформу, и это очень важно. Используя преимущества webpack-merge и webpack-chain, они значительно упрощают как использование знаний сообщества для конфигураций по умолчанию, так и настройку вашей сборки по желанию. До версии 3, как только вы настроили свою конфигурацию, вы могли попрощаться с обновлениями, поскольку вы отвечали за управление всей конфигурацией. В версии 3 эта проблема должна исчезнуть, что позволит вам легко обновить всю цепочку инструментов сборки vue, сохраняя при этом свои собственные части.
Изучение нулевой конфигурации с помощью Vue
Изучение различных способов создания вашего приложения Vue с использованием веб-пакета, Parcel или прыжков в vue-cli. Что приятно, так это то, что в наши дни все они довольно просты. Дни, когда мы часами возились с конфигурационными файлами только для того, чтобы запустить сборку, похоже, остались позади.
ГП-ускоренные нейронные сети в JavaScript
Итак, эта статья не связана с Vue, но она была чертовски крутой, чтобы ее пропустить. Растущая простота применения мощных методов машинного обучения является одним из самых больших достижений, происходящих в нашей отрасли прямо сейчас, и в этой статье освещается ряд способов, которыми вы можете погрузиться в использование чистого JavaScript.
Другое
Ты слишком стар, чтобы научиться программировать?
Спойлер: ответ — нет. Популярная культура (даже популярная техническая культура) представляет разработчиков программного обеспечения как молодых одиноких мужчин. Я думаю, что это исходит из стереотипа «Кремниевой долины» и увековечено такими вещами, как опрос разработчиков StackOverflow, в котором преобладают молодые одинокие люди, поскольку именно они тратят время на заполнение онлайн-опросов. Одна вещь, которая мне понравилась на VueConf.US на этой неделе, это то, сколько людей, которых я встретил, были в возрасте 30, 40 и 50 лет и имели детей. Эта индустрия более разнообразна, чем ее стереотипы, и если вы не верите автору, поверьте мне: вы не слишком стары, чтобы учиться программировать.
W дескрипторы и размеры: Под капотом
Глубокое погружение в адаптивные изображения и то, как браузеры их обрабатывают. Я мало использовал srcset, поэтому для меня это было ново — много неожиданного поведения и интересных пограничных случаев!
Крутые советы и рекомендации по Chrome DevTools, которые вы хотели бы знать
В этой статье есть все, от скриншотов отдельных элементов до точек останова на изменениях DOM и сохранения редактируемого CSS, которые сделают вашу жизнь проще. Обязательно просмотрите!
Насколько быстр усилитель на самом деле?
Увлекательное погружение в производительность AMP, отдельное от специальных страниц AMP для выставления счетов и обработки в результатах поиска Google. Особенно, если вы следили за драмой, связанной с особым отношением Google к страницам AMP и давлением, которое оказывает на издателей и связанных с ними. Оказывается, подавляющее большинство предполагаемых преимуществ производительности связано с особым подходом Google, а не с самим AMP.
Полное введение в Apollo, инструментарий GraphQL
Если вы заинтересованы в GraphQL, но еще не пробовали его, этот учебник предоставит вам все необходимое для настройки сервера и клиента GraphQL поверх любого существующего API, который у вас может быть, с использованием набора инструментов с открытым исходным кодом Apollo.
Счастливой пятницы!
Вам нравится этот информационный бюллетень? Получите его прямо в свой почтовый ящик! Каждую пятницу я рассылаю 15 ссылок на лучшие статьи, уроки и анонсы по CSS/SCSS, JavaScript, а также множество других замечательных Front-end новостей — подпишитесь здесь: https://zendev.com/friday-frontend.html
Первоначально опубликовано на zendev.com 30 марта 2018 г.
