Создание доступного DatePicker с ИИ: два подхода

Создание DatePicker-компонента, который корректно взаимодействует с навигацией клавиатурой, экранными ридерами и имеет управляемое состояние, представляет собой нетривиальную задачу. Особенно это касается стандартов доступности WCAG, требующих тщательной проработки деталей. В контексте React и TypeScript такую задачу можно решать по-разному, в том числе с помощью инструментов искусственного интеллекта.

Искушение 80/20: ИИ как генератор кода

Первый подход, который приходит на ум, — поручить ИИ генерацию большей части кода. Идея проста: дать системе четкий запрос и получить 80% готового решения, а оставшиеся 20% доработать вручную. На первый взгляд, это кажется эффективным:

• Модель может создать базовую структуру календаря.
• Сгенерировать ARIA-атрибуты.
• Реализовать базовую навигацию клавиатурой и логику работы с датами.

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

Системное проектирование с ИИ-агентом

Второй, более системный подход предполагает использование ИИ-агента на каждом этапе проектирования и разработки. Вместо простой генерации кода, ИИ-агент интегрируется в весь процесс:

• Разработка Product Requirements Document (PRD).
• Декомпозиция задач.
• Установление правил для агента.
• Внешняя верификация.
• Использование инструментов тестирования, таких как Vitest и Playwright.
• Сборка с Vite и строгие проверки типов.

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

Роль инженера в эпоху ИИ

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

• Контроль над замыслом.
• Архитектурное проектирование.
• Определение контрактов.
• Оценка стоимости изменений.

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

Источник: Хабр