# HR AI Frontend Современная платформа для поиска работы с искусственным интеллектом, построенная на Next.js и TypeScript. ## Возможности - 📋 Просмотр списка вакансий с поиском и фильтрацией - 🔍 Детальная информация о каждой вакансии - 📄 Загрузка резюме с уведомлением о подготовке сессии собеседования - 🔐 Авторизация через cookie-сессии (без JWT) - 🎨 Современный и адаптивный дизайн - ⚡ Быстрая загрузка и отзывчивый интерфейс ## Технологический стек - **Framework**: Next.js 14 (App Router) - **Language**: TypeScript - **Styling**: Tailwind CSS - **Icons**: Lucide React - **HTTP Client**: Fetch API с cookie-авторизацией ## Быстрый старт 1. Установите зависимости: ```bash yarn install ``` 2. Создайте файл `.env.local` (уже создан): ```env NEXT_PUBLIC_API_BASE_URL=http://localhost:8000 ``` 3. Запустите development сервер: ```bash yarn dev ``` 4. Откройте [http://localhost:3000](http://localhost:3000) в браузере ## Структура проекта ``` ├── app/ # Next.js App Router │ ├── globals.css # Глобальные стили │ ├── layout.tsx # Корневой layout │ ├── page.tsx # Главная страница (список вакансий) │ └── vacancy/[id]/ # Страница детальной информации о вакансии ├── components/ # React компоненты │ └── ResumeUploadForm.tsx ├── lib/ # Утилиты и API клиент │ └── api-client.ts ├── types/ # TypeScript типы │ └── api.ts └── public/ # Статические файлы ``` ## API Integration Приложение интегрируется с HR AI Backend API: ### Основные эндпоинты: - `GET /api/v1/vacancies/` - Получение списка вакансий - `GET /api/v1/vacancies/{id}` - Получение вакансии по ID - `POST /api/v1/resumes/` - Загрузка резюме - `GET /api/v1/sessions/current` - Получение информации о сессии ### Авторизация: Все запросы выполняются с `credentials: 'include'` для работы с cookie-сессиями. ## Особенности реализации ### Загрузка резюме - Поддержка файлов: PDF, DOC, DOCX, TXT - Максимальный размер файла: 10 МБ - Валидация формы перед отправкой - Уведомление об успешной отправке ### Поиск вакансий - Поиск по названию вакансии - Фильтрация активных вакансий - Красивое отображение карточек вакансий ### Детальная страница вакансии - Полная информация о вакансии - Контактные данные - Форма для отклика прямо на странице