Модуль 1 Введение в Vibecoding
Знакомство с философией «кодить через вайб» и современными ИИ-инструментами
Философия vibecoding vs классическое программирование
10 лучших ИИ-инструментов (Cursor, Claude Code, v0.dev)
Первое приложение за 10 минут
GitHub для ИИ-разработки
Результат: Простое веб-приложение, созданное с помощью ИИ за 10 минут. Понимание того, как ИИ-инструменты ускоряют разработку в 10+ раз.
Модуль 2 Мастерство Cursor
Глубокое погружение в Cursor — главный инструмент ИИ-разработчика
Установка, настройка и интеграции
Chat, Tab автодополнение, Cmd+K команды
Composer для генерации сложного кода
.cursorrules — персонализация ИИ-помощника
MCP интеграция
Результат: Полностью настроенный Cursor с персональными правилами. Уверенное владение Chat, Composer и автодополнением для продуктивной работы.
Модуль 3 Claude Code
Альтернативный мощный ИИ-инструмент для архитектуры и планирования
Возможности веб-интерфейса и Artifacts
Когда использовать Claude вместо Cursor
Генерация API, схем БД и тестов
Гибридный подход в разработке
Agent и Subagent системы
MCP интеграция
Результат: Навык выбора правильного инструмента для задачи. Сгенерированные API схемы, структура БД и архитектурные решения для будущего проекта.
Модуль 4 Современный веб-стек
Изучение технологий для создания современных веб-приложений
Архитектура современных веб-приложений
JavaScript/TypeScript экосистема
Базы данных и SQL основы
Регистрация во всех необходимых сервисах
Результат: Созданные аккаунты на всех платформах (Vercel, Supabase, Clerk, Stripe, OpenAI). Понимание современной архитектуры full-stack приложений.
Модуль 5 Настройка проекта
Настройка полного технологического стека для разработки
Next.js проект с TypeScript
Настройка Vercel для деплоя
Environment variables и секреты
Интеграция всех сервисов (Supabase, OpenAI и др)
Результат: Полностью настроенный Next.js проект с TypeScript, подключенными сервисами и автоматическим деплоем на Vercel.
Модуль 6 Бекенд
Создание серверной части приложения с базой данных
API Routes в Next.js
Drizzle ORM и PostgreSQL
Схема базы данных и миграции
CRUD операции и бизнес-логика
Результат: Рабочий бекенд с API endpoints, PostgreSQL базой данных, ORM настройками и полным набором CRUD операций.
Модуль 7 Аутентификация
Система регистрации и входа пользователей
Supabase Authentication
Email/Password регистрация и вход
Social login (Google, GitHub) через Supabase
Синхронизация пользователей с БД
Результат: Полноценная система аутентификации с email/социальными входами, синхронизация данных пользователей.
Модуль 8 База данных
Глубокое погружение в Supabase и управление данными
Supabase Dashboard и возможности
SQL Editor и Table Editor
Real-time subscriptions
Row Level Security и миграции
Результат: Настроенная Supabase БД с таблицами, real-time обновлениями, Row Level Security для защиты данных и системой миграций.
Модуль 9 Фронтенд
Создание красивого и функционального пользовательского интерфейса
Основы и роутинг — Next.js App Router и навигация — Layouts и metadata для SEO
Интерактивные компоненты — Формы с валидацией (React Hook Form + Zod) — Модальные окна и диалоги — Табы и аккордеоны — Tooltip и dropdown меню — Анимации с Framer Motion
Landing Page — Hero блок с CTA — Features секция — Pricing блок — FAQ с аккордеоном — Footer и Header — Responsive дизайн
Админ-панель (Dashboard) — Sidebar навигация — Stats cards — Таблица пользователей с сортировкой — Графики и аналитика — Notifications
Результат: Профессиональный Landing Page + Админ-панель с интерактивными компонентами, формами, анимациями и аналитикой. Всё responsive и красиво.
Модуль 10 API
Интеграция системы и внешних API
HTTP протоколы и RESTful API
Webhooks для уведомлений
Связка фронтенда и бекенда
Результат: Интеграции, webhooks для уведомлений и полная связка фронтенда с бекендом.
Модуль 11 Финальная интеграция
Связывание всех компонентов и деплоймент в production
Автоматизация с помощью ИИ
OpenAI API и стриминг
Тестирование полного приложения
Production деплой и мониторинг
Результат: Полностью работающее SaaS-приложение в production с OpenAI интеграцией, системой мониторинга и автоматическими деплоями
Модуль 12 Презентация проектов
7 мин презентация + 3 мин Q&A
Live demo основных фичей
Обратная связь от преподавателя и участников
Оценка по 5 критериям
Подведение итогов
Ретроспектива всего курса
Ключевые достижения
Планирование будущего
Индивидуальные планы развития

[BelhardAcademy] Vibecoding Вайб-кодинг