• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко, Ольга Алексашенко

Темы

00:00:00 Интро
00:00:45 Новинки браузеров
00:07:42 PhantomJS 2.1
00:10:16 Переменные в CSS
00:19:43 Sass с PostCSS
00:24:37 Загрузка шрифтов
00:32:36 Спрайты
00:36:25 Адаптивные картинки
00:38:01 HTTPS
00:43:38 Парадоксы HTML и CSS
00:47:18 Коты JS-фреймворки

Новинки браузеров

• Chrome 48
• Firefox 44

PhantomJS 2.1

• PhantomJS 2.1

Переменные в CSS

• Переменные как основа архитектуры CSS при работе с препроцессорами

Sass с PostCSS

• Extending Sass with PostCSS

Загрузка шрифтов

• Минимально необходимые шрифты

Спрайты

• A Gulp-Based External SVG Symbol Sprite Icon System

Адаптивные картинки

• Responsive Image Breakpoints Generator

HTTPS

• Почему до сих пор повсеместно не используется HTTPS?

Парадоксы HTML и CSS

• WTF, HTML & CSS?

Коты JS-фреймворки

• Which cat is your JavaScript framework?

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:28 События
00:05:42 БЭМ
00:14:46 Gulp
00:19:56 Раскладки: флексы, гриды
00:28:44 Планы Edge на год
00:33:19 Firefox OS всё

События

• PiterCSS №1
• Frontend Conf
• Яндекс.Субботник

БЭМ

• БЭМ-методология: с чего всё начиналось и зачем это всё нужно
• Видео «БЭМ — норм»

Gulp

• Скринкаст по Gulp Ильи Кантора
• Скринкаст по Webpack Ильи Кантора
• run-sequence

Раскладки: флексы, гриды

• Learn CSS Layout
• Grid Layout

Планы Edge на год

• Looking ahead: Microsoft Edge for developers in 2016

Firefox OS всё

• Mozilla to end development for Firefox OS on smartphones in IoT shift

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Андрей Саломатин

Темы

00:00:00 Интро
00:00:25 События
00:05:52 Обновился Grunt
00:17:07 Увлечение npm-скриптами
00:20:18 Особенности const и let из ES6
00:33:18 Как дела у Гитхаба
00:42:07 Подкасты

События

• PiterCSS №1
• Frontend Union Conf 2016

Обновился Grunt

• Grunt 1.0.0 rc1 released

Увлечение npm-скриптами

• Advanced front-end automation with npm scripts

Особенности const и let из ES6

• For and against let
• ES6 const is not about immutability

Как дела у Гитхаба

• Проблемы роста GitHub: Увольнение ключевых сотрудников, смена руководства и зарождение «культуры страха»

Подкасты

• RadioJS
• Code Podcast

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:01:37 Редакторы и плагины
00:12:01 Разработка на мобильных
00:22:45 Вёрстка писем
00:34:16 CSS-переменные
00:47:20 Альтернативная подгрузка стилей
00:52:15 Примеры использования calc()

События

• The Rolling Scopes Conference
• Видео с The Rolling Scopes Conference
• MoscowJS
• Я.Субботник по фронтенду
• PiterCSS

Редакторы и плагины

• Используем VS Code для Веб-разработки
• Why I love Visual Studio Code for CSS / HTML development
• Hayaku
• CSSComb

Разработка на мобильных

• Prompt 2

Вёрстка писем

• Using Flexbox in an Email
• The Fab Four technique to create Responsive Emails without Media Queries
• Punched card coding

CSS-переменные

• Theme switcher using CSS custom properties
• Почему я в восторге от «родных» CSS-переменных
• Tab Atkins, The Future of CSS

Альтернативная подгрузка стилей

• Control CSS loading with custom properties
• Управление загрузкой CSS с помощью пользовательских свойств

Примеры использования calc()

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:17 События
00:03:25 SVG и GitHub без иконочных шрифтов
00:09:52 Google Resizer
00:10:46 Переводы CSS-live
00:15:10 Sass и ES2015
00:18:50 CSS Snap Size
00:20:35 Селектор :root
00:24:36 Типографика
00:41:43 Завершение: ваши вопросы

События

• SPB Frontend
• Видео с SPB Frontend
• Я.Субботник по фронтенду
• Лог текстовой трансляции с Яндекс.Субботника
• PiterCSS №2
• CodeFest 2016
• DUMP 2016
• Стачка 2016

SVG и GitHub без иконочных шрифтов

• Delivering Octicons with SVG
• Что случается с SVG-иконками, вставленными через use

Google Resizer

• Introducing resizer

Переводы CSS Live

• Свойство background-clip и его применения
• Краткий обзор object-fit и object-position

Знаете Sass? Значит знаете и ES2015!

• You Know Sass, You Know ES2015

CSS Snap Size

• CSS Snap Size, черновик спецификации для вертикального ритма со свойством snap-height

Про селектор :root

Типографика

• The New Web Typography
• Основы стиля в типографике

Завершение: ваши вопросы

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Слава Олиянчук

Темы

00:00:00 Интро
00:00:53 События
00:01:02 Флексбокс — кандидат в рекомендации
00:06:19 Определение article
00:09:12 Висячая пунктуация
00:13:47 Обновился CSSO
00:18:37 Быстродействие
00:26:17 HTTP/2
00:32:37 Блютус в вебе
00:34:18 Про SVG по-русски
00:37:26 БЭМ и шаблонизация
00:48:22 Шаблонизатор BEM-XJST
01:00:20 Завершение: ваши предложения

События

• PiterCSS №2 22 марта

Флексбокс — кандидат в рекомендации

• Флексбоксы готовы!
• Полифил Flexibility
• Будущее механизмов раскладки

Определение article

• Rewrite of the article element definition

Висячая пунктуация

• Висячая пунктуация в WebKit
• Gosh Hang It!
• Типограф Муравьёва

Обновился CSSO

• CSSO 1.6.0 release

Быстродействие

• Preload: What Is It Good For?

HTTP/2

• HTTP/2: готовимся к переходу
• Не гзипом единым, видео с Я.Субботника
• Твиттер Frontend Performance

Блютус в вебе

• An introduction to the Web Bluetooth API

Про SVG по-русски

• SVG в вебе. Практическое руководство

БЭМ и шаблонизация

Про шаблонизатор BEM-XJST

• Видео доклада про BEM-XJST
• Репозиторий проекта

Завершение: ваши предложения

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:18 События
00:01:58 Кризис ожирения сайтов
00:07:47 Реклама
00:30:39 Новинки браузеров
00:35:16 Background Sync
00:36:45 Статус Grid Layout в Blink
00:38:57 Любовное письмо к jQuery
00:42:02 Давайте полегче с JavaScript
00:48:32 HTML: что дальше?
00:51:20 Оформление поломанных картинок
00:55:42 WTF Opera Mini?!
00:56:48 Полифил для object-fit на SVG
00:58:11 Зовём Андрея Ситника

События

• День рождения SPB Frontend
• OdessaJS
• Текстовые трансляции с конференций, дополнение к @webstandards_ru
• Логи трансляций

Кризис ожирения сайтов

• Кризис ожирения сайтов

Реклама

• Вышел браузер Opera со встроенным блокировщиком рекламы
• A Never-Ending Story On Ad-Blockers

Новинки браузеров

• Firefox 45
• Chrome 49

Background Sync

• Introducing Background Sync

Статус Grid Layout в Blink

• CSS Grid Layout. Current Status and Future Plans

Любовное письмо к jQuery

• Любовное письмо к jQuery

Давайте полегче с JavaScript

• Maybe we could tone down the JavaScript

HTML, что дальше?

• HTML: What’s Next?

Оформление поломанных картинок

• Styling Broken Images
• Generated and Replaced Content
• Pseudo-Elements

WTF Opera Mini?!

• Opera Mini Tips

Полифил для object-fit на SVG

• Object-fit polyfill

Зовём Андрея Ситника

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:21 События
00:02:10 Единицы измерения шрифта
00:18:07 Инлайнить ли шрифты
00:23:19 Новинки браузеров
00:36:36 Голый CSS на отступах
00:42:10 Лево и право для CSS-свойств
00:45:00 Критика React
00:55:36 Опрос Stack Overflow

События

• PiterCSS
• CodeFest
• Видео с WSD
• WSD в Питере

Единицы измерения шрифта

• Адаптивная типографика на единицах вьюпорта
• Что использовать в медиавыражениях: пиксели, емы, ремы?
• Сайт Dev.Opera
• Sass MQ
• Миксин ремы-пиксели

Инлайнить ли шрифты

• Антипаттерн для веб-шрифтов: Data URI
• Homebrew web font tools

Новинки браузеров

• Новинки Chrome 49 и Opera 36
• Поддержка расширений в тестовой версии Edge
• Обзор новинок Firefox Developer 47
• Браузерный движок нового поколения Servo
• Browser HTML

Голый CSS на отступах

• SugarSS
• За что я люблю CoffeeScript
• Emmet
• Hayaku
• CSSComb

Лево и право для CSS-свойств

• Флексбокс вполне логичен
• postcss-bidirection
• RTLCSS

Критика React

• На освоение React мне потребовалась всего неделя
• Polymer
• Презентация на React
• Сайт PostCSS

Опрос Stack Overflow

• Developer Survey 2016
• NotePad++

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Андрей Ситник

Темы

00:00:00 Интро
00:00:09 Андрей Ситник
00:00:20 События
00:00:27 Кто же новый IE?
00:11:33 Npm-гейт
00:27:49 Проблемы npm
00:33:25 «Мой» опенсорс
00:39:05 Агрессивный маркетинг PostCSS
01:01:51 Сахарный CSS
01:04:51 Это была шутка!

Андрей Ситник

• Твиттер
• Злые марсиане

События

• CodeFest
• DUMP
• Стачка

Кто же новый IE?

• Apple is bad news for the future of the Web
• Никита Васильев
• The Chrome Distortion: how Chrome negatively alters our expectations

Npm-гейт

• I’ve Just Liberated My Modules
• A discussion about the breaking of the Internet
• Kik, left-pad, and npm
• Пакет left-pad
• How to not break the internet with this one weird trick

Проблемы npm

• Using Release It!
• Массив files в package.json

«Мой» опенсорс

• There is no “my” in open source

Агрессивный маркетинг PostCSS

• #СитникХватит
• postcss-sorting
• stylelint
• Modular CSS preprocessing with rework
• rtlcss
• uncss
• postcss-inline-svg
• cssnext
• precss
• postcss-import
• postcss-easy-import

Сахарный CSS

• SugarSS

Это была шутка!

• Прогрессивное улучшение меня расстраивает

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:12 События
00:01:30 Bash на Windows
00:08:15 Новая тестовая сборка Safari
00:17:00 Оценка задач фронтендера
00:31:49 Определение тормозов на лету
00:36:41 Селекторы для системных элементов
00:39:25 Нужны ли препроцессоры
00:47:11 Что появится в ES2016
00:52:40 Новости про новости

События

• DUMP
• Стачка

Bash на Windows

• Running Bash on Ubuntu on Windows!
• The Ubuntu Userspace for Windows Developers

Новая тестовая сборка Safari

• Introducing Safari Technology Preview
• Add WebKit prefixes for Grid Layout

Оценка задач фронтендера

• Перевод

Определение тормозов на лету

• Performance measurements through requestAnimationFrame

Селекторы для системных элементов

• Styling native components, a proposal

Нужны ли препроцессоры

• Why I don’t use CSS preprocessors

Что появится в ES2016

• Список того, что появится в ES2016

Новости про новости

• Завели Телеграм
• Убиваем Google+

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Олег Мохов

Темы

00:00:00 Интро
00:00:30 События
00:01:10 Как сделать конференцию
00:18:09 Путь разработчика
00:26:23 Релизы CSSO 2.0 и Grunt 1.0
00:30:30 Анонсы с Веб-саммита Edge
00:38:46 Экспериментальный браузер Tofino
00:39:32 Эмоджи, нет, эмодзи

События

• SPB Frontend №13
• Frontend Party

Как сделать конференцию

• Доклад Олега с Субботника
• DUMP
• FrontTalks
• Fronteers
• OrenJS
• FrontendFellows

Путь разработчика

• Frontend Dev: хороший, плохой, злой

Релизы CSSO 2.0 и Grunt 1.0

• 2.0.0 Drop legacy API and new AST format
• Grunt 1.0.0 Released

Анонсы с Веб-саммита Edge

• My Top Takeaways From the 2016 Edge Web Summit
• EdgeHTML issue tracker
• Global CSS Property Usage
• API Catalog
• Microsoft Edge Web Summit 2016

Экспериментальный браузер Tofino

• Browsers, Innovators Dilemma, and Project Tofino

Эмоджи, нет, эмодзи

• Emoji: how do you get from U+1F355 to …?
• Investigating the Potential for Miscommunication Using Emoji

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:02:17 Регрессионное тестирование
00:07:38 Фолбэк для флекса
00:14:18 Директива @​apply, миксины в CSS
00:26:30 Прогрессивные веб-приложения
00:44:25 Версии CSS
00:51:15 Кому нужна семантика?

События

• Прошла FDConf в Минске
• Стачка в Ульяновске 22—23 апреля
• PiterCSS №3 26 апреля
• MoscowJS 28 апреля
• Frontend Party в Питере 29 апреля
• HolyJS в Питере 5 июня

Регрессионное тестирование

• Автоматизация регрессионного тестирования CSS
• Doing nothing for visual regression testing

Фолбэк для флекса

• Почти полное руководство по флексбоксу без самого флексбокса
• Инлайновый контекст форматирования
• Мечты и реальность. Прощай CSS3, здравствуй IE6

Директива @​apply, миксины в CSS

• CSS @​apply Rule, спека
• postcss-apply
• cssnext
• CSS @​apply rule (native CSS mixins)

Прогрессивные веб-приложения

• PWA Rocks
• PWA List на Гитхабе
• Web App Manifest
• Service Workers replacing AppCache: a sledgehammer to crack a nut
• CSS Houdini

Версии CSS

• CSS 2.2
• CSS Snapshot

Кому нужна семантика?

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:01:57 Браузерные новости
00:14:18 Методологии CSS
00:21:15 Stylelint и CSSX
00:36:41 Параллакс
00:43:05 Booking сделал PWA
00:44:02 Доступное содержимое
00:55:13 Что слушаете?

События

• Стачка в Ульяновске
• PiterCSS №3 26 апреля
• MoscowJS 28 апреля
• HolyJS в Питере 5 июня

Браузерные новости

• Project SpiderNode
• Embed Everything!
• Free VPN integrated in Opera for better online privacy
• Opera is doubling the server capacity after the built-in VPN launch

Методологии CSS

• MaintainableCSS
• Микрометодология вёрстки OPOR

Stylelint и CSSX

• Stylelint
• CSSComb
• Finally, CSS In JavaScript! Meet CSSX
• На освоение React мне потребовалась всего неделя, а чем вы хуже?

Параллакс

• Diving In: Parallax

Booking сделал PWA

• Progressive Web Apps with Service Workers

Доступное содержимое

• Aesthetics of the invisible
• Thus Spoke HTML
• ARIA, Accessibility APIs and coding like you give a damn!

Что слушаете?

• Аэростат
• Frontflip Podcast
• RadioJS
• Радио-Т

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:02:27 Node.js 6
00:23:26 Новые методы DOM
00:24:56 Иконки, графика и чистый CSS
00:40:37 Жизнь и смерть в опенсорсе
00:45:42 Эксперименты и префиксы
00:49:49 Firefox как новый IE, в хорошем смысле

События

• PiterCSS №3
• Frontflip
• Текстовые трансляции
• FrontendConf в Москве 30—31 мая и 1 июня
• HolyJS в Питере 5 июня
• Видео с FrontTalks

Node.js 6

• Node v6.0.0
• Node.js ES2015 Support
• ES6 in Node v6
• Chrome Canary 100% ES6
• ES6, ES7, and beyond

Новые методы DOM

• Методы DOM prepend, append, before, after и replaceWith

Иконки, графика и чистый CSS

• Making the Switch Away from Icon Fonts to SVG: Converting Font Icons to SVG
• Working with Images in Stylesheets with PostCSS
• Why I don’t use CSS preprocessors
• Borschik

Жизнь и смерть в опенсорсе

• Is CSScomb.js dead?
• CSScomb: Sorting CSS Properties, The Better Way

Эксперименты и префиксы

• Updating Our Prefixing Policy
• Префиксы. Зачем и как правильно

Firefox как новый IE, в хорошем смысле

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:15 События
00:09:33 Новинки Chrome и Opera
00:15:02 Блокировщики рекламы это честно?
00:24:29 Pointer Events в Chrome
00:33:40 Ещё раз про гриды
00:36:14 Универсальные расширения
00:42:34 Веб-компоненты ещё живы?
00:55:35 CSS-модули «ни о чём»

События

• Webdev Talks&Works
• СПЕЦИА
• Frontend Conf
• CSSconf Nordic
• Web Rebels
• ScotlandCSS
• ScotlandJS
• HolyJS
• HTML Special и CSS Day
• CSSconf Budapest
• JSConf Budapest
• PWA Dev Summit
• Текстовые трансляции
• Архив трансляций

Новинки Chrome и Opera

• What’s new in Chromium 50 and Opera 37

Блокировщики рекламы это честно?

• Native ad blocker and video pop out ready in Opera
• Free ad blocker right in new Opera Mini for Android

Pointer Events в Chrome

• Chrome Status: Pointer Events
• «Карточный домик» Романа Дворнова
• Apple Meta Viewport
• W3C Touch Events
• Шутка про IE6 или ES6

Ещё раз про гриды

• Гриды в WebKit без префиксов
• Можно вообще всё. Раскладка по гриду
• OdessaJS 2016

Универсальные расширения

• WebExtensions in Firefox 48
• For a Better Extensions Ecosystem
• Core API Proposal

Веб-компоненты ещё живы?

• Web Components and Model Driven Views, Alex Russell
• Polymer
• Are We Componentized Yet?
• How GitHub is using Web Components in production

CSS-модули «ни о чём»

• Что такое CSS-модули и зачем они нам?

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:15 События
00:03:39 Как браузеры экономят батарейку
00:16:50 Оптимизация графики
00:33:44 Прозрачность в HEX-цветах
00:43:06 !important можно, если нужно
00:48:27 Фантомные страхи и адаптивные таблицы
00:52:06 Полифил через юзер-агент

События

• Лог трансляции с CSSConf в Будапеште
• WSD в Екатеринбурге 25 июня
• FrontendFellows в Перми 27 мая
• FrontendFellows в Астане 29 июля
• Rolling Scopes Summer Summit в Минске 4 июня
• Видео с PiterCSS №3

Как браузеры экономят батарейку

• Introducing power saving mode in Opera

Оптимизация графики

• Reducing JPG File size
• ImageAlpha
• Can I Use: WebP
• APNG
• MozJPEG

Прозрачность в HEX-цветах

• RGBA и RRGGBBAA в Firefox 49
• Color in Opera 10 — HSL, RGB and Alpha Transparency

!important можно, если нужно

• The Importance of !important: Forcing Immutability in CSS
• Likely

Фантомные страхи и адаптивные таблицы

• CSS only Responsive Tables
• Accessible, Simple, Responsive Tables

Полифил через юзер-агент

• Polyfill.io

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:04:01 Семантика и БЭМ
00:29:40 CSS для новичков
00:32:09 Контроль версий и клиенты
00:45:51 JS-модули в Edge!
00:51:42 Google I/O

События

• PiterCSS №4 24 мая
• WSD в Екатеринбурге 25 июня
• Frontend Union Conf в Вильнюсе 27 августа
• HolyJS 5 июня

Семантика и БЭМ

• Осмысленный CSS: описывайте стилями свою логику
• Бэмантика: пишите осмысленные стили без повторов
• More Meaningful CSS
• Семантика или смерть
• MIND, библиотека доступных элементов интерфейса eBay

CSS для новичков

• Магия CSS
• Отладка CSS

Контроль версий и клиенты

• GitKraken
• Tower
• GitHub Desktop
• GitBox
• GitUp
• Термины Гита и Гитхаба

JS-модули в Edge!

• Previewing ES6 Modules and more from ES2015, ES2016 and beyond
• ES-модули в Firefox

Google I/O

• Страница события
• Веб и Chrome на Google I/O
• Autofill: What web devs should know, but don’t
• Progressive Web Apps
• Accelerated Mobile Pages
• Комикс xkcd

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:02:34 Статьи для новичков
00:06:38 Reset против Normalize
00:13:29 JS для начинающих
00:15:33 Дилетанты и профессионалы
00:25:20 Зачем разбираться в SVG
00:29:25 Атомарный CSS
00:37:45 Программирование на CSS
00:49:60 Сервис-воркеры в Safari

События

• Frontend Conf
• ScotlandJS
• ScotlandCSS
• HolyJS 5 июня
• Встреча с докладчиками
• Fronteers

Статьи для новичков

• От нуля до героя фронтенда, часть 2
• Хорошие и плохие CSS-практики для начинающих
• Михаил Дубаков
• Бесплатный курс Академии по SVG

Reset против Normalize

• Reset.css
• Normalize.css
• Sublime Autoprefixer
• Atom Autoprefixer

JS для начинающих

Дилетанты и профессионалы

• jQuery и Bootstrap: расставляем точки над «i»
• Мобильный Твиттер
• UnCSS

Зачем разбираться в SVG

• Бесплатный курс Академии по SVG

Атомарный CSS

• Universal.css
• OrnaJS
• Cutestrap
• Flex Layout Attribute
• Material Design Lite

Программирование на CSS

• CSS When/Else Rules

Сервис-воркеры в Safari

• Safari TP5
• Service Workers 101
• Сервис-воркеры в Edge
• Джейк Арчибальд
• Тимоти Хэтчер
• Bringing seamless checkouts to the mobile web
• Payment Request API

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:06:40 Семантика CSS и HTML
00:22:00 Содержимое в CSS
00:31:46 Полезное для SVG
00:38:46 Веб и приложения

События

• HolyJS
• Антихайп, Андрей Листочкин
• Лог со ScotlandCSS
• Лог со ScotlandJS №1
• Лог со ScotlandJS №2
• HTML Special и CSS Day
• WSD в Екатеринбурге

Семантика CSS и HTML

• Семантический CSS
• Понимание семантики
• Слова в CSS-классах
• Managing CSS Projects with ITCSS
• BEML

Содержимое в CSS

• CSS Generated Content
• Модуль генерируемого контента CSS3 обновился спустя 13 лет

Полезное для SVG

• SVG Crowbar
• SVGO compression

Веб и приложения

• State of the gap
• Регрессивные веб-приложения
• Instant Articles
• Why is Instagram not a website (yet)?

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Дмитрий Барановский

Темы

00:00:00 Интро
00:00:13 События
00:06:10 Релизы недели
00:17:06 Практический CSS
00:23:01 Типографика на SVG
00:25:38 Чёртов открытый веб
00:39:49 Как дела в Adobe

События

• PiterCSS №5 17 июня
• WSD в Екатеринбурге
• HTML Special и CSS Day
• Progressive Web App Dev Summit
• OdessaJS
• Web Directions
• JSConf AU
• CSSConf AU

Релизы недели

• Firefox 47
• WebExtensions API
• Announcing LastPass for Microsoft Edge
• What’s new in Chromium 51 and Opera 38
• Presentation API
• jQuery 3.0

Практический CSS

• Avoid Overstyling Base Styles
• CSS at BBC Sport
• Do websites need to look exactly the same in every browser?

Типографика на SVG

• Type Terms

Чёртов открытый веб

• The Fucking Open Web
• PWA Discovery: You Ain’t Seen Nothin Yet

Как дела в Adobe

• Dmitry Baranovskiy’s Web Log
• Эдоуби
• Snap.svg
• Raphaël
• Adobe Experience Design (XD)
• Sketch
• Creative Cloud Extract (Project Parfait)
• SVGO Compressor для Sketch
• SVGO Exporter for Adobe Illustrator
• SVGO
• Avocode
• Webflow
• Brackets
• Adobe Web Platform
• CSS Regions
• Snap.svg Animator для Adobe Flash

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:06:49 Шрифты
00:13:39 Практика
00:37:44 Новинки Safari

События

• HTML Special и CSS Day
• Лог с HTML Special
• Лог с CSS Day
• Саммит по PWA
• PiterCSS №5
• Видео с PiterCSS

Шрифты

• Google Fonts
• Паттерны загрузки веб-шрифтов

Практика

• Что должен знать HTML-верстальщик?
• Improving CSS quality at Facebook and beyond
• Как во флексбоксе работают z-index и автоотступы
• New CSS Flexbox behavior for absolute-positioned children
• Pixel Density, Demystified
• Anchors vs Buttons

Новинки Safari

• Safari 10.0
• Apple Pay JS
• Apple Pay on the Web
• Видео сессии про Apple Pay с WWDC

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Андрей Сумин

Темы

00:00:00 Интро
00:00:13 События
00:09:03 Samsung купила Joyent
00:13:39 Element Queries
00:17:30 React в Mail.Ru
00:25:31 Стандарты и семантика
00:45:51 Собеседования и новички
00:57:54 Как верстальщику стать замтехдира

События

• WSD в Екатеринбурге
• Видео с WSD
• Круглый стол на саммите PWA и другие видео
• The Progress of Web Apps (Edge)
• MoscowJS №31
• OdessaJS
• Билеты на Frontend Union Conf
• Видео с Frontend Union Conf 2015

Samsung купила Joyent

• Samsung acquires Joyent
• Node.js Foundation

Element Queries

• EQCSS
• Container Queries: Once More Unto the Breach

React в Mail.Ru

• Facebook Messenger
• Про Messenger на JSConf в Берлине
• Константин Лебедев на Фейсбуке
• Андрей Сумин в Фейсбуке
• Новый фронтенд Tinkoff.ru: Fluxible + React

Стандарты и семантика

• Насколько строго вы следуете стандартам и лучшим практикам на фронтенде
• Документация по y5
• The web platforms, plural, PPK

Собеседования и новички

• Что ожидать на собеседовании на HTML-верстальщика или JS-программиста

Как верстальщику стать замтехдира

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:12 События
00:02:27 HTML 5.1
00:07:57 Откопали Dreamweaver
00:16:19 Гудини заработал
00:21:10 Ссылки и безопасность
00:37:01 Наставничество

События

• OdessaJS 2—3 июля
• FrontTalks 17—18 сентября
• JSconf EU и CSSconf EU 5—7 мая 2017
• Frontend Mix 7 июля
• Яндекс.Субботник 9 июля

HTML 5.1

• HTML5.0 уходит в прошлое
• Multirange

Откопали Dreamweaver

• Dreamweaver is back for us, coders
• Блог Brackets

Гудини заработал

• Paint Worklet API

Ссылки и безопасность

• About rel=noopener
• Everything about controlling the Referer header
• Джереми Кит на HTML Special
• Things to Know with Third-Party Scripts

Наставничество

• Алёна Батицкая на PiterCSS №5
• Путь наставника
• Алексей Рыбаков, он же Flack
• Пособие для новичков Стаса Мельникова

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:14 События
00:05:23 Новости браузеров
00:14:06 Цвета в вебе
00:25:41 Практика
00:41:47 Портфолио
00:55:50 О подкасте

События

• Frontend Mix
• Я.Субботник
• Frontend Union Conf
• FrontTalks
• Календарь WSD

Новости браузеров

• Safari Technology Preview Release 8
• Servo Nightly Builds Available
• Псевдокласс focus-within

Цвета в вебе

• Improving Color on the Web
• CSS Color Module Level 4
• Свойство currentcolor
• Disable #RRGGBBAA and #RGBA color values due to compat issues

Практика

• Относитесь к сеткам (на флексбоксах) проще
• Susy
• Lost Grid
• Unlabelled search fields
• Creating a custom input cursor/caret
• Не проверив HTML5-кода, не суйся в воду
• Invisible Content Just for Screen Reader Users
• html-tree

Портфолио

О подкасте

• Эпизоды на Гитхабе

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Антон Виноградов

Темы

00:00:00 Интро
00:00:13 События
00:03:03 Плагины для Atom
00:10:44 Доступность
00:14:26 Загрузка шрифтов
00:19:59 Введение в промисы
00:26:16 Векторные эффекты
00:29:10 Кто такой Антон Виноградов?
00:39:39 Инструменты для дизайнеров
00:58:13 Расшифровки подкаста

События

• IT Global Meetup
• Frontend Union Conf, промо-код WelcomeWST со скидкой 15%
• MoscowJS №32
• FrontendFellows в Астане 29 июля
• FrontendFellows в Алматы 30 июля
• WSD осенью, заявки на wst@web-standards.ru

Плагины для Atom

• Atom treasures, a list of Atom plugins I can’t live without
• HyperTerm, терминал на Electron и веб-технологиях
• Atom Minimap
• Atom Pair

Доступность

• ChromeLens
• Accessibility Developer Tools
• A11y Command-line Tools

Загрузка шрифтов

• A Comprehensive Guide to Font Loading Strategies
• CSS Font Rendering Controls
• Can I use: font-display support

Введение в промисы

• JavaScript Promises 101

Векторные эффекты

• SVG Vector Effects

Кто такой Антон Виноградов?

• Антон Виноградов
• Данила Ковчий
• Антон Шеин
• Роман Шамин
• Design Prosmotr
• О чём смеются верстальщики
• Школа дизайна Яндекса

Инструменты для дизайнеров

• Next-Generation RWD Tools: Webflow, Edge Reflow, Macaw
• Protein
• Protein Dynamics for Sketch
• Framer

Расшифровки подкаста

• Выпуск №24

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:02:17 Браузеры
00:08:14 Safari и MathML
00:14:12 Font-display в Firefox
00:18:12 Будущее WebP и WebM
00:29:46 Зачем HyperTerm?
00:37:32 Книги
00:40:00 Путь фронтендера

События

• KharkivCSS 17 сентября
• LvivJS 27 августа
• HolyJS 10 декабря

Браузеры

• Chrome 52: Contain Property, the PerfObserver API & SW Stream
• CSS Containment
• Performance Observer API
• Performance measurements through requestAnimationFrame
• Battery Status API
• Service Worker Streamed Responses

Safari и MathML

• Release Notes for Safari Technology Preview Release 9
• Improvements in MathML Rendering
• MathML is a failed web standard

Font-display в Firefox

• Experimental font-display support in Firefox
• Firefox Platform Status

Будущее WebP и WebM

• Apple tests Google graphics format to speed up websites
• Lepton image compression: saving 22% losslessly from images at 15MB/s

Зачем HyperTerm?

• HyperTerm

Книги

• ВСТ рекомендует книги
• Practical SVG
• High Performance Images
• Версия в PDF

Путь фронтендера

• Frontend Dev: хороший
• Frontend Dev: плохой
• Frontend Dev: злой

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:26 События
00:04:57 Инлайновое видео в iOS
00:08:09 ChakraCore на Mac и Linux
00:25:12 Модальные окна
00:32:43 Сложные таблицы
00:37:13 Формы и доступность
00:44:04 Чехарда с цветовыми функциями

События

• MoscowJS №32
• Черновик расписания WSD
• Первый WSD в Яндексе
• FrontTalks 17—18 сентября

Инлайновое видео в iOS

• New video Policies for iOS

ChakraCore на Mac и Linux

• Bringing ChakraCore to Linux and OS X
• Why ChakraCore matters
• nodejs/vm
• mozilla/spidernode

Модальные окна

• Оформление модальных окон

Сложные таблицы

• Lessons from building mobile-friendly, accessible data tables

Формы и доступность

• Using the fieldset and legend elements
• Totally Tooling Tips
• Accessible UI Components For The Web

Чехарда с цветовыми функциями

• Switch all the color functions to be space-separated
• CSS Function Syntaxes (color and otherwise)
• Incomplete List of Mistakes in the Design of CSS

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:02:02 Chromium 52 и Opera 39
00:06:35 Firefox 48
00:09:25 EdgeHTML 14
00:21:44 Safari TP 10
00:22:55 Будущее сервис-воркеров
00:27:44 Чистый SVG
00:37:31 Безопасный SVG
00:40:24 CSS-демки
00:44:49 Заливка текста
00:48:37 Адаптивная вёрстка

События

• FrontTalks 17—18 сентября
• Расписание WSD
• Встречи PiterCSS

Chromium 52 и Opera 39

• What’s new in Chromium 52 and Opera 39
• CSS-изоляция

Firefox 48

• Марат Таналин про Firefox 48
• WebExtensions API

EdgeHTML 14

• Introducing EdgeHTML 14 with the Windows 10 Anniversary Update
• 100% API доступности HTML5 в Edge
• Edge обошёл Firefox на HTML5 Test

Safari TP 10

• Safari Technology Preview Release 10

Будущее сервис-воркеров

• Service worker meeting notes
• The state of Web Components

Чистый SVG

• High Performance SVGs

Безопасный SVG

• SVG uploads in WordPress (the Inconvenient Truth)
• Safe SVG

CSS-демки

• Индикатор прокрутки на CSS и как сделано

Заливка текста

• Firefox: background-clip: text
• CSS Fill and Stroke
• Позвольте представить: SVG
• Оживляем текст
• Статьи Юли Бухваловой

Адаптивная вёрстка

• Яндекс: делать ли мобильную версию?
• Комментарий разработчика
• CSS Device Adaptation: @viewport
• @viewport на Can I use

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Роман Комаров

Темы

00:00:00 Интро
00:00:21 События
00:02:09 Похороны Flash
00:15:08 Samsung Internet
00:26:09 Хорошая книга по CSS
00:30:12 Цветовые функции в рантайме
00:41:07 SVG
00:49:33 Курсор для кнопки

События

• WSD в Питере 1 октября
• WSD в Минске 29 октября
• Frontend Union в Вильнюсе 27 августа
• Летняя школа по Node.js в Киеве весь август

Похороны Flash

• Flash and Chrome
• Thoughts on Flash
• Clippy
• Introducing sIFR: The Healthy Alternative to Browser Text
• Appear.in, видеочат в браузере

Samsung Internet

• Introducing Samsung Internet for developers

Хорошая книга по CSS

• Книга «Секреты CSS. Идеальные решения ежедневных задач»

Цветовые функции в рантайме

• Building Themes with CSS4 Color Features

SVG

• SVG-градиенты
• SVG 2 new features
• Глава из «Practical SVG» Криса Койера
• Генератор спрайтов с фолбэком на PNG

Курсор для кнопки

• Some pointers on default cursors
• Buttons shouldn’t have a hand cursor
• Правильный курсор на активных элементах
• CSS3 UI: Cursor
• Pointer Sisters: Changing The Browser’s Cursor with CSS

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:29 События
00:02:24 Зачем чинить старьё
00:07:41 Мысли про React
00:21:07 SMIL снова можно?
00:28:23 Скрывать по-новому
00:34:56 Народ.ру на Гитхабе
00:41:37 Сайт на 10 КБ
00:46:03 Интернет в отпуске

События

• FrontendFellows №8 в Ижевске 26 августа
• Frontend Union в Вильнюсе 27 августа
• WSD в Питере 1 октября в ИТМО
• WSD в Минске 29 октября в Space
• HolyJS в Москве 11 декабря

Зачем чинить старьё

• Починили marquee в Safari TP11
• На сайте РЖД есть marquee
• Take blink Back!

Мысли про React

• What is React
• Talked to the lawyers about patents clause…
• Сказка о потерянном времени

SMIL снова можно?

• Intent to deprecate: SMIL
• Гипножаба на SMIL

Скрывать по-новому

• The proposed box-suppress property

Народ.ру на Гитхабе

• Simpler GitHub Pages publishing
• Википедия про Яндекс.Народ

Сайт на 10 КБ

• A List Apart
• Конкурс 10K Apart
• CSS1K и JS1K
• Твиттер @140bytes
• Offline Text Editor in less than 140 bytes

Интернет в отпуске

• Ой, не фоткай меня…

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:24 События
00:07:55 WebKit 15 лет
00:13:12 WebP в Firefox
00:22:59 Безопасность сайтов
00:27:34 Прогрессивные веб-приложения
00:34:16 PostCSS в WebStorm
00:42:19 Образование для профи
00:50:03 Генераторы статики

События

• Frontend Union Conf 27 августа в Вильнюсе
• «Elements», слайды Мартина Клеппе
• JS Hacks & Creativity
• KharkivJS в начале ноября
• FrontTalks 17—18 сентября в Екатеринбурге
• Лог с JSConf Iceland, день первый и второй

WebKit 15 лет

• The first commit to WebKit was 15 years ago today
• Celebrating 15 Years of WebKit

WebP в Firefox

• Mozilla plans to add WebP support to Firefox
• Daala
• Проголосовать за WebP в Edge

Безопасность сайтов

• Observatory, сервис Mozilla для проверки безопасности
• SSL Config Generator

Прогрессивные веб-приложения

• PWA Rocks
• How we made the RioRun progressive web app
• From Chrome Apps to the Web
• Add to Homescreen on Desktop

PostCSS в WebStorm

• WebStorm 2016.3 Early Access Preview: Flow, PostCSS, and more
• PostCSS на Википедии
• Renting software sucks

Образование для профи

• Front End Center
• Перевод книги «Секреты CSS»

Генераторы статики

• Jekyll Admin
• Dev.Opera на Гитхабе
• Сайт «Веб-стандартов»
• Metalsmith
• WSD на Гитхабе

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Анна Селезнёва

Темы

00:00:00 Интро
00:00:14 События
00:01:31 Аня, представься
00:08:37 Safari 10, скоро
00:12:21 Chrome 53, уже
00:22:27 Кастомные элементы
00:32:34 Компоненты по старинке
00:36:27 Слайсинг в border-image
00:40:25 Очень ждём font-display
00:44:12 Лия Веру и HTML
00:50:28 Вомбаты в носках и npm

События

• KharkivCSS 17 сентября
• FrontTalks 17—18 сентября
• WSD в Питере 1 октября
• WSD в Минске 29 октября

Аня Селезнёва

• Твиттер @asktwi
• Личный сайт askd.rocks
• Адаптивный веб-дизайн — Что? Где? Когда?
• Rolling Scopes
• Web Not Bombs
• 4front
• Злые марсиане

Safari 10

• WebDriver support in Safari 10
• Safari TP12

Chrome 53

• Chrome 53
• Web Bluetooth API
• Payment Request API
• Shadow DOM v1

Кастомные элементы

• The Case for Custom Elements, 1
• The Case for Custom Elements, 2
• Demystifying Web Components

Компоненты по старинке

• Developing Extensible HTML and CSS Components

Слайсинг в border-image

• Supercharged
• Slicing SVG 9 Ways
• Can I Use

Очень ждём font-display

• Font-display for the Masses
• Font Face Observer

Лия Веру и HTML

• HTML Secrets
• CSS Secrets
• Markapp
• Пишите меньше кода, блин
• Building in 10k

Вомбаты в носках и npm

• 11 Simple npm Tricks
• Np, a better npm publish
• Npm-check-updates

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Олег Мохов, Павел Ловцевич

Темы

00:00:00 Интро
00:00:24 Гости
00:01:15 События
00:04:46 Несмелый Safari
00:11:22 Доступность
00:20:10 Меняем порядок
00:28:08 Фронтенд в Mail.Ru
00:35:26 Зачем вообще PWA
00:47:26 HTTPS без вариантов
00:58:13 Кастомные свойства
01:01:54 Строчный код
01:06:49 Платные конференции

Гости

• Павел Ловцевич @zigzag_mcquack
• LOVATA
• Олег Мохов @olmokhov
• FrontTalks

События

• FrontTalks 17—18 сентября
• WSD в Питере 1 октября
• WSD в Минске 29 октября
• PiterJS в Питере 22 сентября

Несмелый Safari

• Safari 10.0
• CSP 2.0

Доступность

• Недоступный веб: как мы развели такой бардак
• What is the Business Case for Accessibility?
• Section 508
• Расшифровки подкаста

Меняем порядок

• Способы смены порядка элементов с помощью CSS
• PWA.rocks

Фронтенд в Mail.Ru

• Инструменты для разработки и поддержки фронтенда
• Gemini

Зачем вообще PWA

• The Building Blocks Of Progressive Web Apps
• 4 вида утечек памяти в JavaScript и как с ними бороться
• Отладка пререндера: chrome://net-internals/#prerender

HTTPS без вариантов

• Moving Towards a More Secure Web
• Let’s Encrypt

Кастомные свойства

• Autoprefixing, with CSS variables!
• CSS Custom Properties in development in Edge

Строчный код

• Оформление строчных блоков кода

Платные конференции

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Роман Дворнов

Темы

00:00:00 Интро
00:00:13 События
00:01:10 Новинки Гитхаба
00:06:38 Браузеры
00:11:19 HTML и SVG
00:19:19 Новые API
00:23:01 Вёрстка писем
00:26:13 Вариативные шрифты
00:30:23 Веб-шрифты в 2016
00:32:33 JS для дизайнеров
00:35:45 Sass 3.5
00:39:09 Сомнения в PostCSS и @viewport
00:51:57 Рома и парсер CSSTree

События

• FrontTalks
• MoscowJS 24 сентября
• PiterCSS 11 октября

Новинки Гитхаба

• GitHub: A whole new Universe

Браузеры

• Chrome 54 Beta
• BroadcastChannel
• WebUSB
• Safari Technology Preview Release 13

HTML и SVG

• Новые статусы HTML5.1 и SVG2
• SVG Authoring Guide

Новые API

• Новые API: акселерометр, гироскоп, магнитометр

Вёрстка писем

• Gmail to Support Responsive Design, Improved Font Styling

Вариативные шрифты

• Variable fonts, a new kind of font for flexible design
• Introducing OpenType Variable Fonts

Веб-шрифты в 2016

• Шрифты в вебе, обзор от 2016 года
• Font Family Reunion

JS для дизайнеров

• Javascript for Web Designers

Sass 3.5

• Sass 3.5 Release Candidate

Сомнения в PostCSS и @viewport

• Preprocess future-proof CSS features
• @viewport removed from Edge
• @viewport is preloader-hostile

Рома и парсер CSSTree

• Basis.js. Почему я не бросил разрабатывать свой фреймворк
• CSSO
• Gonzales
• Rework
• CSSTree
• CSSTree Validator
• CSSOM

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:18 События
00:06:01 Firefox 49
00:08:09 Chromium 53
00:14:17 Pointer Events
00:23:09 Гриды
00:28:48 SVG
00:31:07 Google про PWA
00:31:58 Что мешает Bootstrap
00:33:39 Оптимизация скобками
00:37:42 Как доступно прятать
00:41:17 Советы начинающим

События

• MoscowJS Conf
• SPB Frontend 26 сентября
• WSD в Питере 1 октября
• Fronteers 6—7 октября
• PiterCSS 11 октября
• Progressive Web Apps Day 11 октября
• Chrome Dev Summit 10—11 ноября

Firefox 49

• Firefox 49

Chromium 53

• What’s new in Chromium 53 and Opera 40
• Свойства scale, rotate и translate

Pointer Events

• Intent to Ship: Pointer Events
• Роман Дворнов про Touch Events и Pointer Events
• Touch Events, W3C Recommendation
• Touch Events Level 2, Draft
• Pointer Events, W3C Recommendation
• PEP.js

Гриды

• CSS Grid meets the real world: a login form
• The CSSWG voted to send Grids Layout to CR
• Proposal for a new Region Spec, Jen Simmons
• Percentages and intrinsic size, Manuel Rego

SVG

• URL-encoder для SVG
• Инлайновые стили в background-image

Google про PWA

• Air Berlin: реализация Progressive Web App
• Секреты Progressive Web Apps: часть 1

Что мешает Bootstrap

• Wall of browser bugs

Оптимизация скобками

• optimize-js

Как доступно прятать

• A11y.js: Hiding DOM elements

Советы начинающим

• Вёрстка интерактивного баннера
• Как быть начинающим и не сойти с ума

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Алексей Симоненко

Темы

00:00:00 Интро
00:00:25 События
00:08:51 Safari TP 14
00:10:45 Async и await в Chrome
00:13:03 Куда двигается HTML
00:16:24 Сложности с JS-модулями
00:22:00 Недооценённый CSS
00:27:21 Больший потенциал SVG
00:30:41 Псевдоэлементы
00:35:26 Доступность
00:39:06 Длинные классы в БЭМе
00:41:04 Отладчик в 108 байтах
00:42:44 Загрузка полифилов
00:47:34 История React

События

• WSD в Питере 1 октября
• WSD в Минске 29 октября
• pitercss meetup №6 11 октября
• pitercss conf в июне 2017

Safari TP 14

• Release Notes for Safari Technology Preview Release 14

Async и await в Chrome

• Async/await landed in Chrome

Куда двигается HTML

• Welcome to HTML 5.2

Сложности с JS-модулями

• Node.js, TC-39, and Modules

Недооценённый CSS

• 9 недооценённых возможностей CSS

Больший потенциал SVG

• SVG has more potential

Псевдоэлементы

• Псевдоэлементы, которых не может быть

Доступность

• Hiding inline SVG icons from screen readers
• Всегда используйте label

Длинные классы в БЭМе

• Минимизация классов в HTML

Отладчик в 108 байтах

• 108 byte CSS layout debugger
• Web Developer

Загрузка полифилов

• Loading Polyfills Only When Needed

История React

• Our First 50,000 Stars

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:19 События
00:03:53 Не обижайте CSS
00:13:35 Флекс-хак
00:17:35 Фреймворк на флексах
00:24:33 JS в 2016
00:36:09 Состояние JS
00:38:56 PWA и React
00:45:42 Без джаваскрипта жизнь не та?
00:54:38 Не блокируйте вьюпорт

События

• Pitercss №6 11 октября
• Progressive Web Apps Day 11 октября
• WSD в Минске 29 октября
• KharkivJS 5—6 ноября
• Конференция pitercss в июне 2017

Не обижайте CSS

• Может, хватит уже поливать CSS грязью?
• CSS is Awesome в спецификации

Флекс-хак

• Flex-grow 9999 Hack

Фреймворк на флексах

• Fukol™ Grids

JS в 2016

• Как оно учить JavaScript в 2016
• It’s the future
• Totally get your frustration
• Пример из Python, алгоритмы не нужны
• How it actually feels to write JavaScript in 2016

Состояние JS

• State of JavaScript 2016

PWA и React

• PWA with React:  Introduction
• PWA with React:  Page Load Performance
• PWA with React:  Offline support

Без джаваскрипта жизнь не та?

• Fronteers
• It’s ok to build a website that doesn’t work without JS
• I’m exasperated by this push to require JS / get rid of CSS
• Offline, progressive, and multithreaded, Нолан Лоусон
• Roving tabindex. A11ycasts 06

Не блокируйте вьюпорт

• HTML 5.2: The meta element
• Всегда отключаю масштабирование!
• PWA Rocks
• Washington Post
• Financial Times

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:02:57 Yarn для npm
00:20:02 Safari TP 15
00:24:28 Web Bluetooth
00:25:57 Хорошие таблицы
00:35:07 Alt для картинок
00:43:06 Женщины CSS
00:46:57 Функция map в CSS
00:53:45 Стили без CSS
00:57:14 JS (не) нужен?
01:04:51 Прогрессивное улучшение

События

• NodeSchool SPB 22 октября
• React Moscow 26 октября
• WSD в Минске 29 октября
• KharkivJS 5—6 ноября
• HolyJS в Москве 11 декабря

Yarn для npm

• Yarn: A new package manager for JavaScript
• PackRat
• Hello, Yarn!
• Why I’m Working on Yarn
• Почему yarn.lock не нужен в зависимостях

Safari TP 15

• Release Notes for Safari Technology Preview 15

Web Bluetooth

• Chrome Intent to Ship: Web Bluetooth

Хорошие таблицы

• How to make your tables less terrible (GIF)
• Создавайте хорошие таблицы

Alt для картинок

• Альтернативный текст для изображений

Женщины CSS

• The Amazing Women of CSS

Функция map в CSS

• Native map() function in CSS

Стили без CSS

• Styled Components

JS (не) нужен?

• You Might Not Need jQuery
• You Might Not Need JavaScript
• You Might Need JavaScript

Прогрессивное улучшение

• Progressive enhancement isn’t dead, but it smells funny

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:02:02 Chrome 54
00:05:29 Async
00:10:40 Node.js v6 LTS
00:19:40 Npm v4.0.0
00:20:55 Ире про PWA
00:27:24 Условия в CSS
00:35:11 CSS-фреймворк не нужен
00:41:58 Адаптивный Яндекс
00:43:19 Полифил для гридов
00:45:35 Normalize.css?
00:52:20 Женщины в ИТ

События

• WSD в Киеве 26 ноября
• Принимаем заявки на pitercss в ноябре и декабре: hi@pitercss.com
• CodeFest 1—2 апреля

Chrome 54

• Chrome 54, Пит Лепаж
• Cross-origin Service Workers: Experimenting with Foreign Fetch

Async

• Async functions: making promises friendly
• Tips for using async functions (ES2017)

Node.js v6 LTS

• Node.js v6 Transitions to LTS
• v7.0.0 Proposal
• Firefox ESR
• Homebrew

Npm v4.0.0

• npm v4.0.0

Ире про PWA

• Offline First with Service Worker
• Instant Loading with IndexedDB
• Instant Loading Web Apps with an Application Shell Architecture
• Intent to Ship: Durable (Persistent) Storage

Условия в CSS

• Условия для CSS-переменных

CSS-фреймворк не нужен

• Статья: You might not need a CSS framework
• Видео: You might not need a CSS framework
• Это тебе не нужен, а нам нужен…

Адаптивный Яндекс

• Адаптивная вёрстка, ШРИ 2016

Полифил для гридов

• CSS Grid Polyfill

Normalize.css?

• Normalize (CSS) No More
• Continue Normalising Your CSS
• О normalize.css

Женщины в ИТ

• Женщины в ИТ

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:25 События
00:06:40 Chromium 54
00:09:35 Safari TP 16 и Apple Pay
00:16:58 Mozilla, Servo, разработка движков
00:36:33 Таблицы по стандартам
00:38:47 Node.js 7
00:41:03 Стандарты и полифилы
00:46:24 Забытый border-image
00:52:05 Базовый SVG
00:52:52 Возвращение Дейва Шей

События

• Видео с WSD в Минске
• Слайды с WSD в Минске
• PiterJS 3 ноября
• KharkivJS 5—6 ноября
• Chrome Dev Summit 10—11 ноября
• Fronthub в Ульяновске 12 ноября
• PenzaJS 17 ноября
• Pitercss №7 16 ноября
• MinskCSS 15 декабря
• WSD в Киеве 26 ноября
• Канал events в Слаке

Chromium 54

• What’s new in Chromium 54 and Opera 41

Safari TP 16 и Apple Pay

• Release Notes for Safari Technology Preview 16
• EmporiumWeb, пример Apple Pay
• Apple на Гитхабе

Mozilla, Servo, разработка движков

• A Quantum Leap for the Web
• Mozilla’s Quantum Project

Таблицы по стандартам

• CSS Table Module Level 3

Node.js 7

• Node.js v7.0

Стандарты и полифилы

• Add document.{interactive,contentLoaded,loaded} promises
• Please rename ASAP

Забытый border-image

• Ещё раз про border-image
• Can I Use: border-image
• Slicing SVG 9 Ways

Базовый SVG

• Как проектировать, создавать и анимировать SVG

Возвращение Дейва Шей

• Photo Toning with Gradients & Blend Modes
• CSS Zen Garden
• The source of csszengarden.com

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:17 События
00:03:08 HTML 5.1
00:05:40 Async в Firefox
00:07:38 Вариативные шрифты
00:13:19 Календарик
00:20:44 Опасные API
00:24:45 WebAssembly
00:26:43 Шаблонные литералы
00:31:40 Загрузка JS
00:38:51 position: sticky
00:41:32 Круговой прогресс-бар
00:44:40 Опрос Stack Overflow
00:50:34 Тесты и игрушки

События

• Видео с FrontTalks
• Pitercss №7 16 ноября
• NodeSchool SPB 19 ноября
• WSD в Киеве 26 ноября
• MinskCSS 15 декабря
• React Amsterdam 21 апреля

HTML 5.1

• XHTML Fist
• HTML 5.1 W3C Recommendation
• HTML 5.1 Changes

Async в Firefox

• Async/await support in Firefox

Вариативные шрифты

• WebKIt: Variable Fonts on the Web

Календарик

• Firefox: Data/Time picker
• HTML 5.1: input type="date"

Опасные API

• Browsers remove functionality due to privacy
• What is Do Not Track?

WebAssembly

• The WebAssembly Browser Preview has launched!

Шаблонные литералы

• ES6 Template Literals, the Handlebars killer?

Загрузка JS

• RFC: Webpack Performance Budgets
• Alex Russell: How broken JS-first web development is

position: sticky

• Chrome: Intent to Ship CSS position: sticky

Круговой прогресс-бар

• Making a Doughnut Progress Bar

Опрос Stack Overflow

• Stack Overflow: Survey Results 2016

Тесты и игрушки

• JavaScript Guessing Game
• HTML parser quiz
• HTML Minifier
• Enki

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Андрей Оконечников

Темы

00:00:00 Интро
00:02:38 События
00:06:56 Safari TP 17
00:16:41 Доступность
00:26:31 Fetch не торт
00:34:35 Результаты 10K Apart
00:36:45 Вредные советы
00:40:37 Людоедский фронтенд и JS-in-JS

События

• Профессия фронтенд-архитектор, РИТ 2007
• Chrome Dev Summit
• WSD в Киеве 26 ноября
• Видео с WSD в Минске
• MinskCSS 15 декабря
• HolyJS в Москве 11 декабря

Safari TP 17

• Release Notes for Safari Technology Preview 17
• What’s new in IndexedDB 2.0?
• Safari 10 supports WOFF2 but I only see WOFF loading
• WOFF2 на Can I Use
• ColorSnapper

Доступность

• Доступность сайтов для самых маленьких
• Госсайт, доступный для людей с ограниченными возможностями
• WAVE Evaluation Tool

Fetch не торт

• Why I won’t be using Fetch API in my apps

Результаты 10K Apart

• Announcing the winners of the 2016 10k Apart contest

Вредные советы

• Как отравить мобильного пользователя

Людоедский фронтенд и JS-in-JS

• CSS Modules
• Styled Components
• Andrew Clark: What’s Next for React
• JS Worker Search

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:15 События
00:02:14 Opera DevRel всё
00:06:04 Safari TP 18
00:09:29 Firefox 50
00:13:26 CSS-шлюзы
00:19:45 Расширение инлайновых стилей
00:25:06 Печать
00:35:43 Гриды весной
00:45:48 Новый dl
00:48:19 Atom без Shadow DOM
00:57:15 42
00:57:41 Медиум

События

• Pitercss №7 прошёл
• hi@pitercss.com для докладов и предложений
• MoscowJS №34 24 ноября
• Я.Субботник по фронтенду в Москве 10 декабря
• HolyJS в Москве 11 декабря
• MinskCSS 15 декабря

Opera DevRel всё

• Bruce Lawson: Leaving Opera
• Opera сократила 85 человек из-за падения выручки от b2b-бизнеса
• Резюме Вадима

Safari TP 18

• Release Notes for Safari Technology Preview 18

Firefox 50

• Firefox 50, обзор Марата Таналина

CSS-шлюзы

• Математика CSS-шлюзов на Хабре
• Математика CSS-шлюзов на CSS Live
• Shower
• Словарь терминов по фронтенду

Расширение инлайновых стилей

• Expand inline style attributes to allow pseudo-class/element styling

Печать

• I totally forgot about print style sheets
• Распечатай Яндекс.Карты, Вадим Макишвили
• Tracking When Users Print Pages

Гриды весной

• Intent to ship in Chrome 57
• Intent to ship in Firefox 52
• Grid Kiss
• Opera Mini server upgrade

Новый dl

• DIV официально разрешён внутри DL

Atom без Shadow DOM

• Removing Shadow DOM boundaries from text editor elements
• Avoiding Style Pollution With The Shadow DOM (2014)

42

• Веб-стандарты 42
• RadioJS 42
• 42

Медиум

• Веб-стандарты на Медиуме

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:14 События
00:04:07 Новости Firefox
00:14:04 Веб-компоненты в WebKit
00:16:34 Мультиколонки
00:20:32 Системы раскладки
00:31:12 SVG-паттерны
00:34:30 Нюансы доступности
00:38:45 Методологии CSS
00:50:11 Улучшение формы
00:51:42 Шоу «Стандарт»
00:53:42 Фолбэки к шрифтам
00:57:25 HTML на стероидах
01:03:17 Подкаст жив!

События

• WSD в Киеве прошёл 26 ноября
• Krasnodar Dev Days 10 декабря
• FrontDays №4 в Тольятти 17 декабря
• Я.Субботник в Москве 10 декабря
• HolyJS в Москве 11 декабря
• hi@pitercss.com для докладов на pitercss
• Приём докладов на CodeFest

Новости Firefox

• Mozilla: Intent to implement Payment Request API
• Firefox: New Responsive Design Mode

Веб-компоненты в WebKit

• WebKit: Introducing Custom Elements

Мультиколонки

• Lea Verou: inline-block prevents fragmentation in multi-column containers

Системы раскладки

• Грид, флексбокс и выравнивание блоков
• Should I try to use the IE implementation of CSS Grid Layout?

SVG-паттерны

• SVG-паттерны

Нюансы доступности

• The Accessibility Difference Between aria-hidden and role="presentation"
• Changing the Reading Order of a Page with aria-flowto

Методологии CSS

• Holy Grail Layout
• When to use which CSS methodology

Улучшение формы

• Улучшение формы комментариев

Шоу «Стандарт»

• The Standard E02: Fit to Page

Фолбэки к шрифтам

• Font style matcher

HTML на стероидах

• AMP, Instant Articles, Instant View

Подкаст жив!

• Пятиминутка React
• Веб-стандарты в iTunes

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:02:57 Chrome 55
00:11:10 Отладка гридов в Firefox
00:12:55 Парсер URL в WebKit
00:16:20 PWA как APK
00:18:21 Справочник по CSS
00:23:40 @​supports
00:33:04 CSS-in-JS и бэктики
00:42:21 Шрифты в Медузе
00:52:57 Инструменты 2016

События

• RealtimeBoard TechDays в Перми 4 декабря
• Митап по БЭМу для новичков в Яндексе 9 декабря
• Я.Субботник по фронтенду в Москве 10 декабря
• HolyJS в Москве 11 декабря
• Pitercss №8 в офисе DataArt 21 декабря
• NodeSchool SPB в офисе Selectel 24 декабря

Chrome 55

• Chrome 55: Async and Await, Pointer Events, Persistent Storage
• Now shipping Node v7, with preliminary support for async/await!
• V8 Release 5.6
• www-style: scroll anchoring

Отладка гридов в Firefox

• CSS Grid and Grid Highlighter Now in Firefox Developer Edition

Парсер URL в WebKit

• URL Parsing in WebKit

PWA как APK

• Paul Kinlan: What Comes Next for the Web?
• Installing web apps on phones (for real)

Справочник по CSS

• CSS Reference

@​supports

• @​supports изменит вашу жизнь
• Поддержка на Can I Use…
• Fallback for browsers not supporting CSS Grid Layout

CSS-in-JS и бэктики

• The magic behind styled-components

Шрифты в Медузе

• Как использовать кастомные шрифты в вебе и не сойти с ума
• Статьи Зака Лезермана
• Паттерны загрузки веб-шрифтов
• Homebrew web font tools

Инструменты 2016

• The State of Front-End Tooling 2016

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Сергей Бережной

Темы

00:00:00 Интро
00:00:19 События
00:04:30 Новинки Edge
00:11:27 Safari TP 19
00:26:49 Где учиться
00:35:58 Сообщения коммитов
00:42:59 Анимация и рендеринг
00:49:54 CSS в CSS
01:02:52 Хайп
01:12:24 Прогрессивное улучшение

События

• Я.Субботник по фронтенду
• HolyJS в Москве 11 декабря
• Билеты на JSConf
• Билеты на CSSConf

Новинки Edge

• Edge on Windows 10 build 14986

Safari TP19

• Release Notes for Safari TP 19
• Не гзипом единым, Георгий Мостоловица

Где учиться

• Куда пойти учиться программисту

Сообщения коммитов

• Как писать сообщения коммитов

Анимация и рендеринг

• Анимации на GPU: делаем это правильно

CSS в CSS

• Virtual CSS with Styletron
• Styled JSX
• A new world: writing CSS in ClojureScript and life after Sass

Хайп

• Hype Driven Development

Прогрессивное улучшение

• The Case Against PE’s Flimsy Moral Foundation
• Insert Clickbait Headline About PE Here
• Yes, PE is a fucking moral argument
• The True Cost of Progressive Enhancement
• What the Heck Is Inclusive Design?

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев

Темы

00:00:00 Интро
00:00:18 События
00:04:35 Chromium и Opera
00:08:19 Возвращение position: sticky
00:11:49 Виртуальная реальность
00:16:40 Приоритизация JS
00:21:51 Быстрый параллакс
00:25:29 Инлайновый SVG лучший!
00:30:35 Краткая запись CSS
00:36:39 Контрольные точки
00:40:47 Гриды!
00:44:56 20 лет CSS

События

• Видео с MinskCSS №1
• WSD в Москве 28 января
• Встреча по фронтенду СКБ Контур в Екатеринбурге
• Работа фронтендера в крупной IT-компании
• Доступность для незрячих
• Приём докладов на KharkivCSS

Chromium и Opera

• What’s new in Chromium 55 and Opera 42

Возвращение position: sticky

• Sticky is back in Chrome

Виртуальная реальность

• Chrome: WebVR
• Очки виртуальной реальности «Кардборд»
• A-Frame

Приоритизация JS

• When everything’s important, nothing is!

Быстрый параллакс

• Performant Parallaxing

Инлайновый SVG лучший!

• Why Inline SVG is Best SVG
• SVG 2, W3C CR

Краткая запись CSS

• Краткая запись CSS как антипаттерн

Контрольные точки

• Правильный способ делать контрольные точки в CSS

Гриды!

• Грядут гриды!

20 лет CSS

• 20 Years of CSS

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:01:39 Safari TP20
00:06:07 Samsung Internet
00:10:14 Firebug и… Photoshop
00:22:00 Bootstrap и флексы
00:29:21 GitHub Pages
00:31:59 CSS 2017
00:39:06 Вставка шрифтов
00:45:35 Полифилы CSS
00:52:44 Специфичность CSS

События

• WSD в Москве 28 января
• Видео с pitercss №8
• SPB Frontend 26 декабря

Safari TP20

• Release Notes for Safari Technology Preview 20
• A tale of two viewports — part one
• A tale of two viewports — part two

Samsung Internet

• Announcing Samsung Internet 5.0

Firebug и… Photoshop

• Firebug lives on in Firefox DevTools

Bootstrap и флексы

• Flexbox all the time

GitHub Pages

• GitHub Pages: Usage limits

CSS 2017

• Рабочая группа CSS определяет состав CSS-2017

Вставка шрифтов

• No @font-face Syntax will ever be Bulletproof

Полифилы CSS

• The Dark Side of Polyfilling CSS
• Loading Polyfills Only When Needed

Специфичность CSS

• Controlling the Specificity

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:01:02 События года
00:12:24 Всегда кодить
00:17:52 Доклады года
00:25:30 Веб-стандарты
00:32:42 Браузеры года
00:35:56 Больше CSS
00:39:20 Прогрессор
00:41:35 Закрытие года
00:44:27 Тренды года
00:52:54 Новички и наставники
00:59:51 Ещё тренды
01:02:18 Флексбокс года
01:04:49 JavaScript года
01:13:08 Что будет в 2017

События года

• ScotlandCSS
• HolyJS
• Frontend Union Conf
• Pitercss_conf
• Prosmotr
• OdessaJS
• KharkivJS
• FrontTalks

Всегда кодить

• The best software developers I know…
• To the guy who wrote that “Always Hacking” tweet

Доклады года

• Как я перестал верить технологиям
• Как незрячие люди видят ваш сайт
• Производительность JS через подзорную трубу
• Я и ИоТ

Веб-стандарты

• WSD
• Фото с WSD

Браузеры года

• Safari TP
• Samsung Internet DevRel

Больше CSS

• KharkivCSS
• pitercss_meetup

Прогрессор

• Прогрессор

Закрытие года

• Восемь лет в Opera
• Leaving Opera
• What a coincidence!

Тренды года

• RioRun
• Paper Planes
• Let’s Encrypt
• Certbot

Новички и наставники

• Статьи Алёны Батицкой
• Путь наставника
• Фронтенд для новичка
• Как я попала в Яндекс
• Старикам здесь не место?

JavaScript года

• ES6 compatibility table

Что будет в 2017

• Можно вообще всё. Раскладка по гриду
• CSS Variables: var(--subtitle)
• Пользовательские свойства как основа архитектуры CSS

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:19 События
00:04:04 Адаптивный дизайн
00:15:56 Переход на CSS
00:33:23 Ванильный JS
00:37:25 Жестокий опенсорс
00:48:00 Доступные примеры
00:50:35 Аутлайн
00:58:20 Вёрстка логотипа

События

• WSD в Москве 28 января
• Rolling Scopes в Минске 18—19 февраля
• pitercss_meetup в январе
• pitercss_conf 16 июня
• CSS Day в Амстердаме 15—16 июня
• Фронтирник №3

Адаптивный дизайн

• The Current State of Adaptive Design
• Affinity Designer 1.5: Constraints

Переход на CSS

• From Sass to PostCSS
• CSS Working Group Editor Drafts
• Step-by-step Publishing a CSS Spec

Ванильный JS

• How I converted my React app to VanillaJS

Жестокий опенсорс

• Dear JavaScript
• Дорогой JavaScript

Доступные примеры

• Accessibility OpenAjax Examples

Аутлайн

• Что касается аутлайна
• Кодельная
• Ишья на Гитхабе
• A { outline: none } Don’t Do It!
• Reset Revisited

Вёрстка логотипа

• Логотип не отвечает или временно недоступен

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Слава Шебанов

Темы

00:00:00 Интро
00:00:24 События
00:10:06 JS-модули и global
00:18:08 Бета PhantomJS
00:20:20 Веб-манифест
00:21:52 ВК и PWA
00:32:58 ВК и доступность
00:42:27 Методологии CSS
00:47:26 Кастомные свойства
00:50:52 SVG-иконки
00:52:51 ВК и кастомные шрифты
01:01:30 Динамический импорт JS-модулей

События

• pitercss_meetup №9 в Yota 24 января
• WSD в Москве 28 января
• SPB Frontend
• Papers We Love. SPB

JS-модули и global

• Release Notes for Safari Technology Preview 21
• Mozilla: Intent to Implement ES6 modules
• JavaScript Loader Standard
• Remove global from FF Nightly

Бета PhantomJS

• PhantomJS 2.5.0 Beta

Веб-манифест

• Манифест? А? Что? Зачем?

ВК и PWA

ВК и доступность

• Добьёмся доступности ВК для незрячих

Методологии CSS

• What’s in a name? A CSS naming convention overview
• Ничего ты не знаешь, Джон Сноу. Фронтенд ВК

Кастомные свойства

• Random Numbers in CSS
• Reactive Animations with CSS Variables

SVG-иконки

• The Road to SVG and Custom Elements in Clarity Icons

ВК и кастомные шрифты

• FOUT, FOIT, FOFT

Динамический импорт JS-модулей

• ES proposal: import()

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:13 События
00:01:37 Лого Mozilla
00:05:56 Ввод дат
00:24:10 Чек-лист
00:28:31 Webpack 2
00:33:26 React на веб-компонентах
00:34:57 Суровый Unix
00:47:19 Доступность

События

• WSD в Москве 28 января
• KharkivCSS 22 апреля
• Rolling Scopes в Минске 18—19 февраля

Лого Mozilla

• Moz://a Arrival
• moz:// URI scheme

Ввод дат

• Date/Time Input Types
• Making input type=date complicated

Чек-лист

• Что поправить в вёрстке перед выпуском в продакшен?

Webpack 2

• Webpack 2.2: The Final Release
• Rollup.js

React на веб-компонентах

• Web Components, the React way

Суровый Unix

• Ack for CSS Developers
• Вместо ack уже ripgrep
• Ripgrep
• Tower
• WebVim
• Всё, что вы делаете в Vim неправильно
• Panic Themes
• Icon Slate
• ImageMagick

Доступность

• How I do an accessibility audit
• Accessibility Devtools Extension
• axe-core
• Using the aria-current attribute

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Александра Воробьёва

Темы

00:00:00 Интро
00:00:15 События
00:01:23 Safari 10.1
00:06:18 Chrome 56
00:09:46 Firefox 51
00:14:47 HTTPS и формы
00:21:23 Тестирование в Сбертехе
00:30:57 Новый клиарфикс
00:34:54 Импорты в CSS
00:43:34 Сервис-воркеры
00:46:19 История JS
00:56:05 Команда Сбертеха

События

• WSD в Москве 28 января
• Видео с WSD в Москве
• NodeSchool в Питере 28 января
• SPB Frontend 31 января
• CodeFest в Новосибирске 1—2 апреля

Safari 10.1

• Safari 10.1 Release Notes
• Release Notes for Safari TP 22

Chrome 56

• What’s new in Chrome 56

Firefox 51

• Firefox 51

HTTPS и формы

• Communicating the Dangers of Non-Secure HTTP

Тестирование в Сбертехе

Новый клиарфикс

• The end of the clearfix hack?
• Новый display: flow-root — не clearfix, но что это и зачем?

Импорты в CSS

• Is CSS @import still considered as an anti-pattern?

Сервис-воркеры

• Mariko Kosaka: Knitting for JavaScripters
• Ты кто такой, сервис-воркер?

История JS

• JavaScript Standard

Команда Сбертеха

• Как работают ИТ-специалисты. Андрей Янковский, JS-тимлид CSSSR
• Сбербанк-Технологии

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:12 События
00:02:07 Новинки Chrome
00:08:32 Установка веб-приложений
00:23:50 Баги в браузерах
00:30:44 Очевидный CSS
00:37:33 Банальный флексбокс
00:43:43 Ад колбэков
00:47:21 Нативные ES-модули
00:54:14 Сохранить в офлайне
00:55:31 Локальный HTTP2

События

• Видео с WSD в Москве
• PiterJS №12 в ИТМО 9 февраля
• Rolling Scopes в Минске 18—19 февраля
• pitercss_meetup №10 21 февраля
• moscowcss_meetup №1 2 марта
• DUMP-2017 14 апреля

Новинки Chrome

• Chrome 57 Beta

Установка веб-приложений

• The New and Improved Add to Home screen
• Google is finally making web apps first-class citizens on Android

Баги в браузерах

• Reporting Browser Bugs
• Lack of @counter-style support
• Баги в браузерах: кто виноват и что делать?

Очевидный CSS

• Using CSS variables in SVG icons
• Сила цветовой CSS-функции rgba

Банальный флексбокс

• A Complete Guide to Flexbox
• Flexbox Cheatsheet
• Битва за базовую линию
• How Flexbox works — explained with gifs

Ад колбэков

• Ад обратных вызовов

Нативные ES-модули

• Native ES-modules: new features, differences from Webpack

Сохранить в офлайне

• Implementing “Save For Offline” with Service Workers

Локальный HTTP2

• Simplehttp2server

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Милена

Темы

00:00:00 Интро
00:00:13 События
00:07:39 Графика в WebKit
00:13:51 Ссылки в Opera
00:17:33 Дизайнеры верстают
00:29:24 HTML API
00:36:48 Кастомные свойства
00:42:21 Фигуры в CSS
00:45:31 Обещанный бургер
00:50:05 Быстрый старт JS
01:01:21 Отчёты W3C TAG

События

• UralJS №2 в Екатеринбурге 13 февраля
• MoscowJS №35 17 февраля
• Weacom IT Day в Иркутске 17 февраля
• Mobile World Progress в Барселоне 1 марта
• moscowcss_meetup №1 в Москве 2 марта
• KharkivCSS №2 в Харькове 22 апреля
• Приём докладов на pitercss_conf 16 июня

Графика в WebKit

• Next-generation 3D Graphics on the Web

Ссылки в Opera

• What’s new in Chromium 56 and Opera 43

Дизайнеры верстают

• Веб-дизайнеры, начните верстать!
• Технолог — тоже дизайнер
• Как «прокачаться» дизайнеру: советы и полезные ссылки

HTML API

• HTML APIs: What They Are And How To Design A Good One
• MarkApp

Кастомные свойства

• CSS Custom Properties. The Basics
• More Readable CSS with CSS Custom Properties
• Bridging CSS and JS with Custom Properties

Фигуры в CSS

• Basic Shapes & Path

Обещанный бургер

• Обещание бургерной вечеринки
• Ты кто такой, сервис-воркер?

Быстрый старт JS

• JavaScript Start-up Performance
• optimize-js
• Preact

Отчёты W3C TAG

• Polyfills and the evolution of the Web
• Houdini: Demystifying the Future of CSS
• Add h element
• The evergreen web
• HTML Standard, WHATWG

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Сергей Господарец

Темы

00:00:00 Интро
00:01:42 События
00:09:10 Новинки Chrome
00:28:38 Плохой Base64
00:39:34 Отладчик WebKit
00:46:00 Нативные ES-модули
00:55:18 Модули в Node.js, Webpack и V8
01:01:46 Спокойный UI
01:04:59 Книга с рыбами
01:07:01 CSS-переменные

События

• Видео с KyivJS
• Pitercss №10 в Питере 21 февраля
• MinskJS в Минске 1 марта
• Moscowcss №1 в Москве 2 марта
• MinskCSS в Минске 30 марта
• React Amsterdam 21 апреля
• Сайт pitercss_conf
• Репозиторий pitercss.com на Гитхабе
• CodeFest в Новосибирске 1—2 апреля
• Rolling Scopes 2017
• Frontend Dev Conf в Минске 6—7 апреля

Новинки Chrome

• Trailing commas in function parameters
• Throttle expensive background timers
• Object Rest/Spread Properties
• Report long tasks which block the UI
• Reload, reloaded: faster and leaner page reloads
• Web Share API brings the native sharing capabilities

Плохой Base64

• What’s Up with Base64?
• Gathering Data

Отладчик WebKit

• JavaScript Debugging Improvements

Нативные ES-модули

• Native ECMAScript modules: dynamic import()
• Making transpiled ES modules more spec-compliant

Модули в Node.js, Webpack и V8

• An Update on ES6 Modules in Node.js
• High-performance ES2015 and beyond

Спокойный UI

• Reduced Motion Media Query

Книга с рыбами

• CSS: The Definitive Guide, 4th edition
• CSS. Каскадные таблицы стилей. Подробное руководство

CSS-переменные

• Houdini: CSS Properties and Values API
• You might not need a CSS preprocessor

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:12 События
00:05:04 Safari TP24
00:08:43 Как работают браузеры в 2017
00:18:56 Кастомные свойства
00:36:16 Make great again
00:45:28 Новый HTML-заголовок
00:59:36 Нервный опенсорс
01:14:00 W3C против WHATWG

События

• Видео с Rolling Scopes в Минске
• Pitercss №10 в Питере
• Moscowcss №1 в Москве 2 марта
• Frontend Fellows №11 в Ижевске 3 марта
• React Amsterdam 21 апреля
• Выигрышная ошибка

Safari TP24

• Release Notes for Safari Technology Preview 24

Как работают браузеры в 2017

• Optimising the front end for the browser
• Оптимизация фронтенда под браузеры
• How Browsers Work (2011)

Кастомные свойства

• Трюк: раздельные функции CSS-трансформации
• PostCSS Transform Shortcut
• CSS Custom Properties as your API

Make great again

• Make as a front-end development build tool

Новый HTML-заголовок

• Нужен ли нам новый заголовочный элемент?
• W3C/html: Add h element
• Вложенные h1

Нервный опенсорс

• Casper: No lang attribute

W3C против WHATWG

• What is the difference between the W3C and the WHATWG?
• HTML Living Standard
• HTML 5.1 W3C Recommendation
• Логотипы WHATWG

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:12 События
00:09:40 Жирненький Firefox 52
00:19:10 История Firefox OS
00:28:00 Руководства по гридам
00:30:42 Кастомные свойства
00:32:37 Прогрессивное улучшение CSS
00:36:05 Метрики шрифта
00:39:16 Инструменты PWA
00:45:20 Верните Гитхаб
00:53:20 Собеседование на бумажке

События

• Moscowcss №1 в Москве 2 марта
• KhJS №1 в Харькове 11 марта
• HolyJS в Петербурге 2—3 июня
• Видео с pitercss_meetup №10
• Видео с pitercss_meetup №9
• Видео с MinskJS
• Видео с Frontend Conf 2016 в Москве
• Как смотреть видео с фронтенд-конференций
• Video Speed Controller

Жирненький Firefox 52

• Firefox 52 for developers
• A cartoon intro to WebAssembly

История Firefox OS

• The Story of Firefox OS

Руководства по гридам

• Codrops CSS Reference: Grid
• Basic concepts of grid layout
• Learn Grid Layout Video Series

Кастомные свойства

• Основы пользовательских свойств CSS

Прогрессивное улучшение CSS

• CSS and progressive enhancement

Метрики шрифта

• Метрики шрифта, line-height и vertical-align

Инструменты PWA

• Progressive Web App Libraries in Production

Верните Гитхаб

• GitHub just rolled better contrast & a11y

Собеседование на бумажке

• Anti-whiteboard movement
• Trading whiteboards for code reviews

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:11 События
00:01:43 Chrome 57
00:06:19 Samsung Internet
00:23:34 Safari TP
00:27:14 Гриды пришли
00:34:24 Выражения от контейнера
00:41:54 Прокрутка в вебе
00:49:42 Оптимизация шрифтов

События

• SPB Frontend в Питере 15 марта
• JS Open Day в Питере, 15 марта
• PiterJS №13 в Питере 23 марта
• HTML-вёрстка для начинающих в Пензе 18 марта

Chrome 57

• Chrome 57: Grid based layouts, Media Session API
• MDN: text-decoration-skip

Samsung Internet

• Samsung Internet Beta now available without sign up
• Google Play: Samsung Internet Beta

Safari TP

• Release Notes for Safari Technology Preview 25
• The future of loading CSS

Гриды пришли

• A New Layout Module for the Web
• Грид + флексбокс: мощнейшее комбо в веб-раскладке
• Grid layout = no media queries and less CSS!

Выражения от контейнера

• On container queries

Прокрутка в вебе

• Scrolling on the web: A primer

Оптимизация шрифтов

• Оптимизация шрифтов
• Homebrew web font tools
• Faster Font Loading with Font Events

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:12 События
00:02:17 Фоновые вкладки
00:03:58 CSSO
00:07:40 CSS Peeper
00:11:30 Курс по SVG
00:15:39 Участие в стандартах
00:24:25 Доступность или жизнь
00:31:22 Линтинг HTML
00:34:03 Сайдбар за 5 строк
00:35:41 Загрузка JS
00:41:41 jQuery не нужен!
00:51:04 Пуш-уведомления
00:59:52 Междисциплинарное
01:13:09 Фронтёрки

События

• Node.js SPb №3 31 марта
• Moscowcss №2 6 апреля
• Pitercss №11 21 марта
• FrontDays в Тольятти 20 мая
• OdessaJS в Одессе 1—2 июля

Фоновые вкладки

• Chrome: Reducing power consumption for background tabs

CSSO

• CSSO 3.0.0
• Real Web CSS
• CSS Tree Validator

CSS Peeper

• CSS Peeper

Курс по SVG

• HTML Академия: Оформление SVG-фигур

Участие в стандартах

• Проблема выбора структуры документа

Доступность или жизнь

• Правила использования ARIA в HTML

Линтинг HTML

• Линтинг HTML с помощью CSS
• Создание Alix, Chrome-расширения для линтинга HTML

Сайдбар за 5 строк

• Как сделать сайдбар за 5 строк кода

Загрузка JS

• Асинхронный JavaScript против отложенного
• Off main thread JS loading

jQuery не нужен!

• Need to do Dependency-Free Ajax?

Пуш-уведомления

• Реализуем пуш-уведомления на фронтенде и бэкенде

Междисциплинарное

• Designer vs. Developer
• Настройка сервера и деплой приложения на Node.js

Фронтёрки

• Подкаст Фронтёрки №1

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:12 События
00:03:22 Бета Chrome 58
00:13:24 Safari TP
00:18:58 Кастомные свойства в Edge
00:23:10 Переключатель на кнопке
00:30:38 Гриды на практике
00:40:36 Быстрое меню
00:43:09 Редактор в браузере
00:56:31 Ереси БЭМа
00:59:37 Вёрстка для школоты

События

• Видео с pitercss №11
• 25 докладов с HolyJS 2016
• Moscowcss №2 в Москве 6 апреля
• SPA Meetup №3 в Москве 8 апреля
• Pitercss_conf в Питере 16 июня

Бета Chrome 58

• Chrome 58 Beta
• ControlsList API
• Intent to Implement: CSS conic-gradient()
• CSS conic-gradient() polyfill

Safari TP

• Release Notes for Safari Technology Preview 26
• WebKit Feature Status: Service Workers

Кастомные свойства в Edge

• CSS Custom Properties in Microsoft Edge

Переключатель на кнопке

• Inclusive Components: Toggle Buttons
• Пепелсбей.net: Модный переключатель

Гриды на практике

• Mozilla: CSS Grid
• CSS-гриды пришли насовсем
• CSS Subgrids
• Case Study: My First Practical CSS Grid Layout
• Practical CSS Grid: Adding Grid to an Existing Design

Быстрое меню

• Building performant expand & collapse animations

Редактор в браузере

• What is CodePen Projects?
• Your CPU is busy rendering a blinking cursor

Ереси БЭМа

• Writing modular CSS (Part 1)

Вёрстка для школоты

• Вёрстка — это не тупо

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Olga Alessandrini, Vadim Machiavelli, Alessio Simonetti

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:25 События
00:04:06 Safari TP
00:08:42 Гриды на огороде
00:17:44 Ремы и емы не нужны?
00:32:24 Новый Твиттер
00:38:37 Современный JS
00:48:06 Полезный код
00:54:11 AMP ломает новости

События

• Билеты на pitercss_conf
• Видео с moscowcss №2 6 апреля
• KharkivCSS №2 в Харькове 22 апреля
• Design Prosmotr в Москве 29—30 апреля
• Front Trends в Варшаве 24—26 мая
• Fronteers Conference 2017 в Амстердаме 5—6 октября

Safari TP

• Release Notes for Safari Technology Preview 27
• Not sure what’s more thrilling…

Гриды на огороде

• Edge Grid Update
• Grid Garden
• Flexbox Froggy

Ремы и емы не нужны?

• Rems and ems, and why you probably don’t need them

Новый Твиттер

• How we built Twitter Lite

Современный JS

• Современный JavaScript для древних веб-разработчиков

Полезный код

• Использование Code Coverage

AMP ломает новости

• AMP: Breaking News

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Вадим Макишвили

Темы

00:00:00 Интро
00:04:57 События
00:09:09 Edge 15
00:28:00 Доступный туду-лист
00:53:08 Доклады, книги, прочее

События

• Первые докладчики pitercss_conf
• KharkivCSS в Харькове 22 апреля
• Pitercss_meetup №12 в Питере 25 апреля
• Текстовая трансляция с React London

Edge 15

• What’s new in Microsoft Edge
• Не гзипом единым
• Трекер Edge

Доступный туду-лист

• Inclusive Components: Todo List
• axe-core

Доклады, книги, прочее

• 36
• 5 минут
• Распечатай Яндекс.Карты
• Большая книга манипуляций

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Виталий Слободин

Темы

00:00:00 Интро
00:01:10 События
00:05:07 Firefox 53
00:09:59 Safari TP
00:11:58 Chrome 58
00:13:12 Асинхронные итераторы
00:21:28 PhantomJS всё
00:50:21 Спор о веб-компонентах
01:07:50 Магические зависимости

События

• KharkivCSS 22 апреля
• Видео со SPA Meetup №3
• Видео с MinskCSS №2
• Видео с Moscowcss №2
• Pitercss_meetup №12 25 апреля
• PiterJS №14 27 апреля
• Moscowcss №3 18 мая
• MinskJS №2 18 мая
• Антон Шеин на pitercss_conf

Firefox 53

• Firefox 53 для разработчиков

Safari TP

• Safari Technology Preview 28

Chrome 58

• Chrome 58

Асинхронные итераторы

• Async iterators and generators

PhantomJS всё

• PhantomJS: Stepping down as maintainer
• Chrome Status: Headless mode

Спор о веб-компонентах

• Ремы, емы и почему отказ от них — не проблема
• Невыполненные обещания веб-компонентов
• По поводу невыполненных обещаний веб-компонентов
• Веб компоненты: светлое настоящее

Магические зависимости

• Зависимости в компонентном вебе
• Новость и холивар вокруг

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Антон Шеин

Темы

00:00:00 Интро
00:01:20 События
00:04:39 Из React в Sketch
00:13:44 HTML в WebGL
00:23:17 Игра на CSS
00:31:30 Гриды
00:43:30 HTML Шорты
00:45:02 Дизайнеры и код в Яндексе

События

• Design Prosmotr
• pitercss_conf в Питере 16 июня
• Ha.js в Хабаровске 13 мая
• Moscowcss №3 18 мая
• MinskJS №2 18 мая

Из React в Sketch

• Painting with Code: React Sketch.app
• Sketch 43 with an open file format!
• Protein

HTML в WebGL

• DOM2Texture: Abusing Arcane APIs
• F8 2017 Videos

Игра на CSS

• Adventure Time: Rescue of Flame Princess
• Пламенная Принцесса

Гриды

• CSS Grid Cheat Sheet
• Set of guides to grid layout on MDN
• Responsive Periodic Table with CSS Grids
• Мой ванильный CSS

HTML Шорты

• Можно ли оборачивать блок в ссылку?

Дизайнеры и код в Яндексе

• Доклады Антона Шеина

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:29 События
00:04:17 Бета Chrome 59
00:11:12 Safari TP 29
00:18:18 Samsung на десктопе
00:26:28 WebP торт
00:33:01 HTML Шорты
00:35:26 Normalize.css
00:39:59 CSS 5 уровня
00:44:15 CSS-in-JS
01:15:16 ES-модули

События

• Видео с UralJS №3 в Екатеринбурге
• Видео с PiterJS №14 в Питере
• Pitercss_meetup №13 в Питере 17 мая
• Pitercss_conf 16 июня
• FrontDays в Тольятти 20 мая
• Front-Trends в Варшаве 24—26 мая
• HolyJS в Питере 2—3 июня
• Frontend Conf в Сколково, 5—6 июня

Бета Chrome 59

• Chrome 59 Beta
• Getting Started with Headless Chrome

Safari TP 29

• Release Notes for Safari Technology Preview 29
• The :focus-within pseudo class

Samsung на десктопе

• Samsung DeX brings a new Dimension to the Mobile Web

WebP торт

• Wait, WebP is actually worth it

HTML Шорты

• Зачем задавать картинку через background-image

Normalize.css

• Normalize.css v6/v7 diff
• Postcss-normalize

CSS 5 уровня

• Первый черновик CSS 5-го уровня

CSS-in-JS

• Stop using CSS in JavaScript for web development
• Ran it on Safari it’s like 380x times worse
• Is CSS-in-JS really bad for UX?
• A Unified Styling Language
• With real empathy for CSS devs

ES-модули

• ES6 Modules in Chrome Canary (M60+)
• ES Modules in Browsers

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:28 События
00:02:28 Edge
00:08:22 Opera
00:10:36 Electrino
00:16:10 Автопрефиксер
00:26:18 Меню-кнопка
00:33:53 Ирония
00:38:05 Валидация форм
00:48:51 Логичные размерности

События

• Pitercss_meetup №13 в Питере 17 мая
• Moscowcss №3 в Москве 18 мая
• MinskJS в Минске 18 мая
• ITsubbotnik EPAM в Москве 27 мая
• UralCSS №1 в Екатеринбурге 9 июня
• Pitercss_conf 16 июня

Edge

• Edge: What’s new and what’s next
• What’s new in EdgeHTML 15
• PWA discoverability on Windows: Bing, Store
• PWA manifest to create the Store listing
• PWA on Windows 10 as WebAPK on Android

Opera

• What’s new in Chromium 58 and Opera 45

Electrino

• Put your Electron app on a diet with Electrino

Автопрефиксер

• Autoprefixer 7.0 and Browserslist 2.0

Меню-кнопка

• Menus & Menu Buttons
• Inclusive Menu Button
• React Menu Button

Ирония

• HTML сломан!
• Прогрессивное улучшение меня расстраивает

Валидация форм

• Native form validation — part 1
• Native form validation — part 2

Логичные размерности

• CSS Logical Properties and Values

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:16 События
00:03:45 Samsung
00:12:48 Safari
00:20:07 Google I/O
00:21:49 Git в Atom
00:32:31 GitHub Desktop
00:40:32 Box Alignment
00:46:58 Lazy Image
00:53:07 Лия и Mavo
00:59:33 ППК и формы
01:07:44 Фронтенд заговорил
01:10:09 Perf.HTML
01:12:11 ES-модули

События

• Видео с pitercss_meetup №13
• Pitercss_conf 16 июня

Samsung

• Announcing Samsung Internet v5.4 stable!
• Hacker News readers as Progressive Web Apps

Safari

• Safari Technology Preview 30
• Responsive Design for Motion

Google I/O

• Google I/O 2017 All Sessions

Git в Atom

• Git and GitHub Integration comes to Atom

GitHub Desktop

• How Four Native Developers Wrote An Electron App

Box Alignment

• Box alignment: justify-content: space-evenly
• Свойства для выравнивания всего и их новые тайны
• Наклейки для бейджей WSD

Lazy Image

• Lazy-image

Лия и Mavo

• Introducing Mavo: Create Web Apps Entirely By Writing HTML!

ППК и формы

• Native form validation — part 3

Фронтенд заговорил

• Как правильно вставлять SVG?
• Frontend Weekend

Perf.HTML

• Understanding the network bottleneck
• Identifying the JavaScript slowdown
• Profiling Paint Perf

ES-модули

• Module specifiers: what’s new with ES modules?
• Native ES Modules — Ready for Prime Time?

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:12 События
00:07:57 Маркетинг Firefox
00:16:44 Npm 5 догоняет
00:29:00 Доступность
00:36:12 Почему шорты и шоу
00:41:10 CSS-in-JS
00:49:51 Webpack и SPA
00:58:02 Гриды
01:01:13 Новичкам

События

• Front-Trends
• Drone hijacked on stage
• HolyJS 2—3 июня
• Frontend Conf 5—6 июня
• Pitercss_conf 16 июня
• Fronteers 5—6 октября
• DevConf 17 июня
• OdessaJS 1—2 июля
• FrontTalks in English?

Маркетинг Firefox

• Browse Against the Machine

Npm 5 догоняет

• Npm: v5.0.0

Доступность

• Just landed behind a flag in Canary: inert
• Why headings and landmarks are so important

Почему шорты и шоу

• Зачем нужен БЭМ вне Яндекса?

CSS-in-JS

• A Unified Styling Language
• Let There Be Peace On CSS
• London CSS Meetup, January 2017
• Андрей Оконечников на pitercss_conf
• Андрей Оконечников в 42 выпуске

Webpack и SPA

• Введение в философию Webpack
• Custom Elements v1: Reusable Web Components
• Shadow DOM v1: Self-Contained Web Components

Гриды

• Learn CSS Grid
• Accurately checking for CSS Grid support in Edge

Новичкам

• Статьи Артёма Горбунова про типографику и вёрстку
• Открыть папку или файл из терминала

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Гости: Валерий Сорокобатько

Темы

00:00:00 Интро
00:01:50 События
00:09:44 Safari TP
00:16:42 Нативный календарик
00:20:53 Разработка на телефоне
00:26:39 Гриды на практике
00:28:15 Кастомные свойства
00:35:14 Магия лейблов
00:37:23 Флексы вглубь
00:42:32 Node.js и npm
00:51:00 CSS-in-JS

События

• HolyJS 2—3 июня
• UralJS: Code Retreat 10 июня
• JS Party в Новосибирске 7 июня
• RND.JS №3 в Ростове-на-Дону 24 июня
• OrelJS №1 в Орле 24 июня

Safari TP

• Release Notes for Safari Technology Preview 31

Нативный календарик

• Date picker in Firefox Nightly

Разработка на телефоне

• Writing software using a phone!

Гриды на практике

• Learning CSS Grids

Кастомные свойства

• Зачем кастомные свойства?

Магия лейблов

• Label-to-Input States

Флексы вглубь

• 11 вещей, которые я узнал, читая спецификацию flexbox

Node.js и npm

• Обзор изменений в новом мажорном релизе Node 8
• npm@5 теперь npm@latest

CSS-in-JS

• The new CSS workflow in Webpack
• Письмо любви CSS
• CSS в JS: будущее компонентных стилей
• Rockey. Motivation and Requirements
• I swore never to use CSS in JS, here are 6 reasons why I was wrong
• A Unified Styling Language

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:14 События
00:05:23 DirecTV
00:11:16 Safari
00:23:35 Chrome
00:29:48 Edge
00:35:14 Гриды
00:39:32 Шорты
00:43:55 Стример Юра
00:46:45 Stylelint
01:02:03 Node.js

События

• pitercss_conf 16 июня
• NodeSchool в Новосибирске 17 июня
• DevConf 17 июня
• OdessaJS 1—2 июля

DirecTV

• DirecTV Now will only support Chrome on desktop starting in July

Safari

• What’s new in Safari 11
• Auto-Play Policy Changes for macOS
• Assembling WebAssembly
• JSC Loves ES6

Chrome

• What’s New In Chrome 59 DevTools

Edge

• Edge web platform features
• Grids: still behind a flag

Гриды

• Как работает функция minmax в гридах

Шорты

• HTML Шорты: зачем нужны заголовки

Стример Юра

• Logo animation
• Responsive landing page

Stylelint

• Autofixing in stylelint
• Prettier 1.4.0

Node.js

• Node.js canary builds

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:35 События
00:07:52 Firefox
00:17:06 Гриды в Edge
00:19:30 Зачем флексы
00:21:58 JS-модули в HTML
00:25:37 Webpack 3
00:34:40 CSS-фрагменты

События

• Как прошёл Питер-ЦСС
• PiterCSS Conference Review
• OdessaJS в Одессе 1—2 июля
• LvivJS во Львове 26 августа
• FrontTalks в Екатеринбурге 16—17 сентября
• JSConf Budapest 2017 26—27 октября

Firefox

• Новинки Firefox 54 для разработчиков
• Инспектор раскладок в Firefox Nightly

Гриды в Edge

• Новые гриды в Edge Insider Preview

Зачем флексы

• Кому нужны флексы, HTML Шорты

JS-модули в HTML

• Intent to ship script type=module in Blink

Webpack 3

• Webpack 3: Official Release

CSS-фрагменты

• Черновик CSS Overflow L4

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn

• Boosty
• Patreon

Ведущие: Ольга Алексашенко, Вадим Макеев, Алексей Симоненко

Темы

00:00:00 Интро
00:00:15 События
00:03:25 Разнообразие браузеров
00:12:57 HTML для людей
00:23:23 PE и GD в Шортах
00:25:40 Гриды с фолбэком
00:33:06 Фокус с клавиатуры
00:38:54 Трюки со шрифтами
00:47:31 Рефакторинг и ответственность
00:51:39 Uber в браузере
00:57:12 Фича из CS в ES

События

• Ru Frontend Events
• Typetersburg 5—6 августа
• Pitercss_meetup в августе-сентябре
• WSD осенью-зимой

Разнообразие браузеров

• Release Notes for Safari Technology Preview 34
• Because Browser Diversity Is Good For The Web

HTML для людей

• The Developer’s Edition of HTML makes a comeback
• HTML Living Standard (WHATWG)
• HTML 5.2 Draft (W3C)

PE и GD в Шортах

• Прогрессивная деградация

Гриды с фолбэком

• От бутстрапа — к CSS-гридам
• CSS Grid in production on the Mozilla website!

Фокус с клавиатуры

• Keyboard-Only Focus

Трюки со шрифтами

• Font Aliasing, or How to Rename a Font in CSS
• Unquoted font family names in CSS

Рефакторинг и ответственность

• Front End Center: Single Responsibility Components
• React: Why Accessibility?
• Create-react-app now warns if JS bundles exceed 500KB

Uber в браузере

• Engineering a High-Performance Web App
• Каждое обновление Убер 270 мегабайт

Фича из CS в ES

• Optional Chaining Operator (Stage 1)

Читайте новости

• Telegram
• X
• VK
• Facebook
• Mastodon
• Bluesky
• LinkedIn