Вайб-кодинг – Telegram
Вайб-кодинг
13.5K subscribers
1.45K photos
466 videos
30 files
621 links
Авторский канал по ВАЙБ КОДИНГУ

Ссылка для друзей: https://news.1rj.ru/str/+ll3pbl442dNkZmYy

Связь: @devmangx
По контенту: @codingpepe

РКН: https://clck.ru/3RRVfk
Download Telegram
Забираем сочный промпт: «Клод, создай для меня стартап стоимостью 100 миллионов долларов, продай его, переведи деньги на мой банковский счет и сообщи мне, когда все будет готово. Не допусти ни одной ошибки».
5😁103👍65😭12
This media is not supported in your browser
VIEW IN TELEGRAM
Claude Code в связке с Three.js — это что-то с чем-то

Например, можно собрать интерактивную 3D-комнату, где на стене крутятся кликабельные видео. 😆

Вот промт:

---
Собери 3D-интерактивную виртуальную комнату, похожую на уютную гостиную-галерею. Тёплая кирпичная стена сзади как галерея, деревянный пол с большим турецким ковром, боковые стены в спокойных тёплых тонах. На одной стене — камин из камня с анимацией огня: мерцающее пламя, угли, деревянная полка и рамка с фотографией. На противоположной стене — встроенный высокий книжный шкаф, книги разных размеров и цветов. В комнате стоят элегантные латунные торшеры: два в углах сзади и ещё один высокий возле книжного шкафа. Рядом с камином — кожаное кресло с пуфом, в другом углу — лежанка с немецкой овчаркой.

Задняя кирпичная стена оформлена как галерея с плотной развеской рам разных форматов и высоты. Перемешай YouTube превью, которые при клике открывают видео в модальном окне через YouTube embed API, и персональные фото вроде [image-1], [image-2], [image-3] и так далее. Лампы должны быть интерактивными: клик — и они включаются или выключаются, свет в сцене меняется, плафоны светятся или тухнут. Камин всегда анимирован, пламя рандомно меняется, вспышки света создают тёплое свечение.

Добавь дружелюбную фичу: немецкая овчарка по имени Kylo лежит на подстилке. Кнопка вызывает собаку — она встаёт, идёт вперёд, садится и ждёт. Клик по ней — анимация поглаживания и сердечки над ней. Камера должна свободно вращаться вокруг комнаты с помощью drag-контролов и плавного демпфирования. Добавь режим правки: по клику выбираем предмет, стрелками двигаем, позиции сохраняются между сессиями.

Общий вайб — тёплый, живой, будто попал в гостиную, а не на сайт.
---


Используйте свои картинки и ссылки, чтобы подогнать под себя.
Please open Telegram to view this post
VIEW IN TELEGRAM
🫡15👍7🤯7😭1
This media is not supported in your browser
VIEW IN TELEGRAM
LSP

Language Server Protocol в Claude Code дает:

1. Мгновенную диагностику ошибок и предупреждений

2. Навигацию по коду: переход к определению, поиск ссылок и т.п.

3. Информацию о типах и документацию по символам в коде

Теперь в Claude Code есть интеллект на уровне полноценной IDE
1👍13
This media is not supported in your browser
VIEW IN TELEGRAM
Собери AI-агента Research Planner & Executor на базе Google Interactions API.

Идея: объединить Gemini 3 Pro, Gemini 3 Flash и Google Deep Research Agent в один связный флоу.

- 100% open-source
- пошаговый туториал
- готовый код

Open-source код с пошаговым гайдом
1😁4👍3
Создатель Claude Code поделился 13 лайфхаками по использованию ИИ-агента и грамотному вайбкодингу:

1/ Я запускаю 5 Claude параллельно в терминале. Нумерую табы с 1 по 5 и включаю системные уведомления, чтобы понимать, когда Claude ждёт моего ввода. (доки)

2/ Параллельно держу ещё 5–10 Claude на http://claude.ai/code, вместе с локальными сессиями. Пока кодю в терминале, часто перекидываю сессии из локала в веб (через &) или просто стартую новые в Chrome. Иногда телепортируюсь туда-обратно. Плюс каждое утро и в течение дня запускаю несколько сессий с телефона (Claude iOS app) и потом проверяю, что они сделали.

3/ Везде использую Opus 4.5 с thinking. Это лучшая модель для кода, которой я когда-либо пользовался. Да, она больше и медленнее Sonnet, но за счёт того, что её нужно меньше направлять и она лучше работает с инструментами, в итоге почти всегда получается быстрее, чем с более мелкой моделью.

4/ У нас в команде один общий CLAUDE.md для репозитория Claude Code. Он лежит в git, и вся команда несколько раз в неделю его дополняет. Каждый раз, когда видим, что Claude делает что-то не так, мы добавляем это в CLAUDE.md, чтобы в следующий раз он этого не делал.

У других команд свои CLAUDE.md. Поддерживать их в актуальном состоянии — ответственность самой команды.

5/ Во время code review я часто тегаю @.claude в PR коллег с просьбой добавить что-то в CLAUDE.md прямо в рамках PR. Для этого используем GitHub Action Claude Code (/install-github-action).

6/ Большинство сессий я начинаю в Plan mode (shift+tab два раза). Если цель — написать PR, я сначала гоняю план с Claude туда-обратно, пока он меня не устроит. Потом переключаюсь в режим авто-принятия правок, и Claude обычно делает всё с одного захода. Хороший план — это реально критично.

7/ Для всех «внутренних циклов», которые я делаю много раз в день, я использую slash-команды. Это избавляет от постоянного повторения одних и тех же промптов и позволяет самому Claude переиспользовать эти воркфлоу. Команды лежат в git, в .claude/commands/.

Например, мы с Claude используем /commit-push-pr десятки раз в день. Внутри команда использует inline bash, чтобы заранее посчитать git status и ещё пару вещей — так команда отрабатывает быстро и без лишнего диалога с моделью. (доки)

8/ Я регулярно использую несколько сабагентов: code-simplifier упрощает код после основной работы Claude, verify-app содержит подробные инструкции по e2e-тестированию Claude Code и т.д. Я думаю о сабагентах так же, как о slash-командах — это автоматизация самых частых сценариев для большинства PR.

9/ Мы используем PostToolUse hook для форматирования кода Claude. В целом он и так пишет аккуратно, а хук добивает последние 10%, чтобы потом не ловить формат-ошибки в CI.

10/ Я не использую --dangerously-skip-permissions. Вместо этого через /permissions заранее разрешаю безопасные bash-команды, которые знаю и которым доверяю. Это убирает лишние запросы разрешений. Большая часть этих настроек лежит в .claude/settings.json и шарится на всю команду.

11/ Claude Code активно пользуется всеми моими инструментами. Он ищет и пишет в Slack (через MCP-сервер), гоняет BigQuery-запросы для аналитики (через bq CLI), подтягивает логи ошибок из Sentry и так далее. Конфиг Slack MCP лежит в .mcp.json и тоже общий для команды.

12/ Для очень долгих задач я делаю одно из трёх:
(a) прошу Claude проверить свою работу фоновым агентом после завершения,
(b) использую agent Stop hook для более детерминированной проверки,
(c) использую плагин ralph-wiggum

13/ И финальный совет, пожалуй самый важный: чтобы получать реально качественный результат от Claude Code, дайте ему способ проверять свою работу. Наличие feedback-лупа легко повышает качество финального результата в 2–3 раза.

Claude тестирует каждое изменение, которое я заливаю в https://claude.ai/code с помощью Claude Chrome extension. Он открывает браузер, проверяет UI и итеративно дорабатывает код, пока всё не заработает и UX не станет нормальным.
2🤯16👍6😁2
Не запускай --dangerously-skip-permissions в домашней директории.
😁14
Можно разрабатывать приложения на React, Vue и Vite быстрее с помощью Frontend Developer Agent для Claude Code

Frontend Developer Agent — агент Claude Code для фронтенда на React, Vue и Vite. Помогает быстро собирать UI-компоненты, делать адаптивную верстку, управлять состоянием и улучшать производительность по общепринятым бест практикам.

Установка

Установи Frontend Developer Agent через Claude Code Templates CLI:

npx claude-code-templates@latest --agent development-team/frontend-developer


Агент сохраняется в .claude/agents/frontend-developer.md внутри проекта:

your-project/
├── .claude/
│ └── agents/
│ └── frontend-developer.md # ← агент здесь
├── src/
│ └── components/
├── package.json
└── README.md


Как использовать агент

Запусти Claude Code и явно укажи агент в промпте:

# Запуск Claude Code
claude


# Затем напиши промпт с указанием агента
> Используй агент frontend-developer, чтобы создать компонент Button на React с TypeScript. Компонент должен поддерживать варианты (primary, secondary, danger) и размеры (sm, md, lg).


Агент сгенерирует код с фокусом на:

- полноценный React-компонент с интерфейсом пропсов
- решение для стилизации (Tailwind CSS или styled-components)
- реализацию управления состоянием при необходимости
- базовую структуру unit-тестов
- чеклист по доступности

Примеры использования

Пример 1: создание компонента Product Card

claude

> Используй агент frontend-developer, чтобы создать компонент ProductCard с изображением, названием, ценой и кнопкой «Добавить в корзину». Сделай компонент адаптивным и доступным.


Результат: React-компонент с mobile-first дизайном, корректными ARIA-атрибутами и оптимизированной загрузкой изображений.

Пример 2: реализация управления состоянием

claude

> Используй агент frontend-developer, чтобы реализовать корзину покупок с использованием Context API. Добавь действия для добавления, удаления товаров и изменения количества.


Результат: Context-провайдер с reducerом, типизированными экшенами и кастомными хуками для доступа к состоянию корзины.

Пример 3: Vue-компонент с Vite

claude

> Используй агент frontend-developer, чтобы создать таблицу данных на Vue 3 с использованием Vite. Добавь сортировку, фильтрацию и пагинацию.


Результат: Vue-компонент на Composition API, реактивное управление состоянием через Pinia и оптимизированная конфигурация сборки Vite.

Подробнее об агентах в Claude Code смотри в официальной документации по sub-agents.
1👍14🤯5
Media is too big
VIEW IN TELEGRAM
Google Opal сделал AI-агентов доступными в один клик.

Без кода, без настройки, просто одна фраза.

Как начать →

→ Зайди на http://gemini.google.com
→ Используй личный Google-аккаунт
→ Боковая панель → Gems → New Gem → Opal
→ Напиши буквально, что именно должен делать агент

Сохрани это видео — сегодня соберёшь своего первого агента. 😈
Please open Telegram to view this post
VIEW IN TELEGRAM
👍14
Клод Код за час создал то, на что у команды Google ушел год.

И это как раз не удивляет. Удивляет другое: Google разрешает своим инженерам пользоваться Claude Code, а не заставляет всех сидеть на Gemini, Gemini CLI или Antigravity.

Дать инженерам доступ к лучшему AI-инструменту для кодинга - это, пожалуй, самое правильное управленческое решение, которое вообще можно принять. 👌
Please open Telegram to view this post
VIEW IN TELEGRAM
😁51👍18😭2
Вот объяснение, почему люди используют Claude Code вместо Cursor.
😁44🫡6😭5
This media is not supported in your browser
VIEW IN TELEGRAM
Claude Code уже и так впечатляет.

Hyperbrowser добавили ему ещё одну суперсилу.

/docs fetch <url>


Живые доки с любого сайта. Кэшируются прямо в репозитории. Доступны из терминала.

Больше никакой разработки по устаревшей документации.

Работает на базе Hyperbrowser MCP.

Быстрый старт:

Добавь Hyperbrowser MCP через .mcp.json в корне проекта,

- закинь docs.md в
.claude/commands/,

- перезапусти Claude Code,

- затем выполни:

→ /docs fetch <url>

Команда подтянет актуальную документацию и закэширует её в
.claude/cache/hyperdocs/

Подробнее про Hyperbrowser MCP: читать
Получите ключ API Hyperbrowser здесь: клик
Please open Telegram to view this post
VIEW IN TELEGRAM
👍14
This media is not supported in your browser
VIEW IN TELEGRAM
Anthropic похоронили тысячи AI-приложений ? 🤯

Claude теперь может создавать и редактировать Excel, PowerPoint и PDF прямо в браузере.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍29😁5
Media is too big
VIEW IN TELEGRAM
Знал, что Claude Code можно использовать в GitHub Actions с подпиской Pro / Max?

Настраивается элементарно:

В Claude Code: /install-github-app

После этого просто упоминаешь @Claude, и он сам разбирается с issue.

Вот пример issue и PR:

https://github.com/numman-ali/cc-mirror/issues/1
https://github.com/numman-ali/cc-mirror/pull/3
1👀3
Вышла официальная мультиагентная оркестрация Claude Code

В Claude Code есть встроенная мультиагентная оркестрация, но она отключена и недоступна по умолчанию. Через CC Mirror эту функцию удалось включить и вынести наружу.

Что это дает:

- нативная оркестрация агентов Claude Code
- изоляция от основного CC-процесса
- готовый Orchestration Skill, без своей логики и фреймворков
- управление агентами обычными промптами

Шаг 1:

npx cc-mirror quick --provider mirror --name mclaude


Шаг 2:

mclaude


Дальше попроси его загрузить orchestration skill и начать инициализацию.

Репозиторий: тут
1👍5👀2
Только что увидел, что команда MiroMind выложила в open source свой самый мощный поисковый агентный модельный стек — MiroThinker 1.5. 😁

Погоняли его немного, реально впечатляет. Ему задали непростой вопрос: «попробуй предсказать будущую динамику акций Tesla».

Он не стал ничего выдумывать. Вместо этого сразу пошёл в веб, собрал свежие рейтинги от крупных топовых аналитических агентств, открыл и прочитал их по очереди, а на выходе выдал подробный отчёт. Все цифры и выводы с источниками, всё проверяемо.

За счёт такого научного подхода с «медленным мышлением» модель с всего 30B параметров обходит GPT-5-High, а версия на 235B параметров уже уверенно входит в первый эшелон.

Весы модели уже открыты, плюс есть бесплатная Web-версия для теста. Если нужен инструмент для глубоких ресёрчей — точно стоит попробовать.

Онлайн-версия: https://miromind.ai
GitHub: https://github.com/MiroMindAI/MiroThinker
Скачать модель: https://huggingface.co/miromind-ai/MiroThinker-v1.5-235B
Please open Telegram to view this post
VIEW IN TELEGRAM
1👍28🤯3👀2
Весь интернет сейчас
😁65😭4
This media is not supported in your browser
VIEW IN TELEGRAM
Claude Code офигенный, но стоит слишком дорого. 😭

Обязательно попробуй Open Code — это пушка.

Он даёт доступ к некоторым моделям полностью бесплатно.
И плюс работает с локальными моделями, например с Qwen.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍27🫡2
TII выкатили Falcon H1R-7B 🙌

Новый reasoning-модель, которая обходит многих конкурентов в математике и кодинге, при том что всего 7B параметров и контекстное окно на 256k

Модель гибридная: mamba + transformer, за счёт этого выше эффективность по пропускной способности и памяти

Посмотреть модель и потыкать демо можно здесь

Блог-пост с деталями: тут
Please open Telegram to view this post
VIEW IN TELEGRAM
🫡7👍4
Media is too big
VIEW IN TELEGRAM
Создаём новый AI-редактор кода в духе Cursor или Replit : Polaris

Идея автора в том, чтобы перестать пользоваться AI-инструментами для кодинга, а начинать их делать самому

Поэтому они записали 12 часовой курс по созданию и развертыванию клона курсора

Посмотрите учебное видео 😎
Please open Telegram to view this post
VIEW IN TELEGRAM
👍18👀6🤯2
This media is not supported in your browser
VIEW IN TELEGRAM
Google обновила MCP Toolbox и это серьёзный апгрейд, плюс теперь это open source.

MCP Toolbox от Google отлично работает со структурированными данными, но в реальности корпоративные знания почти никогда не живут в базах данных.

Они размазаны по письмам, Slack-тредам, GitHub-репозиториям, записям в Salesforce, отзывам клиентов и внутренней документации.

Из-за этого агенты просто не видят большую часть данных и работают с урезанным контекстом.

Разработчик решил эту проблему с помощью MindsDB.

Он выступает как универсальный SQL-слой поверх всех источников данных — структурированных, полуструктурированных и неструктурированных.

В итоге ты можешь выполнять SQL-запросы в Salesforce, Gmail, GitHub, файлы в S3, Jira и ещё более чем в 200 источников.

Самое интересное, как это стыкуется с MCP Toolbox.

MindsDB всё пробрасывает через MySQL, поэтому для агента это выглядит как обычный SQL: он делает запрос и получает контекст.

Агенту вообще не важно, что под капотом данные пришли из пяти разных систем.

Такая схема открывает мощные возможности:

→ Один SQL-интерфейс для десятков корпоративных источников
→ Кросс-джойны между разными системами, например GitHub + CRM в одном запросе
→ Встроенный ML для работы с неструктурированными данными
→ Простые MCP-инструменты, которые теперь покрывают куда больше данных

В видео агент делает один SQL-запрос сразу к данным из GitHub и базе с отзывами клиентов.

То, что раньше требовало ETL-пайплайнов и недель инженерной работы, теперь происходит мгновенно.

В итоге всё просто: полезность AI-агентов напрямую зависит от того, к каким данным у них есть доступ. А здесь данных становится в разы больше.

100% опенсорс
👍23🤯4
This media is not supported in your browser
VIEW IN TELEGRAM
Опенсорсная альтернатива AI-агенту Manus ⚔️

OWL — это фреймворк автономных AI-агентов, который умеет ресёрчить, серфить по вебу и писать код с поддержкой мультиагентного взаимодействия.

Работает с Claude Code, DeepSeek, GPT-5.2 и даже с локальными LLM через Ollama.

- http://github.com/camel-ai/owl
Please open Telegram to view this post
VIEW IN TELEGRAM
👍18