Tестовое задание библиотека Modsen DatePicker

Техническое задание

Необходимо реализовать библиотеку Javascript - DatePicker, для работы с различными видами календаря. Цель состоит в том, чтобы создать базовую библиотеку, которую можно настраивать и расширять.

Необходимый функционал

• Просмотр календаря
• Выбор диапазона для календаря
• Дефолтный календарь с заранее установленным диапазоном;
• Возможность выбора начала недели(с понедельника или воскресенья)
• Выбор вида календаря (по неделям, месяцам и т.д.)
• Реализовать возможность при клике на определенный день добавлять список задач и сохранять их в localStorage
• Возможность переключения на предыдущий(ую)/следующий(ую) неделю/месяц/год
• Возможность выбора максимальной даты календаря
• Возможность выбора минимальной даты для календаря
• Возможность скрывать/показывать выходные дни и выделять праздничные дни другим цветом
• Возможность перейти в календаре на введенную пользователем дату
• Стилизация календаря

Дополнительный функционал

• Развернуть приложение на хостинге (heroku, vercel)
• Настроить CI/CD, используя GitHub Actions
• Собрать проект с нуля(с настройками всех конфигов: rollup, eslint, prettier, husky)

Пример графического представления

Ссылка на макет: Макет "DatePicker".

Также проект предполагает

• Придерживаться требований по написанию и организации кода react приложения. Ссылка на требования: Требования к тестовому заданию
• Разделить библиотеку на два основных компонента: представления и логики. Для реализации логики приложения необходимо использовать порождающий паттерн программирования "Декоратор", который позволяет динамически добавлять объектам новую функциональность, оборачивая их в полезные «обёртки» (см. подробнее паттерн Декоратор). При помощи паттерна создать сервисный класс, в котором вы будете задавать конфигурацию и создавать календарь
• Настроить конфигурации babel, eslint, prettier
• Подключить и настроить бандлер Rollup для сборки проекта в библиотеку
• Подключить и настроить Storybook для проверки работоспособности вашей библиотеки
• Добавить обработку ошибок через паттерн Error Boundaries
• Добавить проверку типов в React компонентах, передаваемых параметров и подобных объектов
• Использовать алиасы для импортирования файлов
• В приложении допускается использование языка typescript
• Нельзя использовать какие-либо сторонние библиотеки

Используемые технологии

• node.js - программная платформа, основанная на движке V8 (транслирующем JavaScript в машинный код)
• babel - транспайлер, преобразующий код из одного стандарта в другой
• eslint - линтер для JavaScript кода
• yarn - менеджер пакетов
• rollup - сборщик ES-модулей
• storybook - инструмент, используемый для разработки компонентов пользовательского интерфейса в изоляции
• react - JavaScript-библиотека для создания пользовательских интерфейсов
• prop-types - набор валидаторов, которые могут быть использованы для проверки получаемых данных
• styled-components - система стилизации react компонентов
• jest — интеграционное тестирование (rtl) + unit-тестирование

Структура проекта

Структура проекта

Тестирование

Реализовать e2e тестирование c полным покрытием функционала приложения:

• Сервис для конфигурации DatePicker-компонента
• Графическое (компонент модуля и т.д.)

Полезные ссылки

React Rollup Storybook Eslint Babel Тестирование Jest Styled-components Husky