Кроме основной страницы появились дополнительные для регистрации и авторизации пользователя. Неавторизованный пользователь попадает на страницу входа, на какой бы роут он ни пришёл, авторизованный же редиректится на основную страницу.
Емайл авторизованого пользователя отображается в шапке основной страницы. Там же имеется кнопка для выхода, после использования которой пользователь перестает быть авторизованным: требуется повторный ввод почты и пароля.
Ошибки при регистрации и авторизации сопроваждаются модальным окошком с ошибкой. Успешная регистрация так же оповещается модальным окошком.
В основной странице сервиса можно добавлять фотографии, удалять их и ставить лайки, изменять данные профиля. Подключено к серверу когорты-52. Страница адаптирована под низкие разрешения. Портировано на React, основа для разметки и таблицы стилей взяты из ранее выполненного проекта.
React-код написан с применением хуков useEffect, useState, useRef, useContext и useCallback, useHistory. Для реализации валидации форм предпринял попытку сделать кастомный хук useFormValidator. Для верификации повторного входа используется проверка JWT-токена хранящегося в локальном хранилище браузера.
В будущем можно сделать мобильную версии для новых блоков. А так же интегрировать валидацию форм в регистрацию и авторизацию.
npm run start
Кому нужен Qr код: