Transcription
Существует множество навыков CLCO, и, честно говоря, выбрать их очень сложно. Поэтому в этом видео я поделюсь с вами навыками, которые я фактически использую каждый день как старший инженер-программист, который раньше работал в Amazon и Microsoft. И прямо сейчас я разрабатываю продукт под названием BookZ.AI, и эти навыки действительно помогают мне выпускать и развивать мои продукты, а также автоматизировать мои рабочие процессы и повышать точность часов. Так что в этом видео я поделюсь с вами фундаментальными навыками вплоть до продвинутых навыков рабочего процесса. Итак, сказав это, если это звучит интересно, давайте приступим.
Прежде чем мы продолжим, я недавно запустил наше школьное сообщество, где я помогаю вам освоить ИИ-агентов, автоматизацию и многое другое. И все это исходит от человека, который раньше работал старшим инженером-программистом в области ИИ в таких компаниях, как Amazon и Microsoft. И в этом сообществе вы получите более 100 видеоматериалов, таких как шаблоны и рабочие процессы, которые я лично создал и продал более 100 раз. Вдобавок ко всему, вы также получите доступ к нашим еженедельным живым звонкам. И чтобы дать вам представление, на этой неделе мы проводим мастер-класс по коду "кло", где мы углубимся в то, как повысить точность кода "кло", когда мы будем использовать его для создания приложений. Кроме того, вы также получите полную поддержку сообщества, где у вас будет возможность задавать вопросы и получать прямые ответы. Итак, если вы готовы повысить свой уровень, обязательно присоединяйтесь, и я увижу вас в сообществе.
Хорошо, давайте начнем с первого фундаментального навыка, который является суперсилами. Итак, мы все знаем, что "из коробки" код "кло" очень мощный, но он очень хаотичный. Вы даете ему задачу, и он начинает писать код, но нет никакого планирования, никаких тестов, никакой методологии, и вы можете получить что-то, что работает, но оно также очень хрупкое. Могут быть какие-то ошибки или баги, которые они вносят, и это то, что мы называем "вайб-кодингом". Но суперсила приходит, чтобы решить проблему строгой методологии разработки, которая заставляет код "кло" сначала обдумывать, планировать подход и начинать писать тесты перед реализацией, и она следует тому, что мы называем в разработке программного обеспечения TDD, что означает разработка, управляемая тестами, и она следует полному спектру методологий разработки, которые старшие инженеры используют ежедневно.
Чтобы показать вам живую демонстрацию, здесь вы можете увидеть, что это репозиторий суперсил, и все, что нам нужно сделать здесь, это установить его в нашу сессию "кло", и для демонстрации, скажем, если я хочу добавить функцию в этот продукт под названием bookzero.ai AI, который является продуктом, который я создал, и цель здесь состоит в том, чтобы я хотел создать телеграм-бота, который сможет позволить пользователю здесь отправлять квитанцию, отправлять ее телеграм-боту, и он сохранит ее в нашем приложении. Итак, способ, которым я это делаю, — это, по сути, запуск навыка под названием "использование навыка суперсилы", и этот навык будет иметь доступ ко всем навыкам суперсилы, которые у него есть, и, по сути, поможет нам выбрать правильные навыки суперсилы для нашей конкретной задачи, а наша задача здесь — я даю ему ссылку на тикет Jira, и я хочу, чтобы он, по сути, посмотрел на это приложение и увидел, как мы можем использовать суперсилу здесь для реализации этой конкретной функции. Затем, после того как он прочитает весь тикет, вы можете увидеть здесь, что, реализуя телеграм-бот для квитанций, вы можете увидеть, что он перечислит все шаги, которые мы предпримем, используя правильный навык суперсилы здесь для реализации.
Первый навык, который у нас есть, называется "мозговой штурм". Этот навык, по сути, исследует все пространство проблемы перед тем, как принять подход, который является нашим первым шагом для уточнения вещей, прежде чем мы приступим к реализации. И обычно, что происходит здесь, это то, что после того, как мы закончим мозговой штурм, он сгенерирует спецификацию решения или документацию по решению относительно того, какие именно требования мы будем строить для всей этой функции. Как только у нас будут готовы все решения или требования, мы будем использовать другой навык из суперсил под названием "навык написания плана", и это даст нам запланированный MD-файл, который содержит список контрольных точек относительно того, что именно мы будем делать для всего выполнения. Затем мы настроим среду, убедившись, что мы можем выполнить весь план, используя план выполнения. И обратите внимание, что здесь есть некоторые поднавыки из суперсил, которые мы можем запустить для выполнения всего плана. Один из них — TDD, а другой — параллельные агенты. Параллельный агент означает, что мы отправим несколько субагентов для выполнения плана шаг за шагом. У нас может быть куча списка дел, и у нас могут быть разные субагенты, выполняющие эти задачи одновременно. Так это называется параллельные агенты. И для каждого агента у нас может быть каждый агент здесь, чтобы следовать подходу TDD, который, по сути, заключается в попытке сначала написать тест, прежде чем мы приступим к реализации. Таким образом, мы гарантируем покрытие тестами, а также убедимся, что наш код соответствует установленным требованиям. И вы можете видеть, что, следуя этому подходу, мы можем выполнить весь план с несколькими агентами, а также следуя разработке, управляемой тестами. И в конце есть также навык обзора кода из суперсил, который, по сути, поможет нам найти любые ошибки, попытаться исправить что-либо, и в конечном итоге он просто выполнит навык проверки здесь, чтобы проверить все, прежде чем мы создадим запрос на слияние и сольем его в нашу основную ветку. И, конечно же, если вы хотите получить полное руководство о том, как я смог использовать код "кло" и sup, обязательно посмотрите это видео прямо здесь, где я сделал полное руководство о том, как настроить код "кло" с суперсилами. И в этом видео я, по сути, сделал полное руководство о том, как начать работу с суперсилами и кодом "кло". Так что обязательно посмотрите, и ссылка будет в описании ниже.
Итак, мы явно видим, что с суперсилой здесь она дает вам гораздо более высокую точность, потому что она сначала задает вам кучу уточняющих вопросов, понимает, что вы хотите построить, пишет тесты, а затем выполняет реализацию, и вам не придется возвращаться и исправлять вещи, потому что качество кода, полученное с другой стороны, будет гарантированно точным. Теперь мы все знаем, что суперсила здесь невероятна, но вот в чем дело: это рабочий процесс другого человека, и в конечном итоге вы достигнете точки, когда подумаете: "Ну, я хочу, чтобы "кло" следовал моему собственному процессу, я хочу, чтобы "кло" следовал моим собственным правилам тестирования, моим собственным шагам развертывания или даже моим предпочтениям в дизайне". И вот тут-то и появляется следующий навык. И поэтому следующий навык, который нам нужно рассмотреть, — это создатель навыков. И этот навык создан самим anthroic. И, по сути, этот навык помогает нам создавать новые навыки и итеративно улучшать их, устанавливая оценки. Так что, просто если вы хотите создать навык, все, что нам нужно сделать здесь, вместо сессий "кло", это просто набрать "создатель навыков". И вы можете видеть, что это будет навык, который мы будем использовать для создания нового навыка. И поскольку существует множество фреймворков разработки спектра, я могу создать свои собственные фреймворки разработки спектра, используя этот подход. И вы можете видеть здесь, что я, по сути, запустил создателя навыков, чтобы создать навык, который объединяет лучшее из трех. Например, GSD, GStack, суперсила здесь. Попытайтесь объединить лучшее из трех и попытайтесь создать свои собственные рабочие процессы для наших фреймворков управления спектром, потому что для каждого фреймворка здесь есть свои преимущества. Например, суперсила очень хороша в разработке тестов. GSD очень хорош в защите контекста для каждого агента, а GStack очень хорош в переключении между разными персонажами и наличии разных персонажей для оценки плана. И вы можете видеть здесь, что он сначала пытается исследовать все навыки, которые у нас есть для каждого фреймворка. И как только у нас будут перечислены все навыки для каждого фреймворка, тогда произойдет следующее: он выложит все этапы, которые у нас есть, такие как мозговой штурм, планирование, изоляция, выполнение, обзор и проверка. И для каждого этапа вы можете видеть, что это навыки, которые есть у каждого фреймворка. Например, суперсила, как мы уже говорили, у нас есть кольца, но для GSD у нас есть исследование, обсуждение, у нас есть создание новых проектов. Так что в конечном итоге мы можем выбрать лучшее из трех для каждого этапа и создать свой собственный навык, который автоматизирует весь процесс. Так что вы можете видеть, что именно это мы и собираемся сделать. И здесь вы можете видеть, что это навык, который мы собираемся создать с помощью создателя навыков под названием "создать функцию", который объединит лучшее из всех спектральных фреймворков путем, например, суперсил, GSD, Gstack, каждый из которых преуспевает в различных конвейерах для этапов, и вы можете видеть, что именно это мы собираемся сделать.
Итак, мы сначала возьмем тикет Jira. Мы классифицируем, является ли это небольшой функцией, если это средняя функция, если это большая функция, если это работа в области пользовательского интерфейса или API или полная работа или инфраструктура. Затем мы перейдем к полному конвейеру, который мы собираемся создать. Итак, мы будем использовать суперсилу здесь для мозгового штурма. Мы будем использовать GStack здесь для автоматического планирования, чтобы, по сути, использовать разные персонажи, такие как генеральный директор, дизайнер, инженер или адвокат дьявола, чтобы, по сути, провести процесс обзора. Убедившись, что у нас будут разные личности для обзора плана. Затем мы будем использовать суперсилу здесь для написания плана. Используя суперсилу здесь для изоляции среды. Затем мы будем использовать суперсилу здесь для выполнения плана, используя TDD и параллельных агентов здесь для выполнения. И в конечном итоге здесь вы можете видеть, что мы будем использовать суперсилу здесь для обзора кода, для проверки, а также использовать навык QA GStack для проверки в браузере. И в конечном итоге мы будем использовать GStack для выпуска проектов, и мы создадим запрос на слияние, чтобы выпустить его. Так что вы можете видеть, что этот навык будет лучшим выбором, верно? Мы выберем лучшее для каждого этапа, такого как мозговой штурм, планирование, обзор, задачи, все эти вещи. И, конечно же, в зависимости от работы, которую мы пытаемся выполнить, верно? Если это тяжелый пользовательский интерфейс, мы можем использовать навык обзора дизайна из GStack для обзора дизайна, который у нас есть. Или если тикет сильно связан с безопасностью, мы также можем использовать навык безопасности GStack из GStack для обзора кода после этого. Или если это тяжелый API, мы можем пропустить этап 8, потому что у нас нет ничего для браузера, верно? Нет смысла открывать браузер, если все изменения находятся в API. И, конечно же, если сложность очень высока, то мы можем пропустить этапы с первого по второй и перейти прямо к планированию задач. И если тикет включает в себя, например, ИИ или большую языковую модель, мы также можем использовать GSD для этапа интеграции ИИ перед планированием. Так что вы можете видеть, что мы возьмем лучшее из трех и объединим его в один навык, один фреймворк, который мы будем выполнять в соответствии с нашими предпочтениями. И, конечно же, если вы хотите использовать "создать функцию", которую я создал здесь, обязательно посетите наше школьное сообщество, и я обязательно оставлю ее там для объединения всех трех фреймворков в один навык для создания функций в ваших приложениях, используя самые популярные фреймворки для спектральных элементов для каждого этапа.
И говоря о фреймворках спектральных элементов, есть плейлист, который я создал для всех фреймворков спектра, которые я сделал, таких как GS Gstack, GSD, в чем разница между GStack, GSD и суперсилами. А также есть фреймворки, такие как spec kits, bi method, о которых я говорил на этом канале. Так что обязательно посмотрите, и я оставлю ссылки на весь плейлист в описании ниже, чтобы вы тоже могли его посмотреть. И, конечно же, после того, как вы создадите навык, вы также можете использовать создатель навыков здесь, чтобы уточнить его, установив оценку, тестирование, чтобы убедиться, что мы можем дальше уточнять навык, если он нам понадобится. И для этого я также сделал видео, которое вы можете увидеть здесь под названием "Разбор навыка кло 2.0, измерения, тестирование и улучшение, как мы можем создать навык, который мы создаем". Так что обязательно посмотрите это видео, и я обязательно оставлю это видео по ссылке в описании ниже.
Хорошо, следующий навык, который мы рассмотрим, — это навык UIUX ProMax. И этот навык, по сути, помогает нам создавать лучшие пользовательские интерфейсы для наших приложений с более чем сотнями отраслевых данных, на которых было обучено, как создавать лучшие пользовательские интерфейсы на основе конкретных категорий или ниш, в которых вы находитесь. И он способен делать это, имея несколько агентов для поиска прототипа, стилизации, цветов, внешнего вида целевой страницы, типографики, всего. А затем иметь собственный механизм рассуждений, чтобы выяснить, что лучше всего подходит для ваших продуктов. И в конце концов, он создаст полную систему дизайна в качестве выходных данных, такую как шаблоны, стилизация, цвета, типографика, любые шаблоны, которых следует избегать, все, что вам нужно для системы дизайна. Он все это включит. И именно так работает навык UIUX Pro Max. И, просто если вы хотите установить его, вы можете установить его либо через маркетплейс из облачного кода, либо через CLI. И, просто что вы делаете здесь, это просто выполните глобальную установку mpm для UI pro CLI. Затем вы перейдете в свой проект. И затем вы просто выполните инициализацию на основе ваших кодовых агентов. И затем, как вы можете видеть здесь, как только мы установим это, я просто запущу навык, указывая на файл, который у нас есть для моей целевой страницы, которая является моим index.html. И это моя текущая целевая страница, которую мы имеем. Я хочу, чтобы вы, ну, прежде всего, поняли, что делает текущая целевая страница, верно? Поймите, что у нас есть на текущей целевой странице. Затем мы переработаем нашу текущую целевую страницу на основе ниши или отрасли, в которой мы находимся. Верно? Так что он исследует целевую страницу, кодовую базу, чтобы понять, где мы находимся, с чем мы работаем, прежде чем мы приступим к дизайну переработки.
Итак, здесь вы можете видеть, что он будет запускать различные инструменты, пытаться создать план относительно того, как именно мы будем выполнять. Итак, вот большие шаги, верно? Так что смелая типографика, оранжевые CTA, а также здесь вы можете увидеть удаление раздела текстового стека, переупорядочивание разделов. Так что вы можете видеть, что есть много вещей, которые будут переработаны для всей моей страницы. Так что, очевидно, есть некоторые вещи, которые я не хочу, чтобы трогали. И что я собираюсь сделать здесь, это сказать: "Пожалуйста, сохраните тот же порядок, который у нас есть сейчас. Мне нравится текущий цвет для синего, черного и белого. Это своего рода цветовая тема для моих продуктов или моей целевой страницы, и я хочу, чтобы она осталась прежней. Так что, можете ли вы оставить ее как есть, но просто переработать на основе текущей структуры?" Итак, здесь я просто установлю ограничения относительно того, что именно трогать, а что нет, и посмотрим, что он сгенерирует. Хорошо, так что здесь вы можете видеть, что он дает план переработки после завершения. И здесь приведены ограничения, которые я установил. И вот что изменится: типографика, замена шрифтов, переработка заголовка, а также интервал между разделами, верно? У нас также есть навигационная панель, темный режим, а также технические исправления для размещения изображений, такие как высокий приоритет, текущая загрузка из Google Drive, медленная и ненадежная. Так что он скачает изображение, преобразует его в WEBP, сохранит в каталоге изображений и попытается отобразить его, верно? Мы также имеем SEO метатеги. Так что здесь вы можете видеть, что мы добавили некоторые дополнительные вещи: доступность, производительность, а также проверку. Так что я собираюсь отправить это и дать ему сгенерировать, и посмотрим, что меня удивит. Хорошо.
Итак, наконец, вы можете видеть, что у нас полностью переработан весь сайт. Так что теперь, если я перейду в браузер, вы можете видеть, как выглядит вся целевая страница. Вы можете видеть, что я также добавил функцию уведомления людей о том, что у меня были забронированы звонки за последние 30 дней. И здесь вы можете видеть, что у нас есть темный режим, а также светлый режим. Логотипы компании, с которой я работаю, а также 60 000 для подписчиков, разработчиков, которые у нас есть. И также, если мы прокрутим вниз, это продукт, который я сейчас разрабатываю, верно? Book zero.ai. И здесь текстовый стек, отраслевой хэштег, а также у нас есть посещение сайта. И, кроме того, есть также призывы к действию. Так что этот я фактически разработал, используя последнюю версию GPT image 2.0 Z, чтобы создать здесь призыв к действию для бронирования бесплатного стратегического звонка, верно? И есть также текстовый стек, так что он разделен на разные стеки, такие как фронтенд, бэкенд, облако и тестирование ИИ, так что вы можете видеть, что они у нас разделены. Если вы хотите прокрутить вниз, есть также проекты, которые я построил в прошлом, верно? Так что вы можете видеть, что все это на месте. И также у нас есть влияние. Какое влияние мы оказали в прошлом, верно? И, кроме того, есть также призывы к действию, если мы прокрутим немного ниже, чтобы побудить пользователя забронировать звонок. И наша цель при проектировании страницы, верно? Это заставить людей бронировать звонок, и мы хотим, чтобы этот призыв к действию размещался примерно в каждом другом разделе. И, кроме того, есть также раздел YouTube, а также раздел контактов. Так что вы можете видеть, что это, по сути, вся целевая страница, которую мы доработали, используя этот навык под названием UIUX Pro Max. И, честно говоря, я думаю, что это будет сильно отличаться от фронтенда дизайна, потому что фронтенд дизайн использует только знания модели по умолчанию о том, как лучше проектировать вещи, потому что вы можете видеть из MD навыка. Так что вы можете видеть, что это просто куча текста, чтобы научить большую модель, как лучше проектировать вещи, верно? Избегая ИИ-ляпов или дизайнерских мыслей. У нее нет знаний о том, как выглядят системы дизайна для разных ниш. И вы можете видеть здесь, что именно это и решает навык.
Теперь, очевидно, использование навыка UI UX promax или навыка фронтенд-дизайна предназначено для людей, у которых нет предпочтений к стилизации, и он, по сути, позволит большой модели решить это на основе данных отрасли или их собственных данных модели. Но давайте предположим, что вы вдохновлены некоторыми популярными брендами для системы дизайна и хотите скопировать это для своих собственных проектов. Вы также можете сделать это, проверив этот репозиторий под названием awesome design MD. И этот репозиторий содержит тщательно отобранные коллекции файлов дизайна MD, вдохновленных веб-сайтами, ориентированными на разработчиков. И вы можете задаться вопросом, что такое дизайн MD? Ну, дизайн MD — это, по сути, концепция, представленная Google stitch, которая генерирует согласованный пользовательский интерфейс на всем веб-сайте или целевой странице. И вы можете видеть здесь, если вы прокрутите вниз, есть множество коллекций, из которых мы можем выбирать, верно? Так что, если вы вдохновлены дизайном веб-сайта "кло", cohhere, 11 laps, minimax, верно? Это для категорий ИИ и больших языковых моделей. Вы также можете выбрать инструменты для разработчиков, верно? Cursor, lovables, expose, верно? Вы также можете скопировать их стили для бэкенд-базы данных. Есть множество веб-сайтов, стили, темы, цвета, типографика которых мы можем скопировать, верно? Итак, давайте предположим, что я нажму на один из них, например, на ClickHouse, и вы можете видеть, что он дает вам полный дизайн цветовых палитр, все правила, цвет призыва к действию, мы все можем это скопировать. Так что, если я переключусь на MD-файл, это все ограничения, правила того, как мы можем использовать это для проектирования наших приложений, как и некоторые другие веб-сайты, от которых мы вдохновились. Просто все, что нам нужно сделать здесь, это запустить эту команду и, по сути, сказать нашему помощнику по кодированию использовать этот файл дизайна MD для нашей работы по пользовательскому интерфейсу. Например, вы можете вернуться на целевую страницу awesome design и прокрутить вниз и найти самые популярные дизайны, и самые популярные дизайны по загрузкам. Вы можете видеть, что это от Apple. Так что, если мы нажмем на это, вот как выглядит дизайн Apple. Цветовые палитры, а также типографика, и мы можем просто скопировать эту команду, установить ее на нашей локальной машине и попросить нашего ИИ-агента посмотреть на этот файл дизайна MD и, по сути, интегрировать этот дизайн в наше приложение. Например, я просто скопирую дизайн Apple и просто перейду в новую сессию терминала и выполню установку npm run для всей этой системы дизайна.
Итак, после того как мы установили этот дизайн, вы можете видеть, что это файл дизайна.MD, и просто я начну новую сессию "кло" и скажу, основываясь на всем приложении, которое у нас есть, можете ли вы интегрировать наш файл дизайна.MD в него, чтобы у нас был тот же стиль, вы знаете, все для системы дизайна в нашем index.html. Так что, если я дам эту команду прямо здесь, мы можем видеть, как это выглядит после того, как мы полностью перегенерировали, переработали нашу полную целевую страницу. Так что вы можете видеть здесь, что это больше похоже на дизайн Apple, и у нас есть наша навигационная панель, у нас есть наша ссылка на бронирование, верно? Наши призывы к действию. Если вы прокрутите вниз, есть также совершенно другой вид для продукта, над которым я сейчас работаю. И если вы прокрутите вниз, есть также призывы к действию, верно? И вы можете видеть, что это очень похоже на дизайны Apple, которые мы видим здесь. И для сравнения, вот как это выглядело раньше, когда мы применяли дизайн Apple. И вы можете видеть, что все изменилось, используя "awesome design" здесь, который преобразует вдохновение дизайна, которое мы хотим, например, Apple или Stripe или любые веб-сайты, мы преобразуем его в файл дизайна MD, передаем его большой языковой модели для переработки нашего приложения или веб-сайтов на основе системы дизайна, которую мы копируем из других источников вдохновения.
Хорошо. Итак, до сих пор мы рассмотрели фундаментальные навыки, такие как "zup power" для создания спектральных разработок для повышения точности кода "кло", а также как мы можем создавать свои собственные пакеты навыков, упаковывая желаемый рабочий процесс в один навык с помощью создателя навыков, а также некоторые навыки дизайна, которые могут помочь нам создавать лучшие пользовательские интерфейсы для приложений. И теперь мы хотим дать коду "кло" глаза и руки для управления браузером, чтобы он мог проверять вещи, которые он создает, видеть их, кликать по ним, выполнять любые действия пользователя, как мы это делаем в нашем браузере. Итак, в этом случае давайте посмотрим на этот "nest" и для этого мы будем использовать инструмент под названием playr seal I, который Google дал нашей большой языковой модели возможность управлять браузером от нашего имени. Например, здесь вы можете видеть, что у меня есть быстрое приложение, которое я создал с помощью replet, которое, по сути, является приложением для "вайб-кодинга", и я могу использовать playright здесь для тестирования этих приложений полностью, используя playright, а также большую языковую модель, которая является нашим кодом "кло". И поскольку я был вне дома, вы можете видеть, что у меня есть бот "кло" или, по сути, телеграм для подключения его к нашей сессии "кло", и который вы можете видеть справа. И, по сути, то, что я делаю здесь, вы можете видеть, это, по сути, использование навыка "мозговой штурм" суперсилы, а также навыка playright cli, который вы можете фактически найти навык playright cli и навык mcp внутри нашего школьного сообщества, где вы сможете скачать его и использовать в своем приложении. И, по сути, то, что я делаю, это, по сути, использование playright cli здесь для выполнения плана. И вы можете видеть здесь, что у нас 16 этапов тестирования, и мы захватим в общей сложности 81 скриншот. Настройка локальной базы данных, прохождение 18 или 14 путей в нашем приложении, чтобы увидеть, есть ли какие-либо ошибки. Верно? И в конечном итоге здесь вы можете видеть, что он начнет выполнять. И здесь вы можете видеть, что мы сделали до сих пор: настройка сред, а также прохождение офлайн-путей, страницы клиентов и страницы заказов. В конечном итоге здесь вы можете видеть, что я также попросил вас сгенерировать отчет о контроле качества, который я покажу вам через секунду, и вы можете видеть, что он будет захватывать все пройденные этапы, а также соответствующие скриншоты, которые он сделал. Так что каждый шаг, который он предпринял, он будет делать скриншот, а также лог консоли. И вы можете видеть, что в конечном итоге я спросил его, каковы примерные сроки для этого, он сказал, что это займет около 15-20 минут, и после того, как это время пройдет, вы можете видеть, что он сделал некоторые скриншоты, показывающие, что он в настоящее время работает и может, вы знаете, тестировать, пока я вне дома, верно? И вы можете видеть здесь, что если я прокручу вниз, это отчет о контроле качества, который полностью сгенерирован, который вы можете видеть здесь. Хорошо, это полный отчет о контроле качества, и для каждого шага, так что, например, аутентификация имеет свои собственные скриншоты. Так что, если я нажму на это, это скриншот, который я сделал. Так что для шага контроля качества, когда я впервые вошел в систему с чистым состоянием, это будет выглядеть так, верно? И если я, знаете ли, войду с неправильными учетными данными, это будет выглядеть так. И если я, знаете ли, войду с правильными учетными данными, это будет выглядеть так. И если я, знаете ли, перейду на панель управления, например, переключаясь между разными вкладками, это будет выглядеть так. Верно? Так что вы можете видеть, что эти все захватываются с помощью наших таблиц, которые являются нашими отчетами о контроле качества. И для каждого шага он будет захватываться на наших скриншотах, верно? И в конечном итоге, что мне нужно сделать здесь, это после того, как он прошел все тестирование, и на основе логов консоли он обнаружил некоторые ошибки, которые нам нужно исправить, и я, по сути, сказал ему использовать суперсилу здесь, чтобы использовать разные субагенты и попытаться обработать их по одному и попытаться запустить другой субагент для исправления этого, и в конечном итоге здесь вы можете видеть, что он напишет план и попытается выполнить его, и в конечном итоге здесь вы можете видеть, что все семь исправлений QA сделаны, и он отправил их в основную ветку. Так что в конечном итоге это именно то, как мы можем использовать playright здесь в сочетании с мощью кода "кло" для управления нашим браузером для выполнения некоторой автоматизации, которую мы хотим. И если вы хотите получить полное руководство о том, как вы можете объединить мощь кода "кло" и playright, обязательно посмотрите эти два видео, которые я сделал на этом канале. "Кло" код плюс playright CLI, а также "кло" код плюс playright MCP. И в этом видео я провожу глубокое сравнение playright CLI против playright MCP. Так что обязательно посмотрите эти два видео, если вы заинтересованы в этом. И, конечно же, если вам интересно, как я могу использовать Telegram для управления моим кодом "кло", то обязательно посмотрите мое последнее видео, которое я сделал, где я смог использовать плагины Telegram из маркетплейса Claw Coalo и, по сути, позволить Clawo здесь подключиться к моему Telegram и общаться через мой телефон, чтобы я мог быть вне дома и все еще управлять своими сессиями Clawo. И, кроме того, я также могу заставить его управлять разными папками. Например, в настоящее время я нахожусь в консоли администратора, и давайте предположим, что я переключусь на другую папку, такую как Eric OS, вы можете видеть, что у меня есть куча папок здесь, и я начал свою сессию "кло" с Telegram, и теперь, если я хочу иметь другой разговор, например, если я скажу сообщение, такое как "привет", например, что произойдет здесь, вы можете видеть, что он отправит сообщение здесь, верно? Вы можете видеть, что у нас есть сообщение, которое было захвачено в сессии "кло", и оно отправило ответ. И давайте предположим, что я хочу сбросить этот разговор, я могу просто набрать команду сброса. И если я отправлю это, что произойдет здесь, это то, что он завершит текущую сессию и начнет новую сессию кода "кло", используя файл claw.sh, который вы можете видеть здесь в моем каталоге claw, и это, по сути, хук, который каждый раз, когда я делаю сброс, он будет запускать этот файл sh для сброса всего разговора, чтобы мы могли гарантировать свежее контекстное окно в нашем Telegram. Так что в этом видео я сделал много вещей. И, конечно же, если вы хотите получить этот полный файл SH для этого хука, обязательно посетите мое школьное сообщество, потому что я размещу все ресурсы, которые мы обсуждали в этом видео, в нашем посте сообщества. И пока мы на этой теме, если вы хотите, чтобы я сделал видео о рассмотрении всех лучших навыков CI, а также MCP, которые я использую для замены Open Claw и her внутри Claw Code с Telegram. Так что, если вы заинтересованы, обязательно прокомментируйте ниже, и я обязательно подготовлю это для моего следующего контента.
Итак, теперь clical может использовать play здесь, чтобы видеть и взаимодействовать с веб. Это огромное улучшение. Но вот в чем дело. Если вы закроете терминал, остановите сессию, все исчезнет, верно? Каждое решение, которое принял "кло", каждый кусок исследования, вся история проекта полностью стерта. И да, существует множество систем RAG, которые решают эту проблему, таких как векторные базы данных, вложения, конвейеры извлечения. Но если вы когда-нибудь попытаетесь настроить одну, вы знаете, насколько она сложна и дорога. Большинство разработчиков здесь просто хотят, чтобы "кло" запоминал вещи, не создавая всю инфраструктуру проекта. И именно это делает навык Obsidian. Он превращает простую папку файлов markdown в систему знаний, которую "кло" может читать, писать, тегировать и связывать. И думайте об этом как о миниатюрной системе RAG без каких-либо накладных расходов. Никакой базы данных, никаких вложений и никакой инфраструктуры, просто файлы markdown, которые "кло" точно знает, как ориентироваться. Теперь это было создано не какими-то случайными разработчиками. Это было фактически создано Capano, генеральным директором Obsidian, фактическим генеральным директором компании, который создал навык для кода "кло". И чтобы показать вам здесь, вы можете видеть, что это мой Obsidian. И я использую его для разных вещей. Например, один из вариантов использования — отслеживание проектов. И вы можете видеть, что просто для демонстрации, это некоторые примеры проектов, которые я отслеживаю. И здесь вы можете видеть, что я смог использовать навык Obsidian здесь, чтобы создать базовый файл для всех моих проектов. И это все мои проекты, основанные на статусе, некоторые из них находятся в процессе выполнения, некоторые из них находятся на стадии последующих действий, а некоторые из них находятся на начальной стадии. И вы можете четко видеть, что я могу использовать это для отслеживания всех проектов, которые у меня есть. И для одного из проектов, такого как демонстрационный проект, вы можете видеть, что я могу видеть обзор, верно? Каков статус? Кто контакт? Каков объем? И что такое демонстрационный проект? Вы можете видеть, что у нас есть профиль. И этот стиль markdown полностью создан с использованием навыков Obsidian, подключенных к коду "кло". И у меня есть код "кло", чтобы использовать навык Obsidian здесь, чтобы давать инструкции, и он, по сути, будет обрабатывать все мои заметки о встречах, верно? Все звонки по исследованию, все цепочки электронных писем, все загрузки, он способен позволить "кло" обрабатывать все эти файлы, организовывать их, и иметь ограничение, говорящее: "Эй, для каждой папки, которая у нас есть для проектов, мне нужен журнал разговоров. Мне нужны ссылки, мне нужен обзор, и мне также нужно хранить все документы внутри этой папки". И это поможет мне организовать все, установив ограничения относительно того, какой формат мы будем использовать. И вы можете видеть, что у нас есть полные разговоры от самых старых до самых новых, которые мы можем отслеживать здесь. И таким образом мы можем организовать все в нашем Obsidian, что значительно облегчит наш процесс. И самое главное, я также могу использовать Obsidian для просмотра графового представления. И давайте предположим, что у вас будет сложная папка, верно? Вы указываете на путь. Например, я просто скажу "демонстрационный проект". И вы можете видеть здесь, что я могу указать на это и точно, каковы отношения с обзором, верно? И в конечном итоге, что мы можем сделать с этим, это то, что мы сможем взять всю информацию, такую как Gmail, все локальные файлы, позволить "кло" организовать, обобщить все и поместить это в Obsidian. И в конечном итоге каждый раз, когда нам это нужно, мы просто будем задавать вопросы "кло", и "кло" сможет получить связанную информацию в Obsidian и вернуть нам результаты. И именно так это работает, используя этот подход. И, конечно же, если вы хотите получить полное руководство о том, как настроить это на вашей локальной машине, как вы можете объединить Obsidian с кодом "кло" для настройки вашего второго мозга, обязательно посмотрите это видео, которое я сделал две недели назад о том, как вы можете это сделать. И я обязательно оставлю ссылки в описании ниже, чтобы вы могли их посмотреть.
Хорошо, следующий навык, который мы рассмотрим, — это навык маркетинга. И на этом канале я фактически сделал видео под названием "43 маркетинговых навыка ИИ". И я смог использовать эти 43 маркетинговых навыка для улучшения моего SaaS-продукта, который я создал, от нуля пользователей до наших первых 1000 пользователей в этом видео. И для этих 40 маркетинговых навыков вы можете видеть, что они сосредоточены на различных нишах, таких как SEO, копирайтинг, последовательности электронной почты, оптимизация коэффициента конверсии, аналитика, контент-стратегии и многое другое. И я смог использовать эти навыки для улучшения продукта, который я создал, который является book zero.ai. И просто чтобы дать вам справку, вы можете видеть, что это анализ скорости страницы. И я смог получить 100 баллов за SEO, 100 за лучшие практики, 100 за доступность, 97 за производительность. И я смог использовать эти навыки для написания контента, SEO-исследований и попыток писать блоги, которые могут генерировать органический трафик. И даже объединив мощь нано-банана, я смог очень последовательно генерировать эти изображения во многих постах. Кроме того, я также использовал отслеживание коэффициента конверсии для постоянного отслеживания всей моей маркетинговой аналитики для моих приложений. Вы можете видеть, что это моя среда разработки, и я смог отслеживать все эти вещи в моей среде разработки, а также в моей производственной среде. И, например, какой доход поступает от разных каналов, верно? Как выглядят регистрации? Какова воронка? Какой трафик? Какие топ-страницы? Все эти вещи в сочетании с G4, который является Google Analytics four, а также нашей базой данных для отслеживания нашего использования. И, кроме того, я также использовал это для создания моей последовательности ухода за клиентами для мониторинга электронных писем, привлечения потенциальных клиентов и воронки конверсии бесплатных пользователей полностью внутри наших приложений, таких как шаг первый, шаг второй, шаг третий, когда следует следить, а когда не следует, верно? Так что вы можете видеть, что весь процесс захвачен и отслеживается внутри нашей системы с использованием этих маркетинговых навыков. Так что, если вы хотите получить такие же результаты, как и я, обязательно посмотрите это видео прямо здесь о том, как вы можете сделать то же самое, где я смог перейти от нуля пользователей до наших первых тысячи пользователей с моим продуктом под названием Bookser.ai. Так что, если вы заинтересованы, обязательно посмотрите это видео, и я обязательно оставлю ссылку на это видео в описании ниже.
Прежде чем мы перейдем дальше, быстрая благодарность сегодняшнему спонсору, Proxy Seller. Если вы создаете что-то, связанное с ИИ, автоматизацией или скрейпингом, одно из того, с чем вы довольно быстро столкнетесь, это то, что ваша установка начинает ломаться, когда вы немного масштабируетесь. Такие вещи, как блокировка IP-адресов, ограничения скорости или неправильное удержание сеансов. Proxy seller, по сути, предоставляет вам доступ к различным типам прокси в зависимости от ваших потребностей. Так что жилые, ISP, мобильные и дата-центры, и каждый из них решает немного разные проблемы. Например, жилые прокси полезны, когда вам нужно, чтобы ваши запросы выглядели как реальные пользователи из разных регионов, в то время как ISP-прокси лучше, когда вам нужны стабильные сеансы, которые не вращаются или не отключаются случайным образом. Что мне нравится, так это то, что вы не привязаны к одной установке. Так что в зависимости от того, что вы строите, вы можете переключаться между ними, не переделывая весь свой конвейер. Настройка довольно проста. Вы просто берете детали прокси из панели управления и вставляете их в свой код или браузер, и он начинает маршрутизировать ваш трафик через эту сеть. Так что, если вы работаете над чем-то, что зависит от внешних данных или автоматизации, это одна из тех вещей, которые просто устраняют много трений на раннем этапе. Я оставлю ссылку в описании, если вы хотите ее проверить.
Хорошо, давайте вернемся к делу. Хорошо, так что наконец-то у нас есть наш последний навык. И этот последний навык здесь — это, по сути, навык рабочего процесса, который я постоянно использую каждый день. Особенно для растущих продуктов, которые используются ежедневно большим количеством пользователей. Нам нужен навык рабочего процесса, который автоматически помогает нам исправлять любые ошибки или сбои, которые мы обнаружили в логах sentry или любой системе логирования. Нам нужна наша система, чтобы исправить это, потому что мы знаем, что любое программное обеспечение имеет ошибки, и нам нужна система, рабочий процесс, который может помочь нам автоматически исправить это. И именно поэтому я создал навык под названием "исправить тикет". И, по сути, то, что он делает, это то, что он переходит от ошибки до завершения. Так что, просто что вы можете видеть здесь, это то, что он сначала прочитает тикет Jira. Поймет, почему это произошло. В чем проблема? Возможно, у вас есть лог sentry, чтобы автоматически добавить тикет в ваш Jira. Затем он запустит навык playright cli здесь, чтобы, по сути, проверить, может ли он воспроизвести его локально. Если он может воспроизвести его в продакшене или локально, то он запустит разных агентов здесь для проведения исследований, выяснения, почему это так. Затем, как только мы разработаем план, он попросит нас утвердить его. Как только мы утвердим это, он пройдет через весь этот процесс. Попытается исправить это, попытается выполнить реализацию и попытается привлечь нескольких агентов для соблюдения лучших практик при проверке сделанного. Затем в конечном итоге он запустит playright cli снова и попытается проверить исправленные вещи. И в конечном итоге для этапа три он выполнит коммит, выполнит push, выполнит развертывание и в конечном итоге передаст его нужному человеку. Возможно, у вашей команды есть инженер по контролю качества. И он передаст этот тикет реальному человеку для ручного обзора. И весь этот процесс автоматизирован с помощью этого навыка "исправить тикет". И вы можете видеть здесь, что если я спрошу: "Эй, о чем этот тикет?", вы можете видеть, что он прочитает этот тикет. И здесь вы можете видеть, что именно это и есть. Как я уже упоминал, автоматизация всего исправления ошибок для жизненного цикла Jira, верно? От исправления до передачи в QA. Так что он прочитает ветку, прочитает тикет, выполнит проверку QA, а также просмотрит лог sentry. Если у вас есть какая-либо система логирования, вы также можете указать ей на сервер MCP, попытаться получить любые связанные логи за этот период времени и попытаться зарегистрировать их и посмотреть, можем ли мы провести исследование, попытаться увидеть, есть ли какие-либо общие закономерности, которые мы можем извлечь. Затем мы спланируем это, выполним реализацию, и в конечном итоге здесь мы сможем просмотреть это и выполнить проверку совместимости, выполнить QA, а также посмотреть, можем ли мы создать какие-либо логи sentry, чтобы убедиться, что эта проблема не повторится, верно? Или, по крайней мере, мы сможем добавить больше логов для отладки нашей будущей системы. И мы также будем убеждаться, что мы можем упростить вещи, и в конечном итоге здесь мы зафиксируем это и сможем слить наши текущие рабочие деревья, если они были созданы в другом рабочем дереве, и мы также отправим их в versel, управляя развертыванием здесь, а также отправляя их в тикет Jira и обобщая все, и вы можете видеть, что это сколько этапов это заняло, а также сколько агентов будет запущено, и примерно сколько токенов будет потреблено для такого рода процесса, и мы можем видеть, что для каждого из этих шагов, например, для шагов проверки QA, которые используют навык playright COI, который я упоминал ранее. И для шагов планирования и реализации я использовал суперсилы. Планирование и реализация, мозговой штурм, расследования — все это из предыдущего навыка, который я упоминал ранее. И, конечно же, если вы хотите узнать больше об этом конкретном навыке, который я создал, обязательно посмотрите это видео прямо здесь, где я провел полное глубокое погружение в то, как я смог создать этот навык, чтобы заменить почти 90% работы младшего инженера-программиста, которая, по сути, заключается в попытке реализовать исправление ошибок в ваших приложениях. И я смог автоматизировать весь этот процесс, используя этот подход. Так что обязательно посмотрите это видео, и я обязательно оставлю это видео по ссылке в описании ниже.
Хорошо, как вы можете видеть, это все навыки, которые мы рассмотрели от фундаментальных до продвинутых рабочих процессов, о которых мы только что говорили в этом видео. Так что обязательно посетите наше школьное сообщество, где вы можете получить все ресурсы, которые я упомянул в этом видео, а также не забудьте поставить лайк этому видео и подписаться на канал, если вы нашли ценность. Но сказав это, я увижу вас в следующем видео.