Это тестовое задание рассчитано на начинающих frontend разработчиков. Целью задания является демонстрация того, как использование фреймворка может упростить процесс разработки веб-приложения, в частности, благодаря Component Based Architecture (CBA).
Все мы видели страницы, на которых есть хедер, футер, возможно сайдбар и непосредственно тело страницы. В то же время, в приложении могут быть страницы без дополнительных элементов, например страница печати. Это подталкивает нас к тому, что должен быть способ создания структуры страницы из небольших, автономных модулей, каждый из которых может быть использован неоднократно и в разных местах приложения. Об этом собственно и гласит CBA.
Следовать принципам CBA без использования фреймворка можно, но хлопотно. Именно поэтому, выполнение тестового задания предусмотрено с использованием любого современного фреймворка, например, Angular, React, Vue.js. Основным заданием будет разработка набора компонентов для создания различных конфигураций страниц веб-приложения.
Требования
- Создать следующие компоненты:
- Хедер (header)
- Футер (footer)
- Каждый компонент должен быть разработан с учетом принципов переиспользования и расширяемости.
- Создать страницу “Dashboard”с использованием компонентов header и footer.
- Создать страницу для печати “Print” без использования компонентов header и footer.
- Проверить возможность легкого изменения содержимого хедера и футера без изменения других частей приложения. В хедер можно добавить навигацию, а в футер блок “Контакты”
- Испытать возможность расширения функциональности компонентов без изменения их основного кода. В хедер можно добавить кнопку Logout
Опционально – компоненты должны быть стилизованы и адаптивны для различных устройств.
Тестовые сценарии
Для проверки своей работы используйте следующие тестовые сценарии.
- Проверьте отображения компонентов страницы «Dashboard» согласно требованиям. Должен быть хедер и футер.
- Проверьте отображения компонентов страницы «Print» согласно требованиям. Только тело страницы без хедера и футера.
- Убедится в возможности легкого изменения содержимого компонентов без изменения других частей приложения.