А вот и запись: https://youtu.be/MUSzHboVR1s?t=10624

Сегодня в 12:00 Msk впервые участвую в обсуждении в Clubhouse. Поговорим с Андреем Суминым, Ильей Немиро, Пашей Франковым, Серегой Сергеевым и, конечно же, слушателями про ожидания, оценку и рост разработчиков на разных грейдах. Присоединяйтесь: https://www.joinclubhouse.com/event/xBRjqry1

Записал практическую инструкцию, как не выгореть, работая более 10 лет в одной компании: https://www.youtube.com/watch?v=sn0Ky_JluZQ

Поговорил на первом в 2021 году Я.Субботнике о путях развития фронтендера в Яндексе.

Обсудили, как измерять скиллы разработчиков, куда расти и что для этого делать.

Субботник все еще в эфире. Ссылка на трансляцию: https://youtu.be/ApGPxHjryHY

Ссылки к докладу.
Ревью: как устроена система оценки сотрудников в Яндексе — https://youtu.be/zZgSsZScqEU
Прикладное целеводство — https://youtu.be/YNCCEy4BJY8
Сбалансированная разработка в очень больших командах — https://youtube.com/watch?v=1U4NrB9v9ZA&t=211s
Вам нужен крутой разработчик. Нам — тоже — https://youtu.be/7VeMq9-z7zQ

Завтра, 29 мая, на CodeFest расскажу, как в Яндексе устроена монорепа и как в ней живет фронтенд: https://11.codefest.ru/lecture/1757

А пока приглашаю послушать обсуждение в подкасте Веб-стандартов: https://web-standards.ru/podcast/281/

Ссылки к докладу про монорепу Яндекса https://11.codefest.ru/lecture/1757

Инструменты для организации монорепы:
lerna — https://lerna.js.org/
yarn workspaces — https://yarnpkg.com/features/workspaces
npm workspaces — https://docs.npmjs.com/cli/v7/using-npm/workspaces
pnpm — https://pnpm.io/ru/
Rush — https://rushjs.io/

Углубиться в теорию: https://trunkbaseddevelopment.com/monorepos/

Еще послушать и посмотреть:
Дискуссия про монорепу Яндекса в подкасте Веб-стандарты — https://web-standards.ru/podcast/281/
Доклад Азата Разетдинова «Разработка в монорепозитории» — https://www.youtube.com/watch?v=Xg-oZp0EcYc&t=19354s (расшифровка на Хабре: https://habr.com/ru/company/yandex/blog/469021/)
Доклад Михаила Трошева «Монорепозитории и где они обитают» — https://www.youtube.com/watch?v=yW2pg7__a0o

Твит Дениса Стебунова про стереорепы — https://twitter.com/dstebunov/status/1360224059125075968

Приходите в чат, скоро начинаем там голосовую трансляцию секции вопросов / ответов после доклада.

Предполагаю, что она плавно перетечет в формат AMA, где можно будет обсудить любые вопросы про разработку фронта в Яндексе: технологии, команды, процессы, собеседования, продукты, буткемп, etc.

Ссылки к докладу «О том, как в Яндексе в очередной раз переосмыслили универсальную библиотеку компонентов» на Кодишь 2.0 в Брянске — https://кодишь.рф
1. История одной кнопки, Варя Степанова и Лена Грухова, 2012 — https://www.youtube.com/watch?v=9yWvUCu8xF0
2. История одной кнопки, Руслан Муфтиев, 2017 — https://www.youtube.com/watch?v=Bmfk5uJIwdI
3. Библиотека компонентов bem-components, 2011 — https://github.com/bem/bem-components
4. Библиотека React-компонентов yandex-ui, наши дни — https://github.com/bem/yandex-ui
5. ThemeKit для темизации компонентов — https://github.com/bem/themekit
6. Визуальное управление дизайн-токенами yandex-ui — https://github.com/bem/yandex-ui-themer
7. Плагин для рендеринга HTML в виде figma-фреймов — https://github.com/sergcen/html-to-figma
8. Доклад Сереги Савельева с Я.Субботника по дизайну про синхронизацию кода с figma — https://youtu.be/XodsibsITBE?t=1820
9. Веб-платформа — https://github.com/bem/web-platform

Через 10 минут начинаем Я.Субботник по интерфейсам. Расскажу про Аркадию — монорепу Яндекса.

Подключайтесь! https://www.youtube.com/watch?v=y7FG9IkQBrI

Прямо сейчас на Я.Субботнике Pro по интерфейсам https://yandex.ru/promo/events/generated/ya-subbotnik-pro-po-razrabotke-i/index обсудим проблемы создания библиотеки UI компонентов в 2021.

Трансляция и видео здесь: https://youtu.be/_EwMMsetuDA, а ниже традиционные ссылки к докладу.

1. История одной кнопки, Варя Степанова и Лена Грухова, 2012 — https://www.youtube.com/watch?v=9yWvUCu8xF0
2. История одной кнопки, Руслан Муфтиев, 2017 — https://www.youtube.com/watch?v=Bmfk5uJIwdI
3. БЭМ — https://ru.bem.info/methodology/
4. CSSO — https://github.com/css/csso
5. borschik — https://github.com/borschik/borschik
6. Доклад Виталия Харисова про единые термины между разработчиками и дизайнерами, 2013 — https://events.yandex.ru/events/yasubbotnik/riga-apr-2013?openTalkDescription=163-2
7. Шаблонизатор bem-xjst — https://github.com/bem/bem-xjst
8. Утилита для визуального регрессионного тестирования — https://github.com/gemini-testing/hermione
9. Библиотека компонентов bem-components, 2011 — https://github.com/bem/bem-components
10. bem-react — https://github.com/bem/bem-react
11. Библиотека React-компонентов yandex-ui, наши дни — https://github.com/bem/yandex-ui
12. ThemeKit для темизации компонентов — https://github.com/bem/themekit
13. Визуальное управление дизайн-токенами yandex-ui — https://github.com/bem/yandex-ui-themer
14. Плагин для рендеринга HTML в виде figma-фреймов — https://github.com/sergcen/html-to-figma
15. Доклад Сереги Савельева с Я.Субботника по дизайну про синхронизацию кода с figma — https://youtu.be/XodsibsITBE?t=1820
16. Веб-платформа — https://github.com/bem/web-platform

Через 3 минуты начинаем новогодний Я.Субботник: https://www.youtube.com/watch?v=zN2SENJu6Ns

Я буду выступать в 12:55 и расскажу о том, нужно ли становиться руководителем, как им стать и что делать дальше.
При подготовке доклада я использовал 10 лет опыта и вот этот mind map.

Сегодня 12-й CodeFest!

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

Ссылки, упоминаемые в докладе:
1. PCI DSS — https://www.pcisecuritystandards.org
2. 3-D Secure — https://habr.com/ru/company/dsec/blog/517268/
3. use-platform — https://github.com/use-platform/use-platform
4. Доклад Жени Тропина про use-platform — https://www.youtube.com/watch?v=0LuKoLJ3zbU&list=PLKaafC45L_SSj9alzlF_saWXX-4GpjXRD&index=1
5. ThemeKit для темизации компонентов — https://github.com/bem/themekit
6. Визуальное управление дизайн-токенами yandex-ui — https://github.com/bem/yandex-ui-themer
7. react-aria и react-spectrum от Adobe: https://react-spectrum.adobe.com/react-aria/index.html, https://github.com/adobe/react-spectrum

Наконец-то смонтировал первый выпуск рубрики «Как ты кодишь?» с Вовой @tadatuta!

Его Твиттер, канал в Телеграме и конфиги из видео.

Давно здесь не было постов. Но появился отличный повод — выступаю на Kolesa Conf с рассказом, как у нас в Яндекс ID автоматизирована работа с интернационализацией:

«Как поддерживать интерфейс на разных языках и (почти) не вспоминать об этом»

Иногда i18n воспринимают только как способ перевести тексты. Но все гораздо сложнее — нужно учитывать культурные особенности разных стран (формат чисел, дат, времени, локализовать единицы измерения, учитывать направление текста при подготовке иллюстраций и так далее). Очень сложно изучить все подобные различия и их поддерживать. Но о нас позаботились и большая часть проблем решена на уровне стандартов:
* Unicode CLDR Project
* International components for Unicode
* Intl

А чтобы было еще удобнее, над базовыми решениями написаны верхнеуровневые библиотеки:
* FormatJS
* Lingui

Остается только выбрать подходящие инструменты и не забывать вовремя использовать. Но «не забывать» — это человеческий фактор.

Мы решили от него избавиться и придумали плагин для eslint, который находит все непереведенные строки в интерфейсе и автоматически их оборачивает в вызов i18n().

Опубликовал код плагина, чтобы вы могли вдохновиться и написать что-то подобное для вашего проекта:

https://github.com/tadatuta/eslint-plugin-wrap-i18n

А для полного счастья можно еще прикрутить проверку орфографии и типограф:
* CSpell — проверка орфографии в коде
* Типограф — автоматическое исправление типографики (неразрывные пробелы, длинное тире, правильные кавычки и т.д.)

А вот и видео с доклада: https://youtu.be/SewJDOwl5Bk?si=p4-IkSXousRNp5q8

Главное — чтобы в кайф!

Канал существует с 2020, но откровенно говоря, жизни в нем не было. С сегодняшнего дня это меняется. Так что давайте знакомиться.

Меня зовут Владимир Гриненко. Я предприниматель, основатель EdTech-стартапа grinenko.pro, ex-CTO Яндекс ID.

За плечами опыт создания веб-студии и 15 лет работы в Яндексе в разных продуктах на самых разных ролях — от разработчика главной страницы, техноевангелиста и участника opensource-сообщества до технического руководителя целого сервиса.

Все это время я регулярно выступаю (практически везде, от Австралии до Израиля) и участвую в программных комитетах IT-конференций. Преподавал в Школе разработки интерфейсов Яндекса еще с тех пор, когда названия такого не было, был автором и ментором в Практикуме, участвовал в роли эксперта в Школе спикеров Яндекса.

Сейчас выстраиваю сразу три проекта:
1. Собственную онлайн-школу
2. Лабораторию ИИ для бизнеса
3. Агентство онлайн-маркетинга

О чем буду писать?
Про переход из найма в свое дело и про то, как ИИ меняет правила игры. Будем обсуждать нейронки, вайбкодинг и то, как технологии экономят деньги и нервы.

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

Открыт к предложениям по выступлениям и консалтингу — пишите!

Через полчаса в 15:30 Мск на Я 💛 Фронтенд расскажу, что на самом деле важно в разработке.

Подключайтесь к трансляции и делитесь с друзьями:
https://www.youtube.com/live/Da3cJi7RDPg?t=16632s

@devspotting

Поговорили с Жанной Кругловой, ведущей подкаста «Быть CTO», о том, как AI всё меняет и ничего не меняет в управлении командой разработчиков:

* Смотреть на YouTube
* Смотреть на VK

@devspotting

Какой смысл учиться программированию, если завтра нейронки будут делать любую работу лучше людей?

В кулуарах ЯЛФ обсуждал эту тему с Сергеем veged Бережным — директором по взаимодействию с разработчиками и новым CTO Яндекс Практикума. Для нас обоих это максимально актуально — оба занимаемся EdTech — он внутри Яндекса, я самостоятельно.

Серега сформулировал отличную аналогию, которая мне очень понравилась: компьютеры давно победили человека в шахматах без единого шанса на реванш. Но люди ведь не перестали учиться играть.

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

Я точно продолжу программировать, даже если за это перестанут платить.

А как вы видите будущее разработки?

@devspotting

Как же прекрасен Tailwind! Viento en popa!

Как человек, который много лет был разработчиком и амбассадором БЭМа, я не перестаю удивляться успеху Tailwind.
Ребята взяли все лучшие практики и... сделали наоборот!

Я искренне пытался понять, в чем прикол. Почитал документацию, посмотрел обзоры, но ничего не помогает.

Если кому-то повезло все пропустить, то вот краткая справка:

1. Придумываем новый DSL поверх нативного CSS, но с ограниченной выразительностью.

2. Вместо разделения структуры и представления максимально все перемешиваем. По пути лишаемся возможности кэшировать стили, которые обычно меняются реже, чем разметка.

3. Полностью избавляемся от семантики, чтобы, глядя в разметку, нельзя было догадаться, что же это за сущность. Зато сам объем разметки вырастает в разы.

4. Тем, кому изучения нового «языка» для стилизации недостаточно, предоставляется прекрасная возможность изучить еще и дополнительный тулинг для сборки.

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


Поздравляю, у нас получился Tailwind!

Однако практически все современные AI-инструменты генерируют код с Tailwind CSS по умолчанию начиная от специальных сервисов вроде v0.dev от Vercel или Lovable и заканчивая SOTA-моделями в родной обвязке — если попросить Opus 4.6 в Claude Code или GPT-5.3-Codex в Codex app сгенерировать сайт, то с огромной долей вероятности вы получите React + Tailwind.

Где мы свернули не туда?

Понятно, что нейронке чуть проще генерировать код, где исключается влияние каскада, но ведь БЭМ никуда не делся!

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

Отдельно забавно, что как только LLM стали генерировать пригодный для продакшена код, Адам Ватан — основатель Tailwind — уволил большую часть своих разработчиков из-за «жесткого влияния AI на наш бизнес».

Как вы думаете, чему история про Tailwind учит нас и что говорит об отрасли в целом?

@devspotting

Как вайб-кодить на топовых нейронках бесплатно

Пока фронтир-лаборатории жгут инвесторские миллиарды, чтобы вас заполучить — настало лучшее время для вайб-кодинга (или контекст-инженерии — кому что больше нравится). Напоминает времена, когда Яндекс и Убер дотировали поездки на такси, а маркетплейсы и до сих пор иногда доплачивают за ваши покупки.

Ну вот и славно, давайте разберемся, как воспользоваться этим аттракционом невиданной щедрости.

Этим постом начинаю серию про программирование без написания кода руками, буду собирать под тегом #vibe.

Мой отсортированный топ прямо сейчас:

1. Antigravity.
Определенно мой фаворит на текущий момент. Гугл пустился во все тяжкие, чтобы догнать Claude Code и Codex.

Free tier предоставляет бесконечный таб-комплишен (он правда ОЧЕНЬ крутой, если вы все-таки решите писать код руками!), квоту на Gemini 3 Pro (High и Low), Gemini 3 Flash, GPT-OSS и, внезапно, SOTA-модели от Антропик: Sonnet и даже Opus 4.6. То есть они буквально платят за вас своему прямому конкуренту, еще и более сильному.

Есть нюанс: нужен аккаунт страны из поддерживаемого списка (список большой, но РФ и РБ в него не входят). Зато при наличии нескольких аккаунтов можно не переживать о квоте.

Я потестировал бесплатный акк и в итоге купил за ~1k руб пиратскую подписку на 6 месяцев на plati.market. Здесь помимо перечисленного становятся доступны Nano Banana, Stitch, NotebookLM и даже квота на Gemini API для использования LLM внутри ваших приложений.

Дисклеймер: совершенно не факт, что Гугл завтра не прикроет лавочку и не забанит все такие аккаунты, но пока полет нормальный.

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

2. Codex app.
Здесь на текущий момент есть бесплатная квота GPT-5.3-Codex (в том числе в режиме Extra High). Подходит любой аккаунт OpenAI, но тоже придется телепортироваться в подходящую страну.

3. Kilo Code
Сейчас бесплатно доступны китайские SOTA-модели GLM 5 и MiniMax M2.5.

4. Бесплатные модели через OpenRouter.
Можно использовать, например, в Codex CLI.
Здесь нужно один раз положить $5 на счет и далее пользоваться бесплатными квотами (например, сейчас доступна MiniMax M2 и другие китайцы). Как обычно — потребуется зарубежная карта.

Этого списка с головой хватит, чтобы разрабатывать серьезные проекты.

👇 Делитесь вашим опытом — чем сейчас пользуетесь и какие связки работают у вас?

UPD: в комментариях рекомендуют и другие хорошие варианты.

@devspotting