Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
•
Подкаст «Frontend Weekend» #36 – Людмила Мжачих про MoscowCSS, Coding Girls и Лию Веру
•
Подкаст «Веб-стандарты», Выпуск №104: Уточнение про селектор matches, гриды для бизнеса, нейровёрстка, или как машины вас не заменят, согласие по main, общие JS-модули, шортики и уважение
•
Подкаст «Фронтенд Юность (18+)» #34 Программисты — зажравшиеся мажоры современности
•
Подкаст «devschacht»: Ночной фронтенд #18?—?PiterJS 21 и Я.Субботник в Нижнем Новгороде
•
«ALL YOUR HTML» #32: «Волнистые картинки на PIXI.JS»
•
Loftblog Devshow: «React.js — Советы от профи». Создатель подкаста «Пятиминутка React» Пётр Мязин рассказывает про React и даёт полезные советы новичкам
•
Веб-компоненты: обзор и использование в продакшне
• Bootstrap 4 вышел из беты, обсуждение на reddit
•
Как создать Living Style Guide
•
Недокументированные приемы CSS
• БЭМ для начинающих. Очевидные и неочевидные вопросы верстки
•
5 интересных свойств HTML и CSS, которые стоит ожидать в 2018
•
Насколько большой этот прямоугольник? Понимание размеров в CSS Layout
•
Изучаем CSS Grid Layout с помощью Swiss
•
Layout Land — новое шоу на YouTube от Jen Simmons, посвященное Grid Layout
•
Соглашения наименования CSS, которые сохранят вам часы отладки
•
Нечестные таблицы стилей. Пример трекинга/аналитики сайта с помощью чистого CSS без JavaScript
•
CSS Paint API
•
CSS Grid + CSS Multi-Columns = <3
•
cssgrid.io — бесплатный курс по CSS Grid из 25-ти видео от Wes Bos
• JavaScript: прогнозы трендов на 2018 год по результатам международного опроса
•
JavaScript и ужасы мутаций
•
Машины состояний и разработка веб-приложений
•
Полное руководство по фреймворкам в JavaScript
•
Релиз jQuery 3.3.0 – несколько новых функций и целый букет deprecations
•
Итак, вы хотите использовать ES6 модули
•
Полное руководство по развертыванию JavaScript приложений, часть 2: Single Page Applications, Logging, SSL
• Firefox 58 будет оснащен новым двухуровневым компилятором
• Новые веб-технологии в Mozilla Firefox будут доступны только через HTTPS
•
Улучшение DevTools Console в Windows 10 Fall Creators Update
•
Что нового в DevTools (Chrome 65)
• Google и Mozilla отправят JPEG «на пенсию»
• Google запустила на Coursera серию курсов по базовым понятиям IT-сферы
• Самые ожидаемые научные эксперименты ближайшего десятилетия
• Мистер Amazon выходит в свет: как Джефф Безос из тихого продавца книг превратился в рок-звезду от бизнеса
• Японские ученые создали нейросеть, превращающую мысленные образы в изображения
• Google анонсировала AutoML – сервис создания нейросетей для новичков
• Intel признался, что проблемы с частыми перезагрузками из-за ошибок в заплатках есть не только в CPU Broadwell и Haswell, но также у предшественников и преемников
• Искусственные интеллекты от Alibaba Group и Microsoft впервые обошли человека в тесте на обработку информации
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
•

•

•

•

•

•

Веб-разработка
•

• Bootstrap 4 вышел из беты, обсуждение на reddit
•

- Производительность:
•Как ускорить загрузку сайта: 7 советов по оптимизации для начинающих
•Даже если ваш сайт не ориентируется на развивающиеся рынки, это не означает, что его не надо оптимизировать
• Скорость загрузки станиц будет влиять на результаты поисковой выдачи Google (C июля 2018)
•Как оптимизировать CSS и JS для ускорения сайта. Обзор стандартных практик
•Измеряем производительность AMP
•Ускоряем сайт с помощью preconnect подсказок
•Speedometer 2.0 — новый тест производительности JS в браузерх, созданный при участии команд WebKit и Chromium
- Инструменты:
•Инструменты: Gulp — новый выпуск на канале .getInstance
•hey meta — быстрая проверка и генерация социальных мета-тегов
•Вышел Puppeteer 1.0: Chrome 65, JS/CSS code coverage API, кастомизация PDF, поддержка XPath, доступ к протоколу devtools
•Сохраняем скорость webpack: руководство для повышения производительности
- Accessibility:
•Список списков со ссылками на материалы и ресурсы, посвященные доступности
•Chrome DevTools предоставляет отличный способ определить и исправить соотношения цветового контраста для соответствия стандартам доступности. Color picker — это практически все, что вам надо
•Начинаем работать с доступностью во Vue. Как работает vue, использование ARIA, динамическая настройка заголовков с помощью vue-router и управление фокусом с помощью директив
•Пять вариантов, в которых искуственный интеллект может изменить веб-доступность
•В US вступил в силу новый федеральный закон, обязывающий быть доступными все государственные сайты (Section 508 Compliance)
- Анимация:
•18 креативных примеров CSS анимации
•Simplex Flower Generator — Three.js/WebGL
•Интересный слайдшоу-эффект с увеличением силуета
•Canvas-симуляция эффекта желе на javascript/HTML5
CSS
•

• БЭМ для начинающих. Очевидные и неочевидные вопросы верстки
•

•

•

•


•

•

•

•

•

JavaScript
• JavaScript: прогнозы трендов на 2018 год по результатам международного опроса
•

•

•

•

•

•

VueJS:
•Базовый Vue — открытые лекции по курсу Vue от Javascript.Ninja: Vue: начало, Реактивность
•Что нового в Vue Devtools 4.0
•Лучшие практики по аутентификации для Vue
•Как создать ваш первый компонент Vue.js
•Создание бессерверной формы чекаута на Vue.js: Часть 1 — Настройка и тестирование, Часть 2 — Stripe Function и хостинг, Чаcть 3 — приложение компонент чекаута, Часть 4 — настройка компонента чекаута
React:
•Как использовать Webpack с React: полное руководство
•Разделение кода с помощью React и React Router
•Продвигаем производительность React
•Когда использовать (а когда нет) Redux
•Часто задаваемые вопросы React.js
•Введение в After.js — фреймворк в стиле Next.js для рендерящихся на сервере приложений React, созданных с помощью React Router 4
•Кодим при создании дизайна —?как мы создали инструмент для экспорта прототипов React из Sketch
Angular:
•Настройка Prettier на Angular CLI Project
•Angular CSS классы с NgClass
•Познаем модуль в Angular 2: @NgModule
- Libs & Plugins:
•json-dry — позволяет превращать в JSON и распарсивать объекты, содержащие круговые ссылки, даты, регулярки
•Bulb: библиотека для реактивного программирования в JavaScript
•jarvis — очень продвинутая браузерная приборная доска для Webpack
•webshot-factory — масштабируемое снятие скриншотов в headless Chrome
Браузеры
• Firefox 58 будет оснащен новым двухуровневым компилятором
• Новые веб-технологии в Mozilla Firefox будут доступны только через HTTPS
•

•

Занимательное
• Google и Mozilla отправят JPEG «на пенсию»
• Google запустила на Coursera серию курсов по базовым понятиям IT-сферы
• Самые ожидаемые научные эксперименты ближайшего десятилетия
• Мистер Amazon выходит в свет: как Джефф Безос из тихого продавца книг превратился в рок-звезду от бизнеса
• Японские ученые создали нейросеть, превращающую мысленные образы в изображения
• Google анонсировала AutoML – сервис создания нейросетей для новичков
• Intel признался, что проблемы с частыми перезагрузками из-за ошибок в заплатках есть не только в CPU Broadwell и Haswell, но также у предшественников и преемников
• Искусственные интеллекты от Alibaba Group и Microsoft впервые обошли человека в тесте на обработку информации
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
dark_ruby
Спасибо за подборку, совсем ничего про ReasonML?
alexzfort Автор
Пока что мало, но точечно не отслеживал… Следующий раз постараюсь что-то найти