Project requirements

📝 Задание

Спринт 1

• Сверстать главную страницу по выбранному psd-макету
  • основной контент главной страницы должен быть веб-компонентом, который можно заменить другим веб-компонентом для имитации межстраничных переходов
• Сверстать панель навигации
• Сверстать веб-компоненты, отображаемые при переходах пользователя по "страницам" приложения
• Обеспечить отображение соответствующего компонента при выборе соответствующего пункта в панели навигации

Спринт 2

• Установить json-server
• Создать базу данных зарегистрированных пользователей
• Создать веб-компонент register-user регистрации пользователя
  • Форма регистрации должна содержать кнопку для загрузки аватара пользователя
    • при загрузке изображения должен проверяться тип файла ( это должен быть только файл изображения ), а так же его размер
    • в случае, если пользователь выбрал файл, не являющийся изображением, должно выводиться предупреждение
    • в случае, если размер изображения превышает 300 Кбайт, должно выводиться предупреждение
    • если тип файла и размер изображения отвечают требованиям, аватар загружается и отображается в форме регистрации
  • При регистрации нового пользователя
    • аватар кодируется строкой Base64
    • пароль хешируется
    • данные сохраняются в базе данных
    • данные для аутентификации пользователя сохраняются в куки
  • веб-компонент должен удаляться при клике на кнопке ✖ или кнопке "Зарегистрировать" ( стиль кнопок должен быть согласован с макетом страницы )
  • если в куки-файле уже есть данные пользователя, форма заполняется этими данными ( кроме пароля )

Спринт 3

• Создать веб-компонент user-sign-in аутентификации зарегистрированного пользователя посредством ввода логина и пароля
• Вставить код, запускаемый сразу после загрузки главной страницы
  • Код должен читать куки ( если они есть ), и проверять, что такой пользователь зарегистрирован в базе данных
  • Если пользователь зарегистрирован, его аватар и никнейм добавляются на главную страницу
  • Если пользователь не зарегистрирован ( куки отстутствуют или пользователь не обнаружен в базе данных ), то на главной странице должны отображаться кнопки "Регистрация" и "Вход"
  • Обработчик события click кнопки "Регистрация" должен отображать веб-компонент register-user
  • Обработчик события click кнопки "Вход" должен отображать веб-компонент user-sign-in

Спринт 4

• Напилить код, логирующий действия пользователя
  • лог должен сохраняться в localStorage
  • в логе должна быть как минимум информация о последней посещенной пользователем "странице"
  • после аутентификации пользователя должен происходить переход на последнюю посещенную им страницу

Спринт 5

• Создать веб-компонент admin-panel *

---

🎨 Варианты psd-макетов