nik7a / mavis_frontend Goto Github PK

Сделать компонент для формы регистрации, в соответствии с макетом:

NB:

• Боковую панель пока не верстаем, будет отдельно задачкой
• Обрати внимание что такие блоки есть и на других страницах, давай делать все сразу переиспользуемым

Интерфейс:

• onSubmit - функция на вход которой поступают значение всех полей
• onChange - функция со следующими аргументами: (fieldName, value)
• values - значения для формы
• aside - реакт компонент, который отображается сбоку,

Поведение:
если aside не подан на вход, ничего там не рисуем

Нужно разработать компонент для навигации в соответствии с макетом:

Интерфейс компонента:

• items - массив с элементами следующей структуры {title: строка, link: строка}

Разработать промо блок, в соответсвии с макетом:

Пропсы:

• children - reactNode

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

Поведение:
Делаем так чтобы стандартные тэги (без классов в рамках этого блока выглядели как на макете), внутрянку верстаем тегами без классов

Нужно разработать компонент header, в соответствии с макетом:

Пропсы компонента:

• instagramUrl - строка
• vkUrl - строка
• title - строка
• phone - строка
• children - реакт нода

NB:
Меню верстать не надо, оно будет сделано в отдельной задачке (следующей)

Поведение:

1. если instagramUrl или vkUrl не прокинуты, то соответсвующая иконка не должна отображаться

2. children должен прибиваться к низу компонента, в дальнейшем мы будем туда прокидывать меню, как-то так <Header><Navigation items={...}/></Header>

стратануть фронтенд проект:

• стартуем на базе CRA
• стили css-modules + postcss
• storybook - для разработки компонентов в песочнице

Нужно сделать input контрол в стилях приложения.

• создай input компонент и сторю для него, как это сделано для кнопки
• интерефейс для новго компонента:
  -- value - строка
  -- onChange - фнкция
  -- className - строка
  -- size - значение из констант