Проект веб-приложения на Next.js 15 с искусственным интеллектом — создайте приложение , Neon, Clerk

Описание: Проект веб-приложения на Next.js 15 с искусственным интеллектом — создайте Full Stack приложение с Tailwind, Neon, Clerk и OpenRouter

Добро пожаловать обратно на канал!
В этом видео я покажу, как создать полноценное AI-веб-приложение, используя новейшие технологии: Next.js 15, Tailwind CSS, Neon (PostgreSQL), Clerk для аутентификации и OpenRouter для бесплатной интеграции искусственного интеллекта — всё это будет развернуто на Vercel совершенно бесплатно.

👩‍💻 Изучи программирование (скидка 20% на Pro)
https://scrimba.com/s0fg0h412l?via=re...

✅ Основные функции:

Безопасная авторизация через Google, GitHub, Facebook или электронную почту (Clerk)

Категоризация на основе ИИ с использованием естественного языка

Интерактивная аналитика в реальном времени с Chart.js

Поддержка светлой и тёмной темы

Персонализированные инсайты с оценкой уверенности и умными подсказками

Полностью адаптивный дизайн с современными UI-компонентами

Плавные анимации при удалении и мгновенные обновления

Страницы «Контакты» и «О проекте»

Развёртывание без серверов на Vercel

🧠 Создано с использованием:

Next.js 15 (App Router + Server Actions)

Tailwind CSS

Neon + Prisma для базы данных

Clerk для аутентификации

OpenRouter для AI-функций (без необходимости банковской карты)

Vercel для масштабируемого и бесплатного развёртывания

💡 Идеально подходит для:
Всех, кто изучает Full Stack-разработку или хочет создавать AI-приложения без начальных затрат.

📎 Полезные ссылки:
Neon → https://get.neon.com/0pFcBSF

Clerk → https://go.clerk.com/wsJiD3K

GitHub репозиторий → https://github.com/sahandghavidel/nex...

Диаграмма Eraser → https://app.eraser.io/workspace/XhlJP...

Next.js → https://nextjs.org

Tailwind CSS → https://tailwindcss.com

Vercel → https://vercel.com

Если вам нравятся подобные проекты, не забудьте поставить лайк 👍, подписаться и включить уведомления 🔔, чтобы не пропустить следующий выпуск, где мы создадим базовый макет и настроим среду разработки.

#nextjs #aiapplications #tailwindcss #fullstackdevelopment #clerk #vercel #openrouter

⏱ Таймкоды:
00:00 — Введение
03:18 — Установка Next.js и Tailwind CSS, создание первого шаблона
15:16 — Установка Neon и Prisma
28:48 — Добавление аутентификации Clerk
40:34 — Завершение Navbar и страниц Guest, About и Contact
59:05 — Добавление функции добавления записей
01:19:12 — Добавление графика на панель
01:29:25 — Завершение компонента статистики
01:38:52 — Завершение компонента AI Insight
01:49:37 — Завершение истории записей
01:56:15 — Развёртывание на Vercel