Essential Claude Code Plugins — Step-by-Step Guide & Transcript

[00:04] . Больше инструментов, больше мощности, верно? Больше вещей мы можем построить. Вот в чём проблема. Как только Cloud начинает распознавать более 50 инструментов одновременно, он начинает выбирать неправильные, и работа вашего агента ухудшается, а не улучшается.

[00:18] Поэтому я просмотрел весь рынок плагинов и, в целом, всю экосистему MCP, чтобы найти инструменты, которые действительно заслуживают своего места здесь и которые плагины Cloud Code, которые я бы оставил установленными, включая те, которые

[00:30] полностью меняют принцип работы Cloud, особенно в отношении таких инструментов, как базы данных. прежде чем я перейду к самому списку , я хочу быстро прояснить, что вообще такое плагин. Когда говорят о плагине и MCP-сервере, обычно подразумевают

[00:46] две разные вещи. Теперь сервер MCP представляет собой лишь одну из своих возможностей. Это одно из подключений, которое предоставляет облаку доступ к определенному инструменту или сервису. Так что, думайте как о GitHub, возможно, используя базу данных, браузер или что-то еще. Теперь плагин стал

[00:59] больше. Это, по сути, контейнер, который позволяет объединять в один блок множество вещей . Таким образом, это могут быть команды со слэшем, хуки, языковые серверы, навыки, и да, это может включать в себя и серверы MCP. Таким образом, плагин может представлять собой просто MCP-сервер,

[01:12] а может быть и чем-то гораздо большим. Сейчас эти термины часто используются не по назначению, я просто разницу. Поэтому для управления и установки плагинов в облаке я версию с интерфейсом терминала. Это означает установку Cloud Code на ваш компьютер, а

[01:26] не просто использование настольного приложения. Оттуда вы можете открыть терминал или просто буду доверять этой папке), а затем ввести команду {слэш} plugin. Когда вы это сделаете, система отобразит список различных плагинов, поэтому

[01:39] сможете перейти к просмотру установленных навыков и плагинов, серверов MCP, а сейчас и хочу поговорить. Теперь магазин приложений для Cloud Code. В нём содержится множество плагинов, вы

[01:54] устанавливаете его всего один раз, а затем можете добавлять любые другие плагины по своему желанию, и он будет Теперь, по умолчанию, Anthropic предоставляет вам две торговые площадки. Здесь кажется, что есть вы используете настольное приложение. Теперь есть официальный магазин плагинов, и

[02:08] это очень небольшой набор плагинов, которые Anthropic поддерживает самостоятельно. где собрано множество сторонних плагинов, и их проверяет убедиться в их надежности. Эти два варианта охватывают практически все необходимые вам функции,

[02:23] их. Создать и разместить маркетплейс может любой желающий , а если вам нужны дополнительные навыки, вы можете самостоятельно установить другой маркетплейс. очень просто. По сути, вы просто добавляете репозиторий Git, а затем можете

[02:36] плагины, но будьте осторожны, потому что иногда на этих торговых площадках может содержаться вредоносный контент. Поэтому, если вы используете не официальную версию, будьте немного осторожны. Итак, после всего

[02:49] плагинов. Итак, первый плагин или тип плагина, который я бы рекомендовал вам установить, — это языковой сервер для языка программирования, который вы используете Rust, JavaScript, TypeScript — неважно. Вам нужно

[03:02] вы сможете найти соответствующий языковой сервер. В моем случае я использую Python, поэтому собираюсь установить Pyright LSP, который, по сути, является языковым сервером. Это обеспечивает вывод типов и

[03:15] распознавание окружения через Pyright, который, опять же, является своего рода языковым сервером. Таким образом, программа будет выполнять статическую и обеспечивать более высокое качество генерации кода и вывода, проверяя вы не уверены, какой языковой сервер установить, просто спросите у Claude code, и он

[03:30] вам подскажет, но позвольте мне показать, как работает Pyright. Здесь вы можете увидеть некоторые . Итак, чтобы установить это, нам нужно просто перейти в папку /plugin, найдете, потому что оно должно быть там. Итак, мы будем говорить «Pyright» вот так.

[03:45] присутствует. Я наведу на него курсор, нажму Enter, и затем установлю область применения, в которой хотите установить это. Итак, он установлен, и теперь мы можем перезагрузить плагины, набрав команду reload plugins, и теперь можем начать

[03:59] им пользоваться. Хорошо, значит, будет полезнее перезагрузить плагины, а не навыки. Затем, если мы хотим проверить, установлен ли он, мы можем перейти в раздел «Плагины», затем в «Установленные», и мы увидим, что там находится Pyright LSP. Для этого

[04:11] код на Python, а затем использовать сервер для его проверки. В качестве примера я просто скажу что-то вроде: сгенерируйте относительно сложный скрипт на Python, а затем используйте языковой сервер LSP Python для проверки всех типов.

[04:25] Если вам интересно, чем я здесь диктую, потому что вы постоянно спрашиваете, то я использую инструмент под названием Whisper Flow. Использовать его можно бесплатно. Это очень, очень хорошая система голосового ввода с использованием искусственного интеллекта. Я им пользуюсь уже почти год, кажется. У меня

[04:38] куча слов, и это намного быстрее, чем печатать, поэтому я всегда использую этот способ, ссылку в описании на случай, если вы захотите посмотреть. У меня с ними действительно долгосрочные партнерские отношения. Хорошо. Итак, сейчас мы это сделаем, и давайте

[04:50] с языкового сервера. Хорошо, программа только что завершила работу. Как видите, плагин использовался несколько раз с языковым сервером Pyright, подтверждающий, что всё в порядке , все проверки статических типов выполнены и

[05:02] т.д. Перейдём к следующему плагину. Итак, следующий плагин в моем списке — GitHub. Возможно, это звучит очевидно, но, поверьте, на самом деле всё немного сложнее, чем кажется, потому что текущий официальный плагин GitHub, который уже

[05:15] установлен и предоставлен Anthropic, на самом деле не работает, и GitHub, как ни странно, GitHub сообщает, что плагин не работает, и вы не можете использовать я покажу вам альтернативный способ установки GitHub с использованием стандартного

[05:30] можете предпринять, чтобы получить его, потому что это очень важный инструмент, который позволит вам создавать контрольные точки и сохранять ваш код, а затем автоматически создавать удаленные репозитории, которыми вы сможете делиться с другими людьми, на других устройствах и, в

[05:42] прогресс в вашем проекте. Таким образом, если что-то пойдет не так, вы сможете откатиться Итак, как же нам это использовать? Позвольте мне выйти из полноэкранного режима и показать вам. Итак, существует такая связь. Оставлю это в описании. Оно

[05:56] И вы можете увидеть, что есть команда, которую можно выполнить, чтобы добавить GitHub в качестве сервера в Cloud Code. Это не плагин. Это сервер MCP, который немного отличается от других. Итак, мы скопируем эту команду, но

[06:11] какой-нибудь блокнот. Мы пока не собираемся устанавливать его в наш терминал. блокнот, и вы заметите здесь (мне нужно немного увеличить масштаб), что там указан этот bearer, а затем ваш GitHub PAT. Это означает персональный

[06:25] получить, потому что нам нужно будет заменить его в этой строке. Итак, мы перейдём в свой аккаунт. Если у вас его ещё нет, вам необходимо его изготовить . Это бесплатно. В настройках перейдем к настройкам для разработчиков.

[06:41] А затем мы создадим новый персональный токен доступа. Я рекомендую немного проще пользоваться, и вам не нужно будет его ограничивать. токен и сразу же вернусь. Итак, при создании классического токена вам останется

[06:55] функции репозитория. Я также рекомендую включить пользователя. Вероятно, вам не нужно здесь, есть ли что-нибудь еще, что вам нужно для вашего конкретного ключа. Но для меня этого должно быть достаточно. Итак, я собираюсь

[07:10] Очевидно, вы не захотите ни с кем этим делиться. Я удалю его позже, и мы заменим наш личный токен доступа GitHub на тот, который скопируем. Мы в итоге уйдем из Cloud Code. Итак, мы собираемся отказаться

[07:24] И мы просто вставим эту команду. Хорошо? Итак, мы собираемся вставить это, нажать Enter, и, хорошо, получаем сообщение "Неверный ввод". этим справиться. Итак, вы видите, что здесь есть сообщение из

[07:36] документации, в котором говорится: «В Windows может возникнуть проблема с сообщением о недопустимом вводе. Если это произойдет, вам нужно преобразовать команду, чтобы использовать этот формат». можем использовать этот конкретный формат. Это немного неудобно, но нам просто нужно будет

[07:49] некоторую информацию и вставить её сюда, чтобы мы могли запустить этот выглядеть новая версия. Если вы просто сказать коду Claude, чтобы он предоставил вам её, то есть: «Привет, предоставьте

[08:01] мне это в этом формате». Скопируйте это, и он автоматически преобразует это для вас, если вы не хотите отменять JSON. И затем, если мы нажмем добавили этот сервер MCP, и всё готово . Теперь, если мы вернёмся в

[08:14] Claude, что мы можем сделать Вместо запуска плагинов мы можем запустить /mcp. После этого мы увидим GitHub, и если мы посмотрим на GitHub и инструменты, то инструментов, которые мы теперь можем использовать для управления нашими репозиториями. Таким образом, теперь всякий раз, когда вы

[08:29] . Если этого не происходит, просто укажите ему использовать сервер GitHub MCP, и он сможет управлять вашим кодом за вас. К счастью, следующий плагин в моем списке значительно проще установить, и это front-end design.

[08:43] популярен, но я бы рекомендовал установить его, если у вас его еще нет. Итак, перейдите в /plugin. Он должен быть первым, который появится, потому что он очень популярен, но если у вас его еще нет, вы можете просто найти front-end design.

[08:55] Нажмите Enter, и вы сможете установить его. Теперь front-end design будет создавать систему дизайна, а также различные навыки и команды в Claude, чтобы он Это позволит вам создавать значительно лучшие пользовательские интерфейсы,

[09:07] интерфейсов. Итак, я сейчас что можно сделать с фронтенд- дизайном. Чтобы запустить его, нужно ввести /front-end design plugin. После этого все последующие запросы

[09:21] будут автоматически использовать этот время, я изменю модель на Sonnet, чтобы это заняло меньше времени, и снижу трудозатраты,

[09:36] потому что не хочу, чтобы генерация занимала много времени. и скажем: «Я хотел бы, чтобы вы создали приложение для потоковой передачи музыки». « Просто создай для меня фронтенд и целевую страницу, используя HTML, JS и CSS».

[09:51] Хорошо? Давайте посмотрим, что получится. Итак, здесь используется типичный подход, и вы заметите, что здесь даны инструкции, основанные на навыках фронтенд-дизайна: использовать палитру, типы, элементы и создать своего рода систему дизайна

[10:04] , что не происходит по умолчанию, если вы не используете этот плагин. Вот Знаете, он не потрясающий, но выглядит довольно прилично для одного запроса, и это то, что . Хорошо, теперь следующий инструмент в моем списке немного отличается, потому что он

[10:18] На самом деле он о том, чтобы предоставить Клоду собственную реальную базу данных, которую он может создать и запустить непосредственно для вас прямо внутри кода Клода. Вот как это работает. являющаяся спонсором сегодняшнего видео (но не волнуйтесь, это бесплатно), имеет

[10:33] сервер MCP, который вы можете подключить. в код Клода. Теперь, после подключения, Клод может запустить настоящую базу данных Postgres. Он может создавать ваши таблицы, выполнять ваши запросы и управлять всей базой данных за вас, просто по вашему запросу на простом

[10:45] английском языке. Они также поставляют программу под названием PG AI Guide, которая, по сути, превращает Клода в эксперта по Postgres. Таким образом, схема и SQL-запросы, которые он пишет, действительно хороши. Сама база данных — это Timescale DB, которая является Postgres, но

[10:59] с дополнительными функциями. Поэтому она особенно хороша для данных временных рядов. То есть для всего, что имеет постоянно растущие временные метки, такие как журналы, метрики, события, данные датчиков и т. д., — это то, с чем обычные базы данных Postgres

[11:12] начинают испытывать проблемы, когда достигают больших масштабов. Но вот в чем дело. Это совершенно обычного приложения для работы с данными. Вы можете использовать ее для товаров, заказов, чего угодно, данных. По сути, вы просто получаете действительно мощную базу данных, когда она вам нужна. И

[11:27] потому что Вы можете подключить его к Claude, это значительно упростит разработку приложений, поскольку система автоматически создаст данные, напишет SQL-запросы и т.д. Я хочу еще раз отметить, что

[11:39] компания, стоящая за этим, — Tiger Data. Ранее они назывались Timescale и являются создателями Timescale DB. Сейчас они используют Tiger Cloud, полностью управляемую версию. Она запускается примерно за 60 секунд,

[11:51] и вы получаете 30-дневную бесплатную пробную версию без необходимости указывать данные кредитной карты. Если вы воспользуетесь моей ссылкой в ​​описании, вы также получите 1000 долларов в виде бесплатных кредитов, которые можно попробовать это сами, перейдите по ссылке в описании, создайте бесплатный

[12:04] сможете просто запустить сервис. Я сейчас запущу один из своих бесплатных сервисов, создам его, затем создам базу данных и покажу, как это работает. Как мы можем загрузить его сюда, в Cloud Code? Хорошо, после

[12:16] вы можете напрямую подключить его к AI Tools. Конечно, вы можете использовать его как обычную базу данных. Итак, я собираюсь подключиться к AI Tools, и он предоставит мне просто, мы просто выполним эту команду curl. Мы войдем в систему

[12:28] с помощью Tiger CLI. Мы просто установим эту переменную среды, которая а затем установим сервер MCP. Итак, давайте пройдемся по шагам. Я собираюсь go, потому что для меня это немного проще в Windows, и она

[12:43] загрузит Tiger CLI, а затем мы просто скопируем эту команду и войдем в систему с нашей учетной записью. Хорошо, я только что запустил Tiger с входом в систему. Я просто войду в свою учетную запись. Хорошо, я нажму «Авторизовать», и всё должно работать.

[12:57] Хорошо, вы видите, что мы вошли в систему. Последний шаг — установить пароль в качестве переменной окружения, и добавить Mac или Linux, это очень просто. Просто скопируйте его. Если вы используете Windows,

[13:12] , что я вам покажу, чтобы установить переменную окружения. Итак, Обратите внимание, что я использую знак доллара ENV, она немного изменена. Нажимаем Enter, и информация сохранена. Теперь

[13:26] мы можем ввести tiger MCP install. После этого мы можем я хочу установить Claude code, и он автоматически добавит его для нас. Теперь нам предлагается множество вариантов

[13:41] несколько основных шагов, чтобы вы поняли, как это работает. Итак, база данных загружена, поэтому я сейчас кое-что скажу. Используя сервер Tiger MCP, создайте базу данных, содержащую 100 товаров и все различные заказы на покупку, имитирующие

[13:55] интернет-магазин. Хорошо, давайте посмотрим, сможет ли он это сделать и создать для нас базу данных , но база данных была создана , и теперь мы можем начать её использовать. Если я вернусь сюда, на веб-страницу, и просто обновлю её,

[14:08] увидеть все имеющиеся у нас таблицы. Итак, вы видите, что у нас всего пять объектов: заказы, товары, позиции заказа. Я могу зайти и проверить их. Это всего лишь вам, насколько быстро это может происходить, когда мы вставляем миллионы различных строк, чтобы

[14:22] имитировать, например, данные с датчиков, как я говорил, где Timescale проявляет себя наилучшим образом. У меня здесь есть длинная команда, которая, по сути, просто указывает ей вставить несколько миллионов строк фиктивных данных с датчиков, чтобы я мог показать вам, как мы это делаем. Можно

[14:35] TimeScale DB. Давайте запустим. Хорошо, у меня есть все эти данные с датчиков. Теперь я просто попрошу его выполнить запрос с помощью Explain Analyze, который покажет мне, что это на устройство за последний час, сгруппированные по устройствам, отсортированные по убыванию среднего значения,

[14:49] и давайте посмотрим, сколько времени это займет, чтобы я мог сравнить это с тем, что мы получим после оптимизации таблицы. Хорошо, мы видим, что полное выполнение заняло около 624 миллисекунд , и мы можем пройтись по таблице и посмотреть, что именно произошло. Это

[15:01] нормально, но есть способ оптимизировать это, используя данные временных рядов, такие как журналы, показания датчиков и т. д., чтобы значительно так называемой гипертаблицы. Не буду вдаваться в подробности, но, по

[15:14] сути, первое, что я могу сделать, это сказать: «Эй, не могли бы вы, пожалуйста, создать форк этой базы данных?» Это функция Tiger MCP, которая позволяет нам фактически создать полную копию этой базы данных, используя Сервер MCP.

[15:27] Мы можем создать столько таких серверов, сколько захотим, что позволит нам экспериментировать с другой версией базы данных, не затрагивая оригинал. не хотим рисковать уничтожением всей базы данных, мы можем сделать это на форке, что

[15:39] сейчас я просто скажу этому серверу: « Включи расширение Timescale DB и преобразуй события в гипертаблицу, разделенную по дате создания». Это запросов, и мы запустим тот же запрос, чтобы посмотреть, сколько времени это

[15:54] и разделил данные на гипертаблицы. Теперь давайте повторно запустим тот же запрос, что и я просил, и посмотрим, сколько времени это займет. Хорошо, и вы видите, что мы получаем ответ, и он в 380 раз быстрее благодаря оптимизации, которую мы

[16:08] выполнили с гипертаблицей. Смотрите, база данных, с которой мне нравится работать. Внутри Cloud Code. Можете смело экспериментировать, перейдя а теперь перейдём к следующему инструменту. Итак , следующий инструмент, о котором мы поговорим,

[16:22] называется Context 7. По сути, это плагин, который получает актуальную работе с каким-либо фреймворком вы не получали устаревших результатов или информации из более старых версий. Установить

[16:37] его очень просто: перейдите в раздел плагинов и просто найдите Context 7. Мы собираемся установить его, и опять же, это позволит ему автоматически искать соответствующую документацию в зависимости от

[16:50] используемого инструмента или фреймворка, чтобы получать актуальную версию, а не полагаться на то, на чём изначально обучалась модель . Итак, я перезагрузил плагины и попробую быстро продемонстрировать, как это работает. Расскажите мне, что

[17:02] изменилось в последней версии React, и приведите несколько примеров синтаксиса с использованием плагина Context 7. На практике вы, вероятно, не стали бы задавать этот вопрос. Его бы просто естественным образом вызвали. Как вы уже писали код с помощью Cloud Code, но,

[17:15] вам. Хорошо, вы видите, что здесь происходит запрос к документации с контекстом семь. Давайте скажем «да» и посмотрим, что получится. Отлично, и мы получаем ответ с несколькими примерами кода, а

[17:28] также ключевые изменения, которые были в этой версии. Замечательно, перейдем к следующему плагину. Следующий инструмент, который я вам покажу, — один из моих любимых, он называется Composio. Composio позволяет подключать множество различных

[17:40] инструментов и учетных записей, таких как несколько Gmail-аккаунтов, несколько Google Дисков, Asana и Gmail-аккаунтов, несколько Google Дисков, Asana и т. д., к веб-панели управления. Затем, используя один API-ключ или строку подключения, вы можете подключить все это к любому ИИ-агенту, который

[17:53] вам нужен, без необходимости переподключать их в каждом отдельном инструменте. Представьте, что у меня я всегда хочу использовать на обоих своих компьютерах, или я хочу использовать их, например Cloud Code. Обычно мне пришлось бы

[18:06] подключать каждый из них по отдельности. по отдельности. С Composio я подключаю их один раз на этой платформе, а затем просто подключаю Composio к этим ИИ-агентам. Это также позволяет обнаруживать инструменты по запросу, поэтому вы не перегружаете

[18:19] контекстное окно агента множеством инструментов одновременно, что может ухудшить в описании. Он бесплатный. Вы получаете около 10 000 вызовов инструментов в месяц это работает так: после создания учетной записи, убедитесь, что вы перешли в

[18:32] этот раздел «Для вас», вы можете подключать приложения. Вы можете подключить, например Google Drive, Gmail, Code Interpreter, все эти разные Hacker News, Open Weather и т. д. Вы можете подключить все свои

[18:44] Затем вы можете установить это. И чтобы установить его, вы просто выбираете место установки. Я хочу сделать это в Claude Code. Теперь, чтобы установить это, вы можете сделать это через CLI или через MCP. Я предпочитаю Используя MCP.

[18:56] Просто скопируйте эту команду настройки сюда, перейдите в терминал и вставьте её, после чего она должна добавиться. Затем откройте Claude. После открытия Claude перейдите в MCP. Отсюда перейдите

[19:09] в Composio. Там написано, что требуется аутентификация. Пройдите аутентификацию, и откроется окно браузера. Если нет, просто нажмите на ссылку, войдите и пройдите аутентификацию . Хорошо, мы

[19:21] успешно, и теперь я могу просто сказать что-то вроде: «Используя сервер Composio MCP электронной почты». И это должно перейти к моим учетным записям, мою почту, даже если у меня здесь не подключен Gmail, потому что я подключил

[19:36] Composio. Вы заметите, что Composio ищет инструмент, Я хочу это сделать. «Это инструмент, который я хочу использовать, и так далее». Хорошо, да, и видим, что получаем электронное письмо, и я могу указать ему отправить

[19:50] черновик или сделать практически все, что захочу. Composio — это супер-хороший плагин. В нем сотни, я думаю, даже тысячи инструментов, к которым можно подключиться. очень полезен для всех, кто занимается разработкой программного обеспечения и имеет дизайнеров

[20:04] в своей команде, — это Figma. Чтобы установить его, перейдите в раздел плагинов, найдите Figma, и он позволит вам загружать документы Figma и создавать их с помощью Claude Code.

[20:17] вы загружаете его сюда, и он просто создаст все для вас. Давайте завершится, а затем я покажу вам быстрый пример. Хорошо, у меня здесь очень простой документ Figma. Я только что

[20:30] вставляю его сюда. По сути, я хочу, чтобы Claude Code собрал это для меня. Поэтому я скачиваю локальную копию на свой компьютер. Она находится на моем рабочем столе. ему собрать это. Я просто скажу ему: «Можешь ли ты собрать полную рабочую версию

[20:44] скажу ему: «Можешь ли ты собрать полную рабочую версию рабочем столе для приложения, связанного с полетами, используя HTML, CS, JS, может быть, React, на твой выбор, документ?» Хорошо, давайте нажмем Enter, и,

[20:56] надеюсь, он сможет просмотреть этот документ и собрать его для нас. Хорошо, кстати, Вы можете просто авторизоваться напрямую здесь. Я забыл, что это можно прочитать его по URL-адресу в интернете, что, очевидно, намного проще. Итак,

[21:10] получится. Хорошо, он только что закончился, и Вот результат, который мы получили. В общем, очень хороший. Практически то же самое, что мы получили с Figma. И да, это плагин для Figma. На этом, ребята,

[21:23] видео заканчивается. Расскажите, какие плагины и MCP-серверы вы настроен Cloud Code? Кстати, вам точно не нужно устанавливать всё подряд. Просто Инструментов не так уж много, но

[21:37] считаю чрезвычайно полезными. Итак, на этом видео заканчивается поставьте лайк, подпишитесь, и увидимся leave a like, subscribe, and I will see you in the next one.