Конечный результат

Приложение шифратор, в котором можно шифровать и дешифровывать информацию, в котором валидация полей для отправки результата через кнопки написано в самих компонентах а отправка запроса на сервер выполняется через Redux.

План решения

1. Поменять порт на 666 чтобы не возникало конфликтов с бэкенд приложением.

2. Установить axios и Redux с типами прописав команды "npm install --save axios react-redux redux @reduxjs/toolkit" и "npm install -D @types/react-redux @types/redux".

3. Установить модуль Prettier локально в проект и настроить Eslint и Prettier.

4. Создать "axiosClient.ts" чтобы не повторяться в коде при запросах.

5. Настроить store, для того чтобы логику можно было передавать через него в requestSlice.

6. Добавить лоадер.

7. Создать файл requestSlice и написать в нем логику передачи данных в Api и сделать так чтобы снизу главной страницы появлялся лоадер.

8. Обернуть главный компонент (app/page.tsx), компонентом Provider.

9. Прописать в главной компоненте валидацию полей, чтобы не отправлять что попало.

10. Проверить работу приложения и взаимодействие фронтенда с бэкендом

Мотивация

Написание бизнес логику в приложении для шифрования и дешифрования по  методу шифрования Вегнера. Повторение компонентов React, Redux и практика работы в команде с помощью веток в gitlab.

Критерии приёмки

При отправке сообщений снизу виден ползунок. Пустые поля "Encoded message" и "Decoded message" не отправляются, выдают ошибки о том что надо заполнить поле, если не заполнено поле пароля, выдает ошибку о том что надо его заполнить. Сообщение которое было зашифровано паролем, можно с тем же паролем дешифровать, и результат будет так же как при первой отправке.