# Family Budget - Frontend

Фронтенд приложение для управления семейным бюджетом.

## Технологии

- React 19
- TypeScript
- Vite
- React Router DOM
- Zustand (state management)
- Axios (HTTP client)
- Tailwind CSS

## Структура проекта

```
frontend/
├── src/
│   ├── api/           # API клиент для общения с бэкендом
│   ├── pages/         # Страницы приложения
│   ├── store/         # Zustand store
│   ├── types/         # TypeScript типы
│   ├── App.tsx        # Главный компонент с роутингом
│   └── main.tsx       # Точка входа
├── .env               # Переменные окружения
└── package.json
```

## Установка и запуск

1. Установите зависимости:
```bash
cd frontend
npm install
```

2. Настройте переменные окружения в `.env`:
```
VITE_API_BASE_URL=http://localhost:3000
```

3. Запустите dev сервер:
```bash
npm run dev
```

4. Соберите production версию:
```bash
npm run build
```

## Страницы

### Главная страница (`/`)
- Выбор семьи из списка
- Кнопка для перехода в админ панель

### Страница семьи (`/family/:familyId`)
- Отображение всех категорий семьи
- Показ оставшегося баланса для каждой категории
- Добавление расходов (вычет из остатка)
- Добавление новых категорий
- Удаление категорий
- Сброс лимита категории

### Админ панель (`/adminpanel`)
- Авторизация администратора
- Создание новых семей
- Удаление семей
- Выход из админки

## API Endpoints

Все запросы отправляются на бэкенд через Axios клиент (`src/api/client.ts`):

- **Auth**: `POST /login`, `POST /logout`
- **Families**: `GET /families`, `POST /families`, `DELETE /families/:id`
- **Categories**: `GET /families/:id/categories`, `POST /families/:id/categories`, etc.
- **Expenses**: `GET /families/:id/categories/:id/expenses`, `POST /families/:id/categories/:id/expenses`, etc.

## Учетные данные по умолчанию

Согласно бэкенду, дефолтный админ:
- Username: `admin`
- Password: `2123`

## State Management

Используется Zustand для управления глобальным состоянием:
- `isAdmin` - флаг авторизации администратора
- `selectedFamily` - выбранная семья
- `families` - список всех семей
- `categories` - категории текущей семьи