CodeX — небольшая команда энтузиастов, создающих продукты с открытым исходным кодом. Сейчас мы ищем не просто опытных, но прежде всего мотивированных людей, которые хотят развивать свои технические и продуктовые навыки и работать вместе с командой над передовыми технологиями. И которые готовы уделять достаточно времени работе в CodeX.
У нас есть пробное задание, которое поможет лучше понять ваш технический уровень и мотивацию. Оно также позволит нам познакомиться ближе и начать вашу интеграцию в рабочий процесс. В ходе выполнения задания мы будем общаться и работать вместе, и вы сможете оценить, насколько вам интересна работа в CodeX.
LLM-модели становятся всё более востребованными и интегрируются в самые разные технологические сферы и продукты. Мы предлагаем вам поработать на передовой — попробовать создать собственный интерфейс для взаимодействия с моделью. Это увлекательная задача, которая позволит разобраться в принципах работы интерфейсов для LLM, попрактиковаться в работе со стримами, парсингом Markdown, анимациями и рендерингом различных блоков. Надеемся, что в процессе выполнения задания вы узнаете что-то новое и получите полезный опыт.
Это общее задание для Frontend и Backend разработчиков.
Задача
Разработать интерфейс чата с LLM.
Минимальные требования
1. Нужно реализовать клиентскую и серверную часть
2. Для работы с LLM получите токен в чате и следуйте инструкциям
2. Запросы пользователя отображаются справа в баблах, ответы LLM — слева без фона.
3. В минимальной версии можно не делать форму отправки сообщения, а отправлять готовый промпт при открытии диалога.
4. Ответ от модели приходит в формате Markdown. Его нужно распарсить на блоки и среднерить в диалоге в соответствии с макетом.
Расширенные требования
Для тех, кому минимальная часть покажется слишком простой, есть более интересные задачки.
1. Стримы
Реализовать получение ответа в виде стрима. Анимированно отображать ответ по мере получения данных. Анимация простая: появление по словам.
2. Размышление
Реализовать пометку "Thinking": когда llm начинает думать, эта пометка появляется и запускается анимация. По мере размышлений, ниже появляется серый текст, объясняющий ход мыслей.
После завершения размышлений, серый текст скрывается. И начинает рендериться уже сам ответ.
Блок с размышлениями можно развернуть, нажав на строку со стрелочкой.
3. Форма ответа
Внизу отображается форма ответа, с помощью которой можно продолжить диалог. При скролле над формой ответа появляется градиент, который перекрывает текст.
Форму можно прокачать на ваше усмотрение: добавить авторесайз, валидацию, отправку по Enter, прикрепление файлов,.
4. Парсинг Markdown
Реализовать парсинг строки, полученной от LLM с помощью AST (Abstract Syntax Tree). Сначала строка преобразуется в AST, затем AST рендерится в приложении по блокам.
Для парсинга в AST можно использовать готовую библиотеку.
Общие требования
- Нельзя использовать готовые UI-библиотеки компонентов
- Можно использовать реактивные фреймворки
- Реализация должна в точности соответствовать макету
- Токен доступа должен храниться в переменной в файле
.envи не должен быть опубликован в открытом доступе.
Как оформить результат
- Код опубликовать в виде публичного репозитория на GitHub
- Предоставить инструкции по запуску и тестированию
Дедлайн
30 ноября 2025 года, 19:00 MSK.