TL; DR
Мы встроили SourceCraft во все кодовые сниппеты в публикациях на Хабре. Он объяснит, что делает код. Как это работает, кому нужно и как использовать — читайте ниже.

Хабр — площадка для технических специалистов, всегда имевшая уклон в сторону IT. Поэтому в статьях много кода, который привычен хабрапользователям. Постепенно Хабр разрастается в других направлениях, и аудитория, не знакомая с разработкой, администрированием и другими, привычными для нас вещами, растёт. Авторам, которые хотят максимального охвата, иногда приходится как в статье, так и в комментариях подробно рассказывать про каждую строчку кода и описывать очевидные вещи. В итоге вместо погружения читателя в конкретную технологию или идею статья размывается описанием базовых вещей. 

За 2024 год было написано 7598 статей, в которых используются сниппеты для размещения кода, это почти 20% всех публикаций на Хабре. Код может быть труден для части читателей —   начинающих, специалистов из смежных областей или тех, кто работает на другом стеке.

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

А можно… Да, можно попросить ИИ посмотреть этот код и объяснить всё, что там написано. Именно это и делает новая фича на Хабре, которую мы разработали совместно с SourceCraft. Она даёт возможность получить комментарии с помощью ИИ-ассистента SourceCraft Code Assistant от Яндекса по коду для тех, кому этот код непонятен. Теперь авторы смогут сосредоточиться на действительно важном и в статьях будет меньше воды с объяснением базы. А начинающим, пишущим на других языках и непрограммистам будет проще разобраться в статьях с кодом.

Как же это работает?

В статьях появилась кнопка «Объяснить код с SourceCraft» — непосредственно в сниппетах с кодом.

Когда вы нажимаете на кнопку, мы отправляем запрос ИИ-помощнику на платформе SourceCraft. Помощник в качестве контекста берёт всю статью и конкретный блок кода.

Далее оверлеем появляется окно, в которое подгружается ответ нейросети с объяснением кода в контексте данной статьи.

На смартфонах и планшетах объяснение появится снизу, а на десктопе — в боковой панели.

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

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

В редких случаях ИИ всё же может ошибаться. Если вы заметили неточности, ошибки или неверную интерпретацию кода, отзыв можно отправить в техническую поддержку.

Если информации в оверлее с объяснением недостаточно или остались вопросы, можно нажать кнопку «Подробнее в SourceCraft». При её нажатии в новой вкладке откроется интерфейс SourceCraft, в который подгружается контекст из статьи и блока кода. Далее с этим можно взаимодействовать как с любой IDE с ассистентом: задавать вопросы и получать ответы.

Эта кнопка нужна тем, кому недостаточно базового описания кода. ИИ-помощнику SourceCraft Code Assistant можно задавать любые вопросы по коду, попросить адаптировать код под свою задачу или переписать его на другой язык.

Дмитрий Иванов

Руководитель платформы SourceCraft

Мы видим здесь два сценария, для которых разработали разные инструменты. Первый — быстро получить суть: для этого код объясняет в статье наш ИИ-помощник на базе Yandex AI Studio. Второй — если нужно по-настоящему поработать с фрагментом: углубиться, доработать, обсудить. Тогда пользователь одним кликом переходит на платформу SourceCraft — это среда для разработки, где можно вести диалог с полноценным ИИ-агентом, экспериментировать и сразу тестировать идеи из статьи.

Для кого?

Начинающие разработчики или специалисты смежных профессий смогут познакомиться с тем, как работает код, разобрав его по кирпичикам, а самое главное, не отвлекая авторов, которые зачастую просто не могут ответить на все комментарии. Есть надежда, что кому-то такое взаимодействие с ИИ позволит разобраться в тонкостях разработки и чему-то научиться или подкачать свои навыки.

Для тех, кто пишет на других языках. Бывает, что в статье написано нужное решение, но на неизвестном языке. Привет ИИ-агент, перепиши этот Java-код на язык Swift, а дальше я уже сам разберусь.

В статье про генерации QR-кода Генерируем и сканируем QR/BAR-коды нажимаем «Объяснить код с SourceCraft» — получаем краткое описание для понимания логики Java-кода.

Нажимаем «Подробнее в SourceCraft» и просим переписать на Swift:

Опытные разработчики могут копнуть глубже, разобравшись в неочевидных нюансах написанного кода (или мнения ИИ-помощника о нём).

Или можно открыть для себя что-то новое, наконец разобравшись с тем, что написано тут:

>>>+[[-]>>[-]++>+>+++++++[<++++>>++<-]++>>+>+>+++++[>++>++++
++<<-]+>>>,<++[[>[->>]<[>>]<<-]<[<]<+>>[>]>[<+>-[[<+>-]>]<[[
[-]<]++<-[<+++++++++>[<->-]>>]>>]]<<]<]<[[<]>[[>]>>[>>]+[<<]
<[<]<+>>-]>[>]+[->>]<<<<[[<<]<[<]+<<[+>+<<-[>-->+<<-[>+<[>>+
<<-]]]>[<+>-]<]++>>-->[>]>>[>>]]<<[>>+<[[<]<]>[[<<]<[<]+[-<+
>>-[<<+>++>-[<->[<<+>>-]]]<[>+<-]>]>[>]>]>[>>]>>]<<[>>+>>+>>
]<<[->>>>>>>>]<<[>.>>>>>>>]<<[>->>>>>]<<[>,>>>]<<[>+>]<<[+<<
]<]

В заключение

Это наш первый эксперимент с добавлением ИИ в пользовательский опыт. Мы постарались сделать так, чтобы ИИ был помощником для пользователя, а не заменял его, принося в ленту и комменты сгенерированный контент, который у вас, как мы знаем, не в почёте.

Команда разработки

Константин Арефьев — фронтенд 

Дмитрий Шитиков — бэкенд 

Артём Константинов – бэкенд/аналитика

Степан Воеводин — дизайн 

Николай Баутин — QA 

И я, Сергей Фомин, — продакт-менеджер Хабра

Расскажите в комментариях, стало ли удобнее читать статьи с примерами кода? Какие ИИ-фичи вы бы хотели видеть в будущем?