IndigoSoft Тестовое задание для Senior Frontend Developer

Конфигуратор карточек пользователей

Цель

Проверить, насколько кандидат:

• Понимает SOLID и умеет строить расширяемую архитектуру.
• Владeет декларативным подходом к написанию Angular-приложений.
• Умеет работать с ngTemplateOutlet и шаблонами.
• Умеет писать переиспользуемые контролы через ControlValueAccessor.

Задание

Создать мини-приложение на Angular 19+, которое отображает список пользователей и позволяет их редактировать.

Основной функционал

1. Список пользователей

• Компонент UserListComponent отображает карточки пользователей.
• Для каждого пользователя выводятся поля:
  name, age, email, role.
• У карточки должна быть кнопка “Редактировать”.

2. Редактор пользователя

• При клике “Редактировать” открывается модальное окно или боковая панель с формой редактирования.
• Форма должна быть построена на Reactive Forms.
• Поля формы:
  • Имя (name) — input
  • Возраст (age) — number input
  • Email (email) — input
  • Роль (role) — select
• Кнопки: “Сохранить” / “Отмена”.

3. Переиспользуемые поля

• Создать минимум два компонента, реализующих ControlValueAccessor:
  • <app-input-field>
  • <app-select-field>
• Эти компоненты должны работать с formControlName и не зависеть от конкретной формы.

4. Гибкость через ngTemplateOutlet

• Компонент UserListComponent должен позволять переопределять шаблон карточки пользователя

Технические требования

• Angular 19+
• Standalone Components (без NgModule)
• Change Detection: OnPush
• RxJS
• Можно использовать signals (по желанию)
• Без сторонних UI-библиотек (разрешено использовать Angular Material для модального окна, если нужно)

Дополнительно (по желанию)

• Добавить фильтр по роли пользователей.
• Покрыть один-два компонента unit-тестами.
• Можно использовать какой-то публично доступный API

Что нужно прислать

• Ссылку на репозиторий (GitHub/GitLab/Bitbucket).

Ожидаемый результат

• Рабочее Angular-приложение с декларативной архитектурой.
• Переиспользуемые компоненты ввода.
• Гибкая структура кода, демонстрирующая инженерный подход.

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

Срок выполнения

Тестовое задание оценивается на 4-6 часов. Срок выполнения вы устанавливаете самостоятельно — исходя из вашей текущей занятости. Пожалуйста, обозначьте предполагаемую дату выполнения сразу после ознакомления с заданием в ответном сообщении.