Transcription
Все пишут код с помощью ИИ в наши дни. Cloud code, cursor, wind serve — все они мощные. Но вот в чем дело: скорость не означает надежность. ИИ может написать тысячи строк кода. Но главный вопрос: [музыка] работает ли это на самом деле? Если вы пользовались этим инструментом, вы знаете, о чем я говорю. Половину времени приложение выглядит хорошо, пока вы его не запустите, а затем вы обнаружите сломанные логические потоки, отсутствующие функции и странные ошибки. Итак, всем привет, я Аниндам, и в этом видео я покажу вам точный рабочий процесс, который я использую, чтобы [музыка] мой сгенерированный ИИ код был надежным и готовым к производству. Звучит интересно. Если вы еще не подписались на мой канал, сделайте это [музыка] сейчас, и, не теряя больше времени, давайте начнем. Прежде чем двигаться дальше, быстрая благодарность сегодняшнему спонсору Test [музыка] Pride. Test Pride — это самый простой агент для тестирования программного обеспечения на основе ИИ для полностью автономного тестирования. [музыка] Это ИИ без кода, который завершает полные циклы тестирования за 10-20 минут. [музыка] Так вы можете выпускать продукт с уверенностью, не занимаясь ручным QA. А с сервером MCP от Tespit ваш ИИ-ассистент в IDE, включая Cloud code, может выполнять весь рабочий процесс тестирования прямо из вашего редактора. Итак, вот как это работает. Сначала он читает ваш PRD или спецификацию продукта непосредственно из контекста вашего Cloud code. Он автоматически генерирует полный план тестирования на основе логики вашего приложения. Затем он автоматически пишет тестовые случаи для фронтенда и бэкенда и запускает их в облаке. Затем он обнаруживает сломанные или отсутствующие функции. [музыка] И, наконец, он точно говорит Cloud code, что исправить. Хорошо, давайте перейдем к нашему фактическому рабочему процессу. Для этой демонстрации я буду использовать этот репозиторий. Это совместное приложение в производственном стиле, созданное с использованием NexJS, build tailwind и radics UI. Я считаю, что это отличный пример, потому что он имеет UI [музыка] состояние, логику, API-маршруты и пользовательские потоки. Я уже клонировал репозиторий и открыл его в своем редакторе cursor, а также открыл Cloud code в терминале, как вы можете видеть здесь. Кроме того, если вы не комфортно с версией терминала, вы можете использовать расширение Cloud code для VS Code, которое предоставляет вам интерфейс, похожий на чат, к которому мы привыкли с cursor. Вы можете видеть здесь, это интерфейс, который вы получаете. Но я предпочитаю версию терминала. Так что я просто открою версию терминала. Теперь давайте пройдемся по шагам один за другим. Сначала начните с четкого плана. Я видел, как многие люди открывают Cloud и говорят: "Создай это, создай [музыка] то" и сразу переходят к коду. Но это самый быстрый способ получить сломанные потоки, отсутствующие состояния и наполовину реализованные функции. Вместо этого я всегда начинаю с запроса у clude подробного пошагового плана для функции, которую я хочу реализовать. И как только он сгенерирует план, я просматриваю его, вношу некоторые улучшения и делаю его в соответствии с тем, как я хочу реализовать функцию. [музыка] И только когда план станет кристально ясным, я позволю Claude писать код. Этот дополнительный шаг может фактически уменьшить количество потенциальных ошибок или отсутствующих функций, которые мы можем получить при работе с Cloud code. Теперь давайте посмотрим на пример. Хорошо, теперь я открыл клон веб-сайта продукта. Как вы можете видеть здесь, веб-сайт довольно статичен. Я не добавил много деталей и много динамических элементов. Так что вы можете видеть, что кнопка "upboard" также статична. Она не работает. Если я нажму на нее, она не изменится. Но в идеале она должна измениться с 241 на 242, а кнопка "upote" должна измениться на "uploaded". Но в настоящее время это не так. Итак, теперь мы попросим clot code реализовать эту функцию. Итак, позвольте мне написать промпт здесь. Хорошо. Итак, вы можете видеть, что я упомянул: "Создай план для изменений кнопки статического upward". По умолчанию 241 очко, и после нажатия должно быть 242 очка, а базовую логику мне не нужно упоминать вам снова и снова. Итак, вы можете видеть, что он начал с получения ENB из самого cursor, и он просто исследует код, где он находится, и отлично, он создал план реализации здесь, как вы можете видеть здесь. Итак, динамическое переключение вывода, где местоположение, что ему нужно изменить, а затем вы можете видеть изменения UI и все другие изменения, которые нам нужно сделать здесь, все упомянуто: изменения UI, изменения состояния, изменения логики API и ключевые случаи H и соображения, которые нам нужно иметь здесь. Итак, теперь у нас есть план, следующий шаг — попросить CL реализовать функцию на основе этого плана. Итак, позвольте мне написать это. Хорошо. Итак, он начал, и вы можете видеть, что он начал вносить изменения. Так что мы просто принимаем это, и отлично, он реализовал, как вы можете видеть, все файлы, которые он изменил, всю логику, которую он изменил. Итак, вот краткое резюме. Вы можете быстро просмотреть его и увидеть, соответствует ли все вашему плану. Итак, мы можем видеть изменения UI, изменения состояния, логику API и обработанные HS. И теперь, чтобы протестировать все, нам нужно только npm rundev. Так что мы сделаем это, и давайте снова откроем проект. Давайте посмотрим, работает ли кнопка "upboard". Итак, я просто нажму на нее, и отлично, как вы можете видеть здесь, она работает. Состояние изменилось, и если я нажму снова, оно также вернется в предыдущее состояние. Так что это действительно хорошо. Итак, он реализовал функцию. Теперь давайте перейдем к следующему шагу. Итак, следующий — использовать поток разработки, управляемый тестами. Итак, при создании нового проекта я всегда следую потоку разработки, управляемому тестами. Но вместо того, чтобы писать тесты вручную или просить clot писать их, я использую сервер Test sprite MCB, который делает процесс намного более плавным. [музыка] С Test sprite весь процесс становится почти легким. Теперь давайте посмотрим на это в действии. Итак, я открою свой файл тестов dashboard и [музыка] нажму на test locally, а затем quick install. Итак, у нас есть три простых шага. Сначала мы создадим здесь API-ключ и нажмем new API keys, и я просто напишу YouTube [музыка] demo и просто скопирую ключ, и я просто использую эту команду, уже предоставленную командой test right. Так что просто скопируйте [музыка] ее и вставьте в терминал и замените API-ключ правильным. Отлично. Итак, мы видим, что файл был изменен, и теперь мы должны иметь возможность использовать сервер MCP, и все, что нам нужно сделать, это просто скопировать этот промпт и попросить Test sprite протестировать наш проект, и он сделает все остальное за нас. Итак, позвольте мне открыть мою новую сессию Cloud здесь, и давайте проверим, работает ли MCP. Хорошо, он подключается сейчас и подключен. Так что мы должны иметь возможность использовать серверы Test bed MCP здесь. Теперь позвольте мне просто вставить промпт здесь. Так что он сделает работу за нас. Хорошо. Итак, он начал работать, и вы можете видеть, что он начал первый шаг, который является генерацией сводки кода, и он использует этот инструмент Test by generate code summary, и я просто продолжу с yes, и вы можете видеть сводку, которую он сгенерировал, так что я просто приму ее. Итак, это сводка, которую вы можете видеть, клон продукта, описание, стили языка и некоторые метаданные вокруг него, и отлично, он сгенерировал сводку здесь также. Итак, вы можете видеть обзор проекта, ключевые функции, текстовый тег, сводку кода и все остальное. Также сводка кода была сохранена в файле code summit.json. Так что после подтверждения он начнет переходить к следующему шагу, который заключается в генерации P bootstrapping test, создании плана тестирования и выполнении тестов. Так что я просто напишу yes, и он сделает следующие шаги. Хорошо. Итак, следующий шаг — генерация стандартизированного PD. Я принял это. Затем мы будем использовать следующий инструмент, который является Test pad bootstrap test. Он начнет тестирование. [музыка] Так что я просто выберу yes, и он откроет интерфейс, подобный этому. Итак, у него два режима. Если вы хотите протестировать фронтенд, вы можете выбрать фронтенд, иначе вы можете использовать бэкенд. А также для областей действия вы можете использовать кодовую базу для полной проверки кодовой базы или для глубокой проверки кода, чтобы проверить последнюю реализованную вами функцию. Также, если у аккаунта есть что-то вроде входа или регистрации, вы можете предоставить имя пользователя и пароль тестового аккаунта, чтобы он мог войти от вашего имени и протестировать приложение. Затем он предложит порт локальной разработки, который не является, а также PD doc, который уже загружен здесь. И теперь мы продолжим. Итак, для этого я хочу использовать только полную кодовую базу, чтобы увидеть, какие изменения нам нужно внести, чтобы сделать ее надежной. Хорошо. Итак, он начнет автоматически. Вы можете видеть здесь. Итак, одна вещь, которую нужно иметь в виду, это то, что это долгий процесс, как также упомянуто здесь. Это занимает несколько минут, до 15 минут. Так что вам придется быть немного терпеливыми. Итак, что вы можете сделать, это просто нажать ctrlb, чтобы запустить его в фоновом режиме. Теперь давайте откроем панель управления тестами, чтобы увидеть, как это выглядит на самом деле. Хорошо. Итак, вы можете видеть, что клон продукта, и он выполняет 15 тестов. Все они фронтенд, и вы можете видеть, что он в процессе, и скоро, когда тесты будут проходить, мы сможем увидеть результат: провалился он или прошел. Вы можете видеть подробные журналы этого, а также подробное видео тестов, которые он выполнил. Итак, давайте посмотрим. Итак, здесь он проверяет функциональность upward, синхронизацию upward между браузерами, задачи и многое другое. Итак, давайте откроем его. Хорошо. Итак, мы можем теперь воспроизвести видео, чтобы увидеть, что именно он пытался сделать и какой результат он получил. Итак, вы можете видеть, что он нажал в двух местах, и это сработало. Так что тест успешен. Вы также можете проверить код здесь, который написан на playright, и вы также можете запустить этот код, чтобы [музыка] воспроизвести то же самое. Аналогично, мы можем видеть здесь также, что он пытался сделать, и это результат, который он получил. Так что он действительно сработал. И снова, [музыка] аналогично, у нас есть код здесь. Мы можем видеть, что другие тесты провалились. Э-э, давайте проверим один из них, почему он провалился. Итак, вы можете видеть [музыка], что UI тест провалился, и он на самом деле не сработал. Так что мы можем видеть здесь основную проблему, почему он провалился. Итак, у него есть проблемы с websocket. Так что основная причина, как я думаю, заключается в том, что он не может использовать файл env weld, и это вызвало эту проблему [музыка], что имеет смысл. Так что мы можем видеть, что многие тесты прошли, и хорошо, это функциональность upward, которую мы только что реализовали, и вы можете видеть, что сделанное, функция загрузки работает, так что тестовый случай успешен. Нажал на дубликаты, и это сработало. Так что тест успешен. Хорошо. Итак, вы можете видеть, что он завершил тестирование, и теперь он может сгенерировать окончательный отчет о тестировании. Я просто введу yes, и он сгенерирует полный отчет о тестировании здесь, который мы затем можем использовать для исправления проблем. Хорошо. И здесь мы можем видеть, что он сгенерировал полный отчет. Он содержит сводку валидации требований и все тестовые случаи, а также анализ причин сбоя. Какова фактическая проблема? Вы можете видеть ошибки, которые он упомянул. Так что мы можем просто быстро использовать это и упомянуть это для исправления проблем на основе этого. И мы можем видеть, что он завершил тестирование. И вы можете видеть, что у нас только восемь прошли, а семь провалились. И он нашел здесь критические ошибки, которые являются ошибкой сохранения состояния upward, сетевой проблемой кнопки ответа, сломанной навигацией по похожим продуктам, и что нужно исправить, и общие файлы здесь, и он также рекомендовал приоритет того, что вы должны исправить в первую очередь, и их приоритет, и вы можете использовать подробный отчет здесь, чтобы исправить их. Двигаясь дальше, вы можете просто использовать этот документ и исправить ошибки, на которые он указал. Так что это упростит весь процесс. Следующий шаг, который я часто использую, — это контрольная точка. Так что Cloud code автоматически создает контрольные точки перед каждым редактированием. Так что вам не нужно делать ручные резервные копии. И если что-то пойдет не так, вы можете просто нажать escape + escape, открыть меню перемотки и восстановить либо разговор, либо код, либо оба. Это действительно полезно, если вы работаете над большим проектом и вносите множество изменений. Так что это становится очень удобным. Так что я могу просто показать здесь. Все, что вам нужно сделать, это просто нажать escape [музыка] escape, и вы получите такие варианты. Восстановить код или разговор до точки. Помоги мне протестировать этот проект с Test sprite или подождать до завершения. Так что я просто пойду сюда. Итак, в настоящее время вы можете видеть, что изменений кода нет, потому что мы просто тестировали здесь. Так что, если вы работаете над большими проектами, которые будут иметь изменения кода, вы можете просто переключаться между ними. Это будет очень удобно. Еще один шаг, который я считаю очень полезным, — быть очень конкретным с инструкциями. Я видел, как многие люди дают очень расплывчатые инструкции Cloud code, и это на самом деле генерирует очень плохой вывод, потому что Cloud также становится очень трудно понять, каковы точные требования. Так что лучший способ — вы можете просто упомянуть, какой стек вы используете, какие инструменты вы хотите использовать, как вы хотите реализовать, и высокоуровневую архитектуру этого. Это даст четкое представление Cloud о том, что вы собираетесь реализовать, и это также полезно, когда вы используете режим плана. Чем больше информации вы можете предоставить о проекте и функции, тем лучший план вы можете получить, что в конечном итоге приведет к лучшему результату. Всякий раз, когда я его использую, я точно говорю ему, что [музыка] использовать, например, использовать компонент radics или придерживаться классов tailwind, которые я уже использовал, использовать ту же цветовую схему, которую я использовал во всем приложении, чтобы поддерживать ту же тему. Так что это некоторые примеры, которые вы также можете попробовать. Следующее — использовать среды песочницы для рискованных операций. Когда я позволяю Cloud изменять каталоги, перемещать файлы или автоматизировать повторяющиеся задачи, я включаю режим песочницы. Так что это на самом деле ничего не нарушает. Чтобы включить режим песочницы, что вы можете сделать, это просто перейти и использовать команду / sandbox. Вы также можете делать много других вещей здесь. Вы можете видеть, какие команды вы хотите исключить, и так далее. В настоящее время песочница отключена. Все, что мне нужно сделать, это просто ввести здесь, и мы можем выбрать режим песочницы с пакетными инструментами с autoallow в режиме редактирования. Так что вы выбираете здесь варианты, и чтобы узнать больше, вы всегда можете перейти к документам здесь. Так что последние обновления песочницы Cloud фактически изолируют рискованные пути кода. Это уменьшает случайные записи в файловой системе, сетевой доступ или неограниченные мутации. Так что это фактически защищает ваш проект от случайных изменений. Вы можете видеть здесь, у нас есть переопределения. Режим песочницы не включен. Мы можем включить [музыка] здесь, и вы можете видеть, что песочница включена с autoallow для пакетных команд в режиме принятия правок. Так что он примет все правки. Так что теперь, если вы хотите, если вы хотите отключить это, это просто просто, просто запустите это снова, и вы можете видеть переопределения здесь. Э-э, разрешить резервные копии без песочницы или строгий режим песочницы. Так что это делает: когда команда завершается с ошибкой из-за ограничения песочницы, Cloud повторит ее с опасным отключением песочницы, что фактически выполнит ее вне песочницы. Иногда это становится немного рискованно. Так что то, что я пытаюсь сделать, это использовать строгий режим песочницы. Так что все пакетные команды, вызываемые моделью, выполняются в песочнице, если они явно не указаны в исключенных командах. Так что вы можете видеть, что, и теперь, если мы пойдем сюда снова и посмотрим на конфигурацию, вы можете видеть, что исключенных команд нет. Так что вы также можете исключить некоторые команды, которые вы не хотите запускать в песочнице. Это делает весь процесс более безопасным, и это фактически не нарушает ваш локальный проект или систему. Так что теперь я просто закрою его. без песочницы и [музыка] я отключил песочницу здесь. Последнее, но не менее важное: сохраняйте контекст для будущей работы. Так что Cloud code использует реальные файлы памяти, а не просто долговременную память ИИ. Так что после того, как я закончу проект, я обновлю файл Cloud.md проекта. Так что Claude остается последовательным между сессиями. Итак, вот как я это добавляю. Я просто использую сокращение хеша. Здесь вы можете видеть "Добавить в память". Затем вы можете выбрать область действия, где вы хотите хранить память. Это память проекта или память пользователя. В этом случае мы используем ее для хранения в памяти проекта. Так что я выберу здесь. Вы можете видеть здесь, что он обновил файл Cloud.MD пользовательскими инструкциями. Так что это держит Claude в соответствии со структурой проекта каждый раз, когда я возвращаюсь, и [музыка] это останавливает его от принятия случайных решений в последующих промптах. В целом, вывод LLM становится намного, намного лучше и релевантнее нашему проекту. Это моя полная система для выпуска надежного кода с помощью Cloud code. Я сначала планирую, запускаю полный цикл разработки, управляемый тестами, и позволяю Claude применять исправления [музыка] перемотать сессии и, наконец, обновить память, чтобы она оставалась постоянной между сессиями. В целом, Claude берет на себя основную работу. Testbrite гарантирует, что каждая функция работает должным образом, а я просто направляю прямые изменения. Test sprite за поддержку этого видео. Если вы хотите попробовать эту настройку самостоятельно, у Testbrite есть надежный бесплатный план с 150 ежемесячными кредитами. И если вы хотите более быстрые запуски и лучшие модели, стартовый и стандартный планы оба включают бесплатный первый месяц для новых пользователей. Так чего же вы ждете? Подключите Test flight к своему рабочему процессу Cloud code и попробуйте, пока промо-акция действует. Так что, если у вас есть еще советы, которыми вы хотите поделиться, поделитесь ими в комментариях. Я хотел бы знать, какие стратегии вы используете для выпуска надежного кода. И я надеюсь, что вы нашли это полезным. Если так, поделитесь с друзьями и подпишитесь на мой канал. И это все на сегодня. Увидимся в следующем видео. Пока.