Всем привет! На этой неделе с вами Андрей Ситник @andrey_sitnik из @evilmartians, автор @PostCSS, @autoprefixer и easings.net

Предлагаю сегодня поговорить про опенсорс — зачем, как начинать, как пиарить и вести большой проект? pic.twitter.com/uZRoPUxvaR

Во вторник подведём итоги года, а в среду сделаем предсказания на 2016 — всё таки это последний сезон в этом году pic.twitter.com/AfX7rcHwgq

В четверг поговорим про конференции. В пятницу про общение с дизайнером и анимации. И закончим всё эротикой. pic.twitter.com/CWaHNnX6tH

Я не буду говорить о @PostCSS — но с радостью отвечу на вопросы, которые у вас возникали pic.twitter.com/ItFJfdZhsi

Для @PostCSS есть отдельный аккаунт и даже паблик vk.com/postcss и самое важное я рассказал на @FrontTalks youtube.com/watch?v=qhouBG…

Так же меня можно спрашивать про Википедию — я 8 лет был администратором и сейчас веду паблик «Однажды в Википедии»
vk.com/lostinwiki

Вот досье на меня на проекте вики-оппозиции
wikireality.ru/w/index.php?ti… pic.twitter.com/VzNqKOrD8G

И могу ответить про Китай — моя мама и братья довольно долго живут в Пекине pic.twitter.com/ArTihbs2Cy

Для подведения итогов я часто буду использовать твиттер-опросы — на «Опрос» в неофициальных клиентах надо будет открыть веб-версию

Но вначале обновление npm-пакетов и руби-гемов на @amplifr_ru — очень люблю самые свежие версии и понедельник лучшее время для обновления

Первый опрос — все ли тут пишут только CSS (в сторонних клиентах откройте веб-версию)

Я не буду ограничиваться только темой CSS — наша цель в создании интерфейса, а не кода. Среди нас по опросу только 10% чистых верстальщиков.

[Опрос] Участвуете ли вы в опенсорсе?

@dshster Это в принципе правильное желание, если ты считаешь что уже всё знаешь значит ты вообще нифига не знаешь :) @cssunderhood

[Опрос] Если вы ещё не начали опенсорсить, то почему? Свой вариант пишите в ответы.

@iamstarkov @cakeinpanic @cssunderhood Причём 85% этого кода — у @sindresorhus

В опенсорсе мне больше всего нравится работа с людьми из кучи стран — даже в маленький проект приходят люди из совсем разных культур

А почему вам нравится заниматься опенсорсом?

@cssunderhood @cakeinpanic Идеальный код тяжело дополнить. Точно.

Предварительные результаты опроса по опенсорсу — 40 % хочет начать опенсорсить, но не знает что простого сделать pic.twitter.com/lTB6k9Sx7m

Давайте соберём простые способы начать опенсорсить.

Есть круто твиттер @yourfirstpr — там собирают списки очень простых задач для новичков, руководства и мотивирующие доклады

@cssunderhood Прямо сейчас идёт предрождественский 24pullrequests.com, где предлагают проекты с помеченными ишьями для новичков

Пока ссылка для ветеранов опенсорса — сервис показывающий с каких PR ты начинал firstpr.me

Я делаю отдельно woff и woff2 только если шрифт редко используется и его имеет смысл грузить отдельно

Мои 10 рецептов самых простых способов попасть в опенсорс — для любой квалификации и на любое свободное время:

1. Добавьте пару примеров или исправьте орфографии в документации — вы как сторонний пользователь можете написать их лучше

Посмотрите на postcss-color-function — список функций с примерами и ваш вклад больше автора плагина github.com/postcss/postcs…

2. Добавьте в проект .editorconfig — этот файл сейчас хороший тон

3. Добить ChangeLog.md в проект — тут есть хорошее объяснение, почему он должен быть в каждом проекте keepachangelog.com

4. Добавьте линтер ESLint или Stylelint — только не забудьте подобрать правила под старые стиль код

5. Если есть тесты — добавьте конфиг Travis CI, но владелец проекта должен будет создать проект там сам

6. Тестам всегда рады. Даже если вы не знаете как починить ошибку — пришлите просто тесты.

7. Часто нужно исправление кода или, как минимум, тестов под Windows

8. Переписать старые проекты на CoffeeScript на ES2015

9. Иногда можно добавить файл лицензии и указать её в package.json

10. Обновить версии пакетов — разработчики часто забивают на новые API

Сегодня мы подводим итоги года. Давай-те начнём с большого опроса по технологиям и инструментам, чтобы к вечеру уже иметь результаты.

[Опрос] Какой у вас формат для иконок и мелкой графики

[Опрос] Как подключаете SVG

[Опрос] Какие иконки используете

[Опрос] Как пишите стили?

[Опрос] Какой синтаксис препроцессоров используете?

[Проплаченный опрос] Используете ли PostCSS?

[Опрос] Используете ли линтер для CSS

[Опрос] Использует ли ваш сайт HTTPS?

[Опрос] Тестируете ли вы фронтенд?

[Опрос] Как ваша команда пишет JS?

[Опрос] Какой «Другой язык» ваша команда использует для JS

[Опрос] Где у вас генерируется HTML?

[Опрос] Как вы изолируете CSS-компоненты?

[Опрос про опросы] Интересны ли вам более подробные опросы?

[Опрос] Чем вы собираете файлы?

[Опрос] Чем вы запускаете линтеры, сборку и другие скрипты?

Все интересующие меня вопросы я задал. О чём вы ещё хотите получить статистику? Сегодня вечером посмотрим результаты и выделим тренды.

[Опрос] Какой JS-фреймворк вы используете для рендера на клиенте?

[Опрос] Какой линтер для JS вы используете? (Так и не решил, стоит ли включать JSCS, пусть будет в «Другой»)

[Опрос] Под какие устройства разрабатываете?

[Опрос] В чём вы пишете код?

[Опрос] Если пишете в текстовом редакторе, то в каком?

[Опрос] Откуда грузите библиотеки?

Оказывается, недавно появился flexbox polyfill для IE8 & 9 github.com/10up/flexibili…

Всё, основное голосование закончилось — дальше не будет так много опросов. Завтра оглашу результаты.

Подпишу ещё пару новогодних поздравлений сообществу @PostCSS и перейдём к трендам уходящего 2015 pic.twitter.com/Xe9qgQR7Me

Что для вас было самым запоминающимся в 2015?

Пока я начну с себя и расскажу, как мне виделся 2015 — что пришло в менйстрим

1. На первом месте ES2015 — JS наконец-то стал нормальным. Следующий год мы ещё будем правильно учиться его использовать на все 100%.

2. Браузеры начали продвигать HTTPS — крутые новые технологии (HTTP/2, Service Workers) будут работать только с шифрованием

3. Постпроцессоры пошли — @PostCSS, @PostHTML, Babel 6 стал «PostJS»

Кроме того появился mdast для Маркдауна github.com/wooorm/mdast и jazzon для JSON github.com/tornqvist/jazz…

У @IAmTrySound была крутая идея постпроцессора для работы со шрифтами

4. React стал основным решением, если вы рендерите на клиенте. Ребята даже делают инструментарий чтобы собирать на нём статичные сайты.

React — отличный пример, что чтобы функциональное программирование пошло в народ надо было очистить его от математики и фанатичности

4. В 2015 Bower окончательно уступил место npm. Я бы даже сказал, что Bower делит с Sublime звание «Смерть года».

5. Sass переломил ход войны с Less — наконец-то довели до ума быстрый libsass и переманили Bootstrap к себе. «Перелом года»

Это мы с автором libsass обсуждаем аншлюс пользователей Less между Sass и PreCSS pic.twitter.com/skbx3f8lA3

6. Дизайнерам надоело делать картинки и они чаще начали создавать систему и библиотеку компонентов. «Styleguide» вошли в мир фронтенда.

7. «Переворот года» Microsoft стала крутой компанией. Edge устраивают голосование за след. фичи. wpdev.uservoice.com/forums/257854-…

Если вы попадёте на самое дно и потеряете надежду — вспомните, как круто выкарабкалась Microsoft. Значит и у вас получится.

8. Флексбоксы стали таким мейнстримом, что штука про «в CSS нельзя отцентрировать блок» уже потеряла свой шарм pic.twitter.com/n0SP2yKzb5

@cssunderhood Ещё gatsby.

[Опрос] Изменили вы технологии разработки в 2015?

Как разрабатывают стандарты — график прилагаемых сил для всовывания/высовывания нового разъёма USB-C pic.twitter.com/Fp6ZCyKpSO

Я хочу в новом году написать статью о переходе с Sass на PostCSS, так как там главный плюс будет из-за компонентов и изоляции

В 2015 круглых дисплеев стало так много (в умных часах), что W3C расширило CSS для них
w3.org/TR/css-round-d… pic.twitter.com/B71A9IKmu8

[Опрос] С какой версии вы поддерживаете IE?

@cssunderhood @PostCSS @PostHTML и Textr для текста c базовым набором плагинов
github.com/shuvalov-anton…
github.com/iamstarkov/typ…

@cssunderhood @voischev Прям за живое схватил. Дизайн в браузере, живые стайл гайды, документация компонентов. В се прям по-взрослому стало!

Что-то я совсем забыл про победителя секции «Смерть года» — Compass. Я начал Автопрефиксер специально чтобы его убить.

Hate Driven Development pic.twitter.com/f1bA2YP0IH

@cssunderhood FramerJS стал массовым дизайнерским инструментом, для динамических прототипов. (Дизайнерам надоело двигать листики по столу)

@nayanov @andrey_sitnik, можно будет потом на сайте посмотреть лог и посчитать количество фраз: "для этого есть postcss плагин"

@cssunderhood Да и мне оно просто из интереса. Я склоняюсь к мнению, что если и поддерживать такие браузеры, то на уровне «контент видно».

А расскажите на что вы перешли в этом году? (Все же проголосовали, что обновились — теперь рассказывайте)

@cssunderhood PostCSS. Стрельнуло знатно! Перешел с Sass. А еще JS начал изучать не на уровне jQuery.

@cssunderhood на сон

@cssunderhood мы выкинули Sprockets из Ruby on Rails и перешли на Gulp, Browserify, React, PostCSS

@cssunderhood gulp/angular → webpack/react+redux.

@cssunderhood ой, и node-sass → PostCSS + CSS Modules, конечно!

@cssunderhood прикрутил babel, в процессе переход с requirejs на webpack, начал писать тесты (даже довелось провести собеседование)1/2

@cssunderhood @webholt такие законы порядочный гражданин не то что может нарушать, а просто обязан

@cssunderhood Перешёл в этом году из бекенда во фронтенд! (Ну, не совсем перешёл, скорее добавил к списку скиллов.)

@cssunderhood <зачёркнуто> на тёмную сторону </зачёркнуто> на PostCSS

@cssunderhood углубленно начал учить JavaScript. При этом увлекся NodeJS и AngularJS. Наконец заставил себя начать использовать Gulp и Sass.

@cssunderhood PostCSS, React, ES2015

@iamale_ru, @cssunderhood, а у меня обратная трансформация: вкусил бэкенд на Ноде и обфулстэчился.

@iamale_ru, @cssunderhood, а ещё с подачи @iamstarkov сначала подсел на Рамду, а потом и вовсе на функциональное программирование.

@cssunderhood функциональщина

@cssunderhood Соскочил с Angular и PHP. Пересел на React и Rails. Познал дзен TDD

@cssunderhood стал БЭМ одержим. Кастомлю под себя bem-components. Подрываю дизайнерскую психику прототипами на bemjson (совладавших с html)

@cssunderhood es2015, ramdajs, ушёл от commonmark к mdast, отказался от gulp в пользу npm run

@kinday @cssunderhood тоже не нравится, когда путают таск-раннер с бандлером. Просто хотел подчеркнуть, что иногда бандлера достаточно.

@cssunderhood Банально: ФП, Реакт, Редакс, тесты

@cssunderhood ровно через 3 недели Microsoft перестанет поддерживать internet explorer ниже 11 версии microsoft.com/en-us/WindowsF…

@cssunderhood освоил Bourne shell, переехали в docker, научился тестировать webpack loaders и познал красоту postcss

Love making these little things move. pic.twitter.com/p4Y33NnjJ0

У на нас @amplifr_ru самописный скрипт загрузки CSS — просто ищем require(.*.css) и собираем с помощью PostCSS
gist.github.com/ai/848f6d67d57…

@cssunderhood а еще 2015 запомнился всякими худами)) @jsunderhood @abroadunderhood @rubyunderhood @iamspacegray и конечено же @cssunderhood

Want to use #BEM and save yourself some typing? There’s @PostHTML and github.com/rajdee/posthtm… for that. Enjoy the time you’re saving!

Введение в Service Worker Toolbox, набор инструментов для простой работы с сервис-воркерами deanhume.com/Home/BlogPost/… pic.twitter.com/SWP4g467Ua

А вообще у нас Новый год скоро, а вы только о смерти говорите. Давай-те поговорим о чём-то добром. pic.twitter.com/vueuXx5DZJ

[Опрос] Поставили ли вы новогоднюю обои на рабочем столе?

@cssunderhood о красоте языка, который ты так люто коверкаешь, например :)

Результаты вчерашнего опроса о Фронтенде 2015
imgur.com/a/U2xlB

Странно, что линтер стал стандартом в JS, но пока не в CSS, хотя он тоже защищает от ошибок stylelint.io/?/src/rules/ru… pic.twitter.com/3kEXG9aR0a

CSS-in-JS пока не пошёл — может в 2016. Я считаю только JSS нормальным решением CSS-in-JS. github.com/jsstyles/jss pic.twitter.com/OTbB2H2Ziv

А @PostCSS пошёл во всю. Странно, правда, что так мало использую его для SVG.
github.com/trysound/postc… pic.twitter.com/Chpq3jMOmW

Тестирование во фронтенд так и не пришло. Может хоть компоненты в 2016 сдвинут дело с разделением на умные и глупые pic.twitter.com/3eljPvsTpk

Но есть интересный черновик от @tabatkins, чтобы нормально менять цвет у SVG в url()
tabatkins.github.io/specs/svg-para… pic.twitter.com/OplPVwBzbG

@cssunderhood или на препушхук добавить проверку с помощью husky
github.com/typicode/husky

Несмотря на хайп вокруг React, большинство рендерит на сервере — странно что для этого нет нормальных фреймворков pic.twitter.com/dueoDJIiCq

Если вы думаете, что в 2016 сможете спокойно пожить — у меня для вам плохие новости. Революций будет только больше. pic.twitter.com/lB8ExPQgAt

Переходите на HTTPS через letsencrypt.org — уже в 2015 большинство шифрует pic.twitter.com/NqwYTznroL

@cssunderhood я думаю, CSS Linter'ы не прижились особо только потому, что CSS обычно пишет один человек

Пришло время для рубрики «Полезные советы». Пишите свои находки — я буду ретвитить. pic.twitter.com/IDZDFJeY92

На @amplifr_ru мы проверяем орфографию переводов приложения прямо во время тестов на Travis CI github.com/hcodes/yaspell…

gulp-zopfli жмёт чуть лучше gzip — считайте это дополнительный 10-й уровень сжатия gz
github.com/pierreingleber…

Если вы теряетесь в кучах мусора на npm, то на npmsearch.com есть поиск с учётом популярности и активности проекта

Если вы делаете форму для ввода банковской карты — проверьте номер на описки, в нём есть «контрольная сумма»
github.com/bendrucker/fas…

Для полей банковской карты используйте шрифт Halter, чтобы выглядело как на реальной карте
dafont.com/halter.font pic.twitter.com/GWPOJKgHYc

@cssunderhood, диктатура — лучшая методология разработки.

@kinday @cssunderhood блок, элемент, диктатор

Вчера мы говорили про тренды прошлого года. Сегодня давай-те предсказывать, что станет трендами в 2016. pic.twitter.com/wbRkYd3Y3m

Главный тренд 2016 — изолированные компоненты. Это как БЭМ, но более изолировано, на новых технологиях и чуть другой принцип разделения.

Компонент — это, как и в БЭМ, когда вы нарезаете дизайн на маленькие части и храните их CSS и JS в одной папке pic.twitter.com/xwdXYHwb1H

Новый уровень изолирования 2016 включает — автоматическую изоляцию селекторов, локальный ресет, медиа-выражения для компонента

Изоляция селекторов в 2016 будет идти автоматически — просто .name, .logo. Без префикса как в БЭМ — это уже реализовано в CSS Modules и JSS.

При этом, CSS Modules — это не только для React. Уже есть метод работать с ними из PHP или Ruby.
github.com/outpunk/postcs…

Но селекторы не единственная проблема. Гораздо опаснее наследуемые свойства типа line-height или * { padding: 0 }.

Свойства защитит «локальный ресет» — когда вместо глобального ресета вы в каждом CSS-элементе пишете all: initial, для очистки наследования.

В @PostCSS для локального ресета есть postcss-autoreset. В JSS тоже возможен плагин.
github.com/maximkoretskiy…

all: initial пока не поддерживается в IE, но есть полифилы (их выход отлично жмётся gzip)
github.com/maximkoretskiy…

Медиа-выражения компонента — это когда вы указываете размеры не страницы, а контейнера. Или даже цвет фона контейнера.

С такими медиа пока готовых решений нет, но в JSS можно сделать кастомный код. А для @PostCSS есть JS-хак
github.com/ausi/cq-prolyf…

Изоляция компонентов в JS достигается за счёт CommonJS и React — но это всё захватило мир уже в 2015 подготовив землю для второго этапа

Ещё отличие компонентов от БЭМ — это «умные» компоненты,которые сами дизайна не умеют, зато управляют вложенными компонентами

Пример «умного» — React Shuffle, который только реализует анимацию изменения списка github.com/FormidableLabs… pic.twitter.com/iyC87QJv6W

У нас в @amplifr_ru есть компоненты без дизайна Rotator, Loader, PostsData — анимация поворота, блокиратор на время AJAX и загрузка данных

Вот мой доклад про современную изоляция с парижской dotCSS ai.github.io/postcss-isolat… pic.twitter.com/PnkR6TMuRe

Компоненты могут быть полезны в тестировании. «Умные» компоненты с логикой без дизайна. И все «глупые» на одной странице в стайлгайде.

Так же компоненты могут упростить анимации — из-за изоляции можно сделать набор анимаций без дизайна и выложить а npm. См. React Shuffle.

@cssunderhood мой список: 1) infrequently.org/2015/06/progre… 2) webassembly 3) angular2 vs react 4) reactive apps 5) native web mobile

@cssunderhood это же просто wow будет!! )) контекстное поведение, виджеты которые адаптируются под виджет или цветовую гамму сайта.

Второй тренд 2016 — Service Workers, API чтобы с сайта поставить «демон» в браузер, чтобы перехватывать кеш или показывать уведомления

Уже на всех конференциях рассказали про Service Workers. Вот вам самая ссылка с кратким описанием.
html5rocks.com/en/tutorials/s…

Даже если Service Workers не обеспечат пока победу мобильному веба, то с их помощью можно делать много хаков с кешем.

Третий «нежданчик» 2016 — люди увидят, что CSS Custom Properties, это не замена переменным, а чуть ли код в CSS philipwalton.com/articles/why-i…

Офигенная спека, которые все ждут в 2016 — это CSS Grid Layout. Это даже лучше Флексбокса. pic.twitter.com/uq1KjFoksU

В CSS Grid Layout можно будет делать раскладку рисуя ASCII-графикой
w3.org/TR/css-grid-1/… pic.twitter.com/uJrGwVy7fk

Забыл написать пример, как вы будете писать компоненты в 2016
gist.github.com/ai/8c29609605d…

Вот галерея с результатами вчерашнего опроса по фронтенду 2015 года, если вы пропустили ссылку днём
imgur.com/a/U2xlB

А что вы ждёте от 2016? Даже не технологии, а какие желания?

@cssunderhood окончания войны...

What TLD do you use when setting up a local environment?

@cssunderhood Да нет, я имел ввиду, что я сам бы порекомендовал кое-что читателям: css-live.ru/tag/css3-grid-… :)

Вчера мы обсуждали, как автоматически добавлять -js- префикс для нового полифила флексбоксов, а @7rulnik уже сделал github.com/7rulnik/postcs…

Вот, что значит действительно хотеть опенсорсить ;) pic.twitter.com/jEvwdFec2G

@cssunderhood появление новых устройств обратной связи (типа haptics) для сенсорных экранов.

@cssunderhood Вот тут я с тобой согласен, намного легче когда шрифт на сайте соответствует шрифтам на печатных материалах.

Думаю что @CSSHat это самое ценное приобретение для автоматизации работы. @cssunderhood

Мы вчера обсуждали изоляцию селекторов, а на днях парень сделал аналог CSS Modules на 60 строках кода
github.com/ctxhou/postcss…

[Опрос] Сортируете ли вы CSS-свойства?

@cssunderhood @dshster или можно воспользоваться плагином для Sublime Text или Atom.

Продолжаем серию мелких советов — сегодняшняя тема, как добавить снег на сайт pic.twitter.com/S0rEYHdtXW

Скопируйте паттерн снега на две картинки. Вторую уменьшите, размойте и анимируйте медленнее первого. Получиться красивый параллакс.

Только запускайте снег по наведению на логотип — постоянная фоновая анимация сильно отвлекает глаза от чтения

Тематические оформления к праздникам были самыми любимыми моими заданиями на Групоне. Всегда можно придумать интересную анимацию.

This Christmas, pick an #opensource author (or two!) whose work you appreciate and thank them on Twitter or GitHub. You'll make their day.

[Опрос] Посещали ли вы конференции в 2015?

[Опрос] Выступали ли вы на конференциях?

@cssunderhood послушала бы точку зрения тех, кому не интересно

Давай-те соберём впечатления о русскоязычных главных фронтенд конференциях года. Парни хорошо старались и им обратная связь будет полезной.

[Опрос] Ваши впечатления от WSD?

[Опрос] Ваши впечатления от @frontend_union?

[Опрос] Ваши впечатления от FrontendConf?

[Опрос] Ваши впечатления от @FrontTalks?

У каждой спеки W3C есть цикл жизни на конференция: общий обзор → практика → особенности в нашей компании → как отказаться от этой спеки

Найти тему очень просто. Выбираете новую интересную технологию — изучаете её сами или внедряете на работе, рассказываете, что изучили.

Конференции же нужны не для знаний, а для формирования трендов, знакомств, сплочения сообщества — не бойтесь, что мало знаете

Например, на Западе часто бывают весёлые доклады без какой либо серьёзной информации. И они отлично идут.
youtube.com/watch?v=lvxLb2…

[Провокационный опрос] Ходили ли вы на свидание с кем-то, с кем познакомились на конференции?

@cssunderhood @Lik04ka так и книги же есть, только без практики никуда. Мне очень "Мастерство презентации" Алексея Каптерева понравилась

@cssunderhood вчера даже написал заметку о том, на каких конференциях был в 2015 году noteskeeper.ru/1286/

@cssunderhood три года уже вместе)

@cssunderhood что-то этот и предыдущий опрос не вяжутся, насчет "выступал на конференциях"

@cssunderhood К слову. Очень хотелось бы увидеть в МСК больше воркшопов/мастер-классов.Постоянно вижу анонсы воркшопов в Украине, но там 1/2

@cssunderhood 2/2 проще, расстояния меньше. Готов помогать с организацией. И вот к сожалению не попал на мастер-класс на WSD, печаль :(

@cssunderhood +мотивация, которую сложно получить и передать на носителе

Действительно, один из главных плюсов конференций — то, что ты видишь, что все вкалывают. Так что дома ты садишься за редактор, а не сериал.

@cssunderhood @andrey_sitnik рассказал коллеге, что не узнал ничего нового с конференций. Он мне ответил, что было бы плохо, если наоборот.

@cssunderhood Я чтобы прокачаться в публичных выступлениях, начал преподавать

@cssunderhood @Tom910ru в своё время помог курс coursera.org/learn/public-s… По ходу собирались с друзьям, тренировались, критиковали друг друга

@cssunderhood @Tom910ru по опыту лучше начать практиковаться с коротких презентаций на *простые* темы перед знакомыми (5-15 мин)

@cssunderhood @Tom910ru может быть полезно: как мы готовим докладчиков к MoscowJS github.com/MoscowJS/speak…

Представьте, что вы в баре рассказываете друзьям о крутой спеке — вам же не нужна теория. Тоже самое на конференции. Просто поборите страх.

И лучше сразу выкинуть из головы все эти лекции из университета — просто рассказывайте, как если бы вы рассказали в баре.

Лучший способ побороть страх — вызубрить первые 3 предложения. Как начнёте говорить, сразу увидите, что страх ушёл.

@cssunderhood @23ydobemos @Yodairish @andrey_sitnik Согласен. Идёшь на конфу рассказывать о React. Думаешь: засмеют. А там у всех джейквери.

@psyw @cssunderhood вот отличное пособие youtube.com/watch?v=60ZVTN… :-)

Результаты вчерашнего опроса про конференции pic.twitter.com/hFgnrORx9k

Мнения о прошедших фронтовых конференциях. Странно, что так сухо приняли @frontend_union. pic.twitter.com/tGvbKkrlRi

И результаты, которых вы все ждёте — как много начали встречаться на конференциях pic.twitter.com/MHAchVFjOZ

В пятницу предлагаю обсудить няшное — анимации и общение с дизайнером. Вот эта иллюстрация самая важная. pic.twitter.com/kxOFhUfuHb

[Опрос] Кто придумывает анимации для сайта?

[Опрос] Кто продумывает адаптивность?

[Опрос] Как в вашем проекте фронтендер общается с дизайнером?

@filipovskii @cssunderhood @Tom910ru кстати, что-то я внезапно вспомнил. Мы тут в нашем “баре для своих“ практикуем короткие мелкие лекции

@filipovskii @cssunderhood @Tom910ru бывает человек по 10 примерно, докладчик стоит прямо напротив слушателей vk.com/video3165846_1…

Я считаю, что хороший фронтендер должен развивать в себе чувство прекрасного, чтобы чувствовать дизайн. Давайте обменяемся ссылки для этого.

Мой самый любимый проект — Little Big Details, о важных мелочах в интерфейса
littlebigdetails.com

Мои любимые обзоры интересных анимаций. Буду очень рад, если кто-то подскажет ещё такие обзоры.
pinterest.com/jvetrau/gestur…

@cssunderhood Просто смотрю и читаю много статей о UX и дизайне, часто зависаю на dribbble и сайтах с покупными ui китами.

@cssunderhood Поэтому и работать с дизайнерами бок о бок. С хорошими дизайнерами. Они еще и расскажут, почему так, а не иначе.

В @evilmartians отличный дизайнер @romanshamin, который и пример адаптивности на флексбоксе сделает и на Хаскеле и Elm программирует

@cssunderhood @evilmartians @romanshamin Сейчас и дизайнерам нужно уметь программировать(Origami), что бы воссоздавать анимацию и концепты )

У @infotanka отличные разборы, как надо показывать данные, чтобы было понятно и интересно
blog.infotanka.ru/tags/vizualiza…

@cssunderhood @infotanka вообще d3.js способен на чудеса. Почему-то про него не особо часто говорят.

Давай-те сегодня поздравим авторов опенсорса. @gritzko спасибо за @swarm_js — по-моему он станет важным трендом 2016

Закончил подписывать авторам плагинов @PostCSS — 100 писем готовы к отправке pic.twitter.com/Co5p3D69xl

@cssunderhood @JedWatson My choice is Yuriy Khabarov (gromo on github) github.com/gromo/jquery.s…

@gritzko @andrey_sitnik лично я собираюсь разрабатывать saas решение для малого бизнеса на swarm react redux в 2016

Интересная статья про бумажные «компьютеры» — вот это интересная UX-задач
habrahabr.ru/company/appode… pic.twitter.com/df7UW7LZll

Простая трансформация (по Диснею) во время движения, может сделать анимацию гораздо лучше
uiparade.com/portfolio/simp… pic.twitter.com/vm3aet6qpC

@cssunderhood мониторил кучу UX-стаффа, но надоело, теперь только underconsideration.com/brandnew/, logodesignlove.com и lovelypackage.com

@cssunderhood @andrey_sitnik capptivate.co и useyourinterface.com

@cssunderhood @andrey_sitnik ещё почти туда же lovelyui.com

@cssunderhood и ещё по фану cuttingedgelogos.tumblr.com и somethingandelse.tumblr.com

Есть ли у вас личный проект помимо основной работы?

Я знаю, вы ждали этого целую неделю. Скоро начнём.

Я считаю, что фронтендеру важно иметь чувство прекрасного. Открываем тему эротики, пока у меня не забрали акк. pic.twitter.com/jsjYVX4ywd

Порноактриса @stoya ведёт отличный блог о роли порно в обществе с интересными мыслями
stoya.tumblr.com pic.twitter.com/1m9YOvLKr6

Интервью с девушкой-хакером из Китая про сексуальные предпочтения китайцев
reddit.com/r/BoltedOnAsia… pic.twitter.com/O7yNCxNWd0

У @Pornhub интересный блог про стат. анализ порно предпочтений pornhub.com/insights pic.twitter.com/ICEb7KpLXV

предлагаю твиторам @jsunderhood @backendsecret вот щас вот резко взять пример с twitter.com/cssunderhood/s…

Хотя вместо «50 оттенков серого» лучше посмотреть «История О» 1975 года pic.twitter.com/oinPnIxpNw

Моей любимой эротическим фотографом является Ellen Von Unwerth. Например, её серия Revenge alafoto.com/revenge/Reveng… pic.twitter.com/uqq4IofSyP

Хотя мимо знаментиого Helmut Newton тоже пройти нельзя pic.twitter.com/np6eENcmoo

Ну и напоследок — помните о правильном применении гирлянд (только светодиодных и низковольтных) pic.twitter.com/kFfFVWquzl

Андерхуд здорового человека. twitter.com/cssunderhood/s…

@cssunderhood моё любимое pic.twitter.com/CQusIvUJoh

Вообще, крутое ощущение, когда ты не прячешь свои «предпочтения» — ты понимаешь, что тебе нечего скрывать. Облегчение как после исповеди.

@cssunderhood у меня давно в списке предпочтений с порно картинками висит тамблер modsmut.tumblr.com

@cssunderhood Исповедовался — и к монашкам

@cssunderhood Ситник вдохнул новую жизнь в cssunderhood, давно я так часто не обновлял ленту твиттера в надежде новых постов)

@cssunderhood @psyw плохо. Ведь если она попросит пропылесосить, я не смогу открыть терминал с непонятными символами и сказать что занят :D

Моя любимая русская фотограф vk.com/anstlskwts pic.twitter.com/nj0Ai54gOx

Умные тестировать обычной AVA/Mocha. Глупые — скриншотами.

@SelenIT2 @cssunderhood чтобы не прижгло. Для прижиганий свечки олее подходят.

Вылетаю сейчас в Вену, так что буду только ближе к вечеру. Можем поговорить сегодня про путешествия.

А пока, если вы не поехали за ёлкой, посмотрите отличный доклад @ihannky, о том, как делать анимации быстрыми
youtu.be/zJxPuXNHx_M

@cssunderhood из студий - Marc Dorcel топчик

@cssunderhood djvu-читалку под OSX, подскажите

@cssunderhood @pvpshoot @juwain @vdv73rus я показал тот сет девушкам на работе, жене и даже тёще. Всем все понравилось

Опенсорс — он как эротика, приносит счастье людям. Надо ценить и поддерживать доброту в опенсорсе.

@cssunderhood По личному примеру соглашусь :) Профессия мало влияет на отношения, кроме сайд-эффекта в виде расширения тем для общения.

@psyw была такая проблема, я помог ей стать HR'ом в IT-компании, теперь она понимает меня, мою работу и наши профдеформации:) @cssunderhood

@andrey_sitnik а вообще бросать нужно эти офисы! Я вот впервые за 5 лет сдался в офис. Офигеваю просто :)

Давайте @dzaporozhets закидаем печеньками :) twitter.com/cssunderhood/s…

И раз мы начали про музыку, то давайте слегка продолжим вчерашний вечер.
Секретный клип Placebo.
vk.com/video12568874_…

Ладно, дам прямую ссылку на одну песню (да, солист Мумий Тролля учил китайский во Владивостоке)
youtube.com/watch?v=GLBJRP…

В поисках идеального редактора JavaScript goo.gl/Sdn3nM pic.twitter.com/2YypeWXZ9u

Последний день в cssunderhood я бы хотел посвятить науке. Всё таки 2015 был именно годом науки.

В 2015 человечество впервые увидело Плутон, Цереру и так подробно изучило комету pic.twitter.com/7LbPYhJ8x8

В эту году метод CRISPR активно пошёл в лаборатории, открыв новые горизонты редактирования ДНК без ошибок и рака
ru.wikipedia.org/wiki/CRISPR

Главные научные итоги по версии журнала Science lenta.ru/articles/2015/…

Кроме того мы за последние годы мы научились видеть планеты у других звёзд и нашли тысячи их

Вот список найденных планет у других звёзд в обитаемой зоне
ru.wikipedia.org/wiki/%D0%A1%D0…

Какие научпоп книги вам понравились?

Моя любимая научпоп книга «Почему языки такие разные», которая очень просто рассказывает базис практический всей лингвистки

Лингвистика вообще интересная наука. Каждый человек постоянно использует язык — но мы не знаем ответы даже на базовые вопросы про язык

Ну и лингвистика может помочь в проектировании языков и API, так как это похожие вещи

@cssunderhood банальный Хокинг - неплох. «Почему языки такие разные» Владимира Плунгяна не зря получила премию «Просветитель».

@cssunderhood "Научные теории За 30 Секунд" в аудиоформате

@cssunderhood Карл Саган — «Мир, полный демонов. Наука - как свеча во тьме»

pic.twitter.com/b1ythcihPU

@cssunderhood, «Человек, который принял жену за шляпу» Оливера Сакса.

@cssunderhood раз такая тема, делитесь интересными научпоп каналами на ютубе.

@cssunderhood «Мифы об эволюции человека» Александра Соколова. Очень советую.

@cssunderhood мои pastebin.com/3Q7EtaRk

@cssunderhood «Хаос. Создание новой науки» Джеймса Глейка

@cssunderhood Она выдает себя за художественную "Harry Potter and the Methods of Rationality". и совершенно невероятна.

Краткий ответ, почему трава (хлоропласты) именно зелёная
habrahabr.ru/post/237133/

Я очень люблю @postnauka — по моему, это самое лучшее, что случалось с русским образованием.
postnauka.ru

Иванов-Петров составляет прекрасные обзоры всей русско научной блогосферы — тоже любимое еженедельное чтиво
ivanov-petrov.livejournal.com

Кирилл Размыслович в своём блоге интересно рассказывает про все новости космонавтики
kiri2ll.livejournal.com

У @fka_roscosmos отличный ютуб-канал с еженедельными передачами. По количеству информации даже лучше НАСА.
youtube.com/user/tvroscosm…

@cssunderhood я этими открытиями просто восхищаюсь. Есть подкаст @BeardyTheory на тему космоса, и всего, что с ним связано.

@cssunderhood вот хороший жж scinquisitor.livejournal.com

Каждая девушка мечтает, чтобы ей сказали «давай посмотрим вместе @postnauka»

@cssunderhood «Мы — это наш мозг. От матки до Альцгеймера», Дик Свааб

@cssunderhood «Об интеллекте» Джеффа Хокинса

Теперь мой дозор окончен. С вами был @andrey_sitnik. Мы подвели итоги года, предсказали тренды 2016, обсудили опенсорс, науку и эротику.

Подписывайтесь на @PostCSS и на мой паблик «Однажды в Википедии» vk.com/lostinwiki

@cssunderhood «Элегантная Вселенная» Брайана Грина, любители квантовой механики должны оценить.