Email Verify App

Простое приложение на Next.js для отправки одноразового кода подтверждения на email и проверки этого кода.

🚀 Обзор

Приложение позволяет:

• отправлять 4-значный код на указанный email
• хранить хеш кода в базе данных PostgreSQL
• проверять код и помечать email как подтверждённый
• сохранять пользователя в таблице User при успешной верификации

📦 Технологии

• Next.js 16
• React 19
• TypeScript
• Prisma ORM
• PostgreSQL
• Nodemailer
• bcrypt

🧩 Структура

• app/page.tsx — интерфейс отправки email и ввода кода
• app/api/auth/send-code/route.ts — API для отправки кода
• app/api/auth/verify-code/route.ts — API для проверки кода
• lib/mailer.ts — конфигурация SMTP-транспорта
• lib/code.ts — генерация 4-значного кода
• prisma/schema.prisma — схема базы данных

⚙️ Установка

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

git clone https://github.com/helliong/email-verify-app.git
cd email-verify-app

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

npm install

3. Создайте файл .env на основе переменных ниже.

🔐 Переменные окружения

Создайте файл .env в корне проекта и добавьте:

DATABASE_URL="postgresql://USER:PASSWORD@HOST:PORT/DATABASE"
SMTP_HOST=smtp.example.com
SMTP_PORT=587
SMTP_USER=your_smtp_user
SMTP_PASS=your_smtp_password
EMAIL_FROM="Your App <no-reply@example.com>"

Обратите внимание, что приложение использует PostgreSQL в prisma/schema.prisma.

🛠️ Настройка базы данных

1. Создайте базу данных PostgreSQL.
2. Выполните миграции Prisma:

npx prisma migrate dev --name init

3. Сгенерируйте Prisma Client (при необходимости):

npx prisma generate

▶️ Запуск

npm run dev

Откройте http://localhost:3000 в браузере.

✅ Как работает

1. Пользователь вводит email.
2. Запрос POST /api/auth/send-code генерирует код и отправляет email.
3. Пользователь вводит полученный код.
4. Запрос POST /api/auth/verify-code проверяет код, отмечает запись как использованную и создаёт/обновляет пользователя.

📌 Дополнительно

• Код действителен 10 минут.
• Хранится хеш кода (bcrypt), а не сам код.
• После успешной проверки User.emailVerified устанавливается в true.

🧪 Команды

• npm run dev — запуск в режиме разработки
• npm run build — сборка приложения
• npm run start — запуск в production
• npm run lint — проверка ESLint

💡 Идеи для расширения

• добавить авторизацию через сессии или JWT
• добавить повторную отправку кода
• ограничить число попыток ввода
• сделать стилизацию с Tailwind CSS или другим UI-фреймворком

---

Автор: helliong