Вайбкодинг Гайд

📖 Что такое вайбкодинг?

Рекомендуется

🎨

No-Code

Полное отсутствие кода. Визуальные конструкторы, drag-and-drop интерфейсы, готовые шаблоны. Идеально для лендингов, сайтов-визиток и простых ботов.

⚡

Low-Code

Минимум кода для кастомизации. Визуальная разработка + возможность добавить код при необходимости. Для приложений с данными и интеграциями.

🤖

Vibe Coding

Современный подход: ИИ-ассистенты (Claude, ChatGPT) помогают создавать код, ты только описываешь задачу словами. Будущее разработки уже здесь.

🎮 Попробуй прямо сейчас!

Нажми на кнопку — увидишь, как работает вайбкодинг:

Результат появится здесь...

✅ Подготовка к тренингу

👤

Аккаунт ИИ-сервиса

Claude (claude.ai) или ChatGPT (chatgpt.com). Рекомендуется вход через Google для простоты.

💻

Операционная система

Windows или macOS — инструкция подстроится под вашу систему.

📦

Git установлен

Система сохранения истории проекта. Скачай с git-scm.com или через Homebrew (macOS).

🔧

Claude Code или Codex

Инструмент для работы с кодом. Помогает писать, менять и проверять проект.

🐙

Аккаунт GitHub

github.com — хранилище кода и публикация сайтов через GitHub Pages.

📁

Папка проекта

Создай рабочую папку (например, "Первый проект Вайбкодинг") и открой в приложении.

🔗

Связь Codex и GitHub

Авторизуй GitHub через GitHub CLI: `gh auth login` — следуй инструкциям.

🛠 Выбор инструмента

Рекомендуется

💬

ChatGPT + Codex

ChatGPT — чат с ИИ для обсуждения идей. Codex — инструмент OpenAI для работы с кодом: помогает писать, менять и проверять проект. Идеально для новичков.

🎯

Claude + Claude Code

Claude — чат с ИИ от Anthropic. Claude Code — инструмент для работы с файлами: читает файлы, пишет код и помогает собирать проект. Альтернатива ChatGPT.

📅 История развития

1990-е

Рождение RAD (Rapid Application Development)

Visual Basic (1991) и Delphi (1995) — первые визуальные среды разработки. Принцип: перетаскивание элементов вместо написания кода.

2000-е

End-User Development

Microsoft Access, Excel, SharePoint Designer. Salesforce.com (1999) — облачные CRM с конструктором приложений.

2011

Зарождение рынка low-code

Появление первых специализированных low-code платформ. Начало формирования отдельного рынка.

2014

Термин «low-code» от Forrester

9 июня 2014: аналитики Forrester Research вводят термин «low-code» в отчёте о новых платформах разработки.

2017

Признание Forbes

Forbes называет no-code/low-code «чрезвычайно разрушительной технологией», которая изменит разработку ПО.

2020-2025

Бум no-code и ИИ-революция

Пандемия ускорила цифровизацию. Gartner: 65% приложений на low-code к 2024. Рынок $25 млрд. Интеграция ChatGPT и автогенерация кода.

🚀 7 шагов к первому проекту

Шаг 1: Создай аккаунт Claude или ChatGPT

Открой claude.ai или chatgpt.com. Рекомендуется вход через Google — проще входить на разных устройствах. Проверь, что чат открывается.

Шаг 2: Оформи подписку (рекомендуется)

Claude Pro (~$20/мес) или ChatGPT Plus дают больше возможностей. Открой claude.ai/upgrade или настройки ChatGPT, выбери тариф.

Шаг 3: Установи Git

Windows: скачай git-scm.com, установи с настройками по умолчанию. macOS: открой Терминал, вставь `brew install git`. Перезапусти приложение.

Шаг 4: Установи Claude Code или Codex

Скачай приложение для своей системы. Запусти, войди в аккаунт из шага 1. Убедись, что приложение открывается без ошибок.

Шаг 5: Создай аккаунт GitHub

Открой github.com, зарегистрируйся через Google. Подтверди email через письмо. Проходи капчу внимательно с первого раза.

Шаг 6: Создай папку проекта

Создай папку (например, на рабочем столе) с названием вроде "Первый проект Вайбкодинг". Открой её в Claude Code через "Choose project" → "New project".

Шаг 7: Подключи GitHub к Codex

В Codex вставь: `gh auth login --hostname github.com --git-protocol https --web`. Открой ссылку, введи код с экрана в GitHub, подтверди авторизацию.