История Наоборот

Интерактивный генератор забавных историй знакомства для пар.

Этот проект представляет собой веб-приложение, созданное для развлечения пар. Пользователи отвечают на серию шутливых "НЕ-вопросов" о своей совместной жизни, и искусственный интеллект генерирует на основе этих ответов уникальную, смешную и абсолютно вымышленную историю их знакомства.

---

🚀 О проекте

"История Наоборот" — это творческий эксперимент, использующий возможности генеративного ИИ для создания персонализированного и юмористического контента. Вместо того чтобы вспоминать, как всё было на самом деле, приложение предлагает пофантазировать на тему "а как бы это могло быть, если бы всё пошло не так".

Ключевая идея:

• НЕ-вопросы: Пользователи отвечают на вопросы в негативном ключе ("Где вы впервые НЕ встретились?", "Какое кодовое слово чуть НЕ стало началом вашей дружбы?"), что задаёт творческий и юмористический тон.
• AI-генерация: На основе ответов, имён, количества лет вместе и ключевых слов, AI (Google Gemini) создаёт связную и забавную историю.
• Персонализация: Пользователи могут выбирать жанр истории, добавлять ласковые обращения и ключевые слова, чтобы сделать историю ещё более уникальной.
• Сохранение и шеринг: Понравившиеся истории можно сохранить в личном кабинете и поделиться ими с друзьями.

---

🛠️ Стек технологий

Проект построен с использованием современного стека технологий для веб-разработки:

• Фреймворк: Next.js
• Язык: TypeScript
• AI: Google AI (Gemini 2.0 Flash) с использованием Genkit
• База данных и аутентификация: Firebase (Firestore & Authentication)
• UI: Shadcn/ui, Radix UI, Tailwind CSS
• Анимации: Framer Motion
• Валидация форм: React Hook Form & Zod

---

🏁 Начало работы

Чтобы запустить проект локально, следуйте этим инструкциям.

Необходимые условия

• Node.js (версия 20.x или выше)
• npm или yarn

Установка

1. Клонируйте репозиторий:

   git clone https://github.com/your-username/your-repo-name.git
   cd your-repo-name

2. Установите зависимости:

   npm install

3. Настройте переменные окружения:

   Создайте файл .env.local в корне проекта, скопировав содержимое из примера ниже.

   # .env.local.example
   
   # Ключ для Google AI (Gemini)
   # Получить можно здесь: https://aistudio.google.com/app/apikey
   GOOGLE_GENAI_API_KEY="ВАШ_КЛЮЧ_GOOGLE_AI"
   
   # Конфигурация Firebase
   # Создайте проект в Firebase Console: https://console.firebase.google.com/
   # В настройках проекта -> General, создайте Web App и скопируйте конфигурацию.
   NEXT_PUBLIC_FIREBASE_API_KEY="ВАШ_API_KEY"
   NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN="ВАШ_AUTH_DOMAIN"
   NEXT_PUBLIC_FIREBASE_PROJECT_ID="ВАШ_PROJECT_ID"
   NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET="ВАШ_STORAGE_BUCKET"
   NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID="ВАШ_MESSAGING_SENDER_ID"
   NEXT_PUBLIC_FIREBASE_APP_ID="ВАШ_APP_ID"

   Вам необходимо получить ключи от Google AI и Firebase и вставить их в файл .env.local.

Запуск

Проект требует одновременного запуска двух серверов: основного веб-приложения Next.js и сервера Genkit для работы AI.

1. Запустите сервер Genkit: Откройте один терминал и выполните команду:

   npm run genkit:dev

   Этот сервер будет обрабатывать запросы к AI.

2. Запустите веб-приложение Next.js: Откройте второй терминал и выполните команду:

   npm run dev

3. Откройте приложение в браузере: Перейдите по адресу http://localhost:9002.

---

📜 Доступные скрипты

• npm run dev: Запускает Next.js в режиме разработки с Turbopack.
• npm run genkit:dev: Запускает локальный сервер Genkit для разработки и тестирования AI-потоков.
• npm run build: Собирает продакшен-версию приложения.
• npm run start: Запускает собранное приложение.
• npm run lint: Проверяет код с помощью Next.js ESLint.
• npm run typecheck: Проверяет типы TypeScript без генерации файлов.

---

✨ Возможности

• ✅ Генерация историй с помощью AI: Создание уникальных текстов на лету.
• ✅ Пользовательская аутентификация: Регистрация и вход через Firebase.
• ✅ Сохранение историй: Пользователи могут сохранять понравившиеся истории в свой профиль.
• ✅ Просмотр сохраненных историй: Личная страница с коллекцией созданных историй.
• ✅ Адаптивный дизайн: Корректное отображение на десктопах и мобильных устройствах.
• ✅ Копирование и шеринг: Удобные кнопки, чтобы поделиться результатом.
• ✅ "Удиви меня!": Функция для автоматического заполнения полей случайными ответами.
• ✅ Восстановление сессии: Сохранение данных формы при переходе на страницу логина.