https://github.com/alex6712/elyria-web
Web-клиент романтичного приложения-подарка на 14 февраля от Лёши для Светы
https://github.com/alex6712/elyria-web
docker docker-compose frontend lucide-react motion pnpm radix-ui react sonner spa tailwindcss typescript
Last synced: 2 days ago
JSON representation
Web-клиент романтичного приложения-подарка на 14 февраля от Лёши для Светы
- Host: GitHub
- URL: https://github.com/alex6712/elyria-web
- Owner: alex6712
- License: mit
- Created: 2025-12-30T14:34:16.000Z (7 months ago)
- Default Branch: master
- Last Pushed: 2026-07-07T12:16:45.000Z (17 days ago)
- Last Synced: 2026-07-07T14:08:33.318Z (17 days ago)
- Topics: docker, docker-compose, frontend, lucide-react, motion, pnpm, radix-ui, react, sonner, spa, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://elyria.ru
- Size: 652 KB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Elyria Web Client
Веб-клиент для романтичного приложения "Elyria".
## 🚀 Быстрый старт
### 1. Настройка окружения
Скопируйте `.env.example` в `.env`:
```bash
cp .env.example .env
```
По умолчанию используется production API:
```
VITE_API_URL=https://api.elyria.ru
```
Для локальной разработки измените на:
```
VITE_API_URL=http://localhost:8000
```
### 2. Установка зависимостей
Проект использует **pnpm**. Установите зависимости:
```bash
pnpm install
```
### 3. Запуск приложения
```bash
pnpm run dev
```
Приложение будет доступно по адресу: http://localhost:4200
## 📝 Основные функции
### 🔐 Авторизация
- Регистрация новых пользователей
- Вход в систему с JWT токенами
- Автоматическое обновление токенов
### 🏠 Главная страница
- Статистика отношений
- Последние активности
- Вдохновляющие цитаты
### 📸 Медиа-галерея
- Просмотр альбомов
- Создание новых альбомов
- Загрузка фотографий (в разработке)
### 📝 Заметки
- 4 типа заметок:
- 💝 Вишлисты
- 🗺️ Мечты
- ❤️ Благодарности
- ⭐ Воспоминания
### 🎮 Мини-игры
- Викторина для пары (работает)
- Парные головоломки (в разработке)
- Игра в ассоциации (в разработке)
### 💑 Управление парой
- Отправка запросов на создание пары (по username партнера)
- Принятие/отклонение запросов
- Просмотр информации о партнере
## 🔧 Технологии
- **React 18** + TypeScript
- **Tailwind CSS v4** для стилизации
- **Radix UI** для UI компонентов
- **Lucide React** для иконок
- **Sonner** для уведомлений
- **Motion** для анимаций
## 📡 API Endpoints
Приложение использует следующие endpoints:
### Авторизация
- `POST /v1/auth/register` - регистрация
- `POST /v1/auth/login` - вход
- `GET /v1/auth/refresh` - обновление токена
- `POST /v1/auth/logout` - выход
### Пользователи
- `GET /v1/users/me` - информация о текущем пользователе
### Пары
- `GET /v1/couples/partner` - информация о партнере
- `POST /v1/couples/request` - отправить запрос на пару
- `GET /v1/couples/pending` - входящие запросы
- `POST /v1/couples/{id}/accept` - принять запрос
- `POST /v1/couples/{id}/decline` - отклонить запрос
### Медиа
- `GET /v1/media/albums` - список альбомов
- `POST /v1/media/albums` - создать альбом
- `DELETE /v1/media/albums/{id}` - удалить альбом
## 🎨 Дизайн
Приложение использует романтичную цветовую палитру:
- Градиент фона: розовый → красный → фиолетовый
- Основной цвет: красный (#EF4444)
- Акцентные цвета: розовый, фиолетовый
## 📱 Адаптивность
Приложение полностью адаптивно и работает на:
- 📱 Мобильных устройствах
- 💻 Планшетах
- 🖥️ Десктопах
## 🔒 Безопасность
- JWT токены хранятся в localStorage
- Access token используется для API запросов
- Refresh token для обновления access token
- Автоматический logout при истечении токенов
## ⚠️ Важные заметки
### Имя пользователя партнера
При добавлении партнера нужно использовать **username** (имя пользователя) партнера.
Username можно узнать у партнера в его профиле (endpoint `/v1/users/me`).
### Формат данных API
API возвращает данные в обернутом формате:
```json
{
"code": "SUCCESS",
"detail": "Success!",
"data": { ... }
}
```
Приложение автоматически обрабатывает эти обертки.
## 🐛 Troubleshooting
### Ошибка CORS
Если возникает ошибка CORS при обращении к API, убедитесь что бэкенд настроен с правильными CORS заголовками для вашего домена.
### Токены не работают
1. Проверьте что токены сохранены в localStorage
2. Проверьте что API URL правильный в `.env`
3. Очистите localStorage и войдите заново
### Альбомы не загружаются
Убедитесь что:
1. Вы авторизованы
2. API доступен
3. У вас есть права доступа к альбомам
## 📄 Лицензия
MIT License
---
**Сделано с ❤️ для одной особенной пары**