Есть крупный Nuxt 3/Vue 3/Composition API/Pinia/TypeScript проект с полностью готовой FSD-архитектурой и UI-версткой. Сейчас проект функционирует на жестко вшитых mock-данных внутри Pinia stores и не имеет единого сетевого слоя. Необходимо подготовить кодовую базу к бесшовной интеграции с бэкендом.
Задачи:
- Разработка сетевого слоя (API Client): создать централизованный инстанс $fetch или Axios с интерсепторами для прикрепления JWT-токенов авторизации, логики Refresh Token, глобальной обработки ошибок (редирект при 401, вызов toast-нотификаций при 500+).
- Редизайн Mock-системы: изолировать все хардкоженные данные, переписать логику сторов так, чтобы они обращались к API-клиенту. Переключение Mock / реальный сервер должно работать через .env переменную.
- Синхронизация контрактов (TypeScript DTOs): привести типы данных фронтенда и моковые ответы к строгому формату (1:1), ожидаемому от REST/WebSocket API бэкенда (документация и контракты будут предоставлены). Убрать использование any там, где ожидаются данные с сервера.
- Исправление SSR и security edge-cases: убрать прямые вызовы localStorage без проверок, чтобы исключить падения Nuxt при Server-Side Rendering.
- Настроить базовые Nuxt Route Middleware для защиты приватных страниц (Route Guards).
- Расставить скелетоны загрузки (есть примеры реализации в проекте, но сделаны не везде), подключить состояние загрузок и ошибок к реальному состоянию бэкенда.
Объём проекта около 110 Vue компонентов (15 разделов).
Формат: фриланс-проект.