Uncategorized

새로운 핸드오프: AI 에이전트의 코드를 팀과 공유하는 방법1 min read

Reading Time: 3 minutesAI 생성 코드를 소스, 작업 버전 또는 사람과 AI 에이전트가 함께 검토하고 계속할 수 있는 공유 아티팩트로 공유하는 방법을 알아보세요.

Turn AI-generated code into a shared live app

새로운 핸드오프: AI 에이전트의 코드를 팀과 공유하는 방법1 min read

Reading Time: 3 minutes

AI 에이전트가 방금 유용한 것을 만들었습니다. 대시보드, 새로운 온보딩 흐름 또는 작은 내부 앱일 수도 있습니다.

작동하는 것을 볼 수 있습니다. 코드가 좋아 보입니다. 이제 팀원이 매우 합리적인 질문을 합니다.

“나한테 보내주실 수 있나요?”

AI 코딩 워크플로가 수동으로 전달되는 경우가 바로 여기에 있습니다. 스크린샷을 보내고, 코드 조각을 복사하고, 분기를 푸시하거나, 프로젝트를 로컬에서 실행하는 방법을 설명합니다.

그러나 요청하는 사람은 소스 코드를 원하지 않을 수도 있습니다. 그들은 제품을 열어보고, 사용해 보고, 변경해야 할 사항이 무엇인지 알려주고 싶어합니다.

AI 생성 코드를 공유하는 올바른 방법은 다음에 무슨 일이 일어나는지에 달려 있습니다.

첫째, 실제로 무엇을 공유하고 있나요?

누군가 AI 에이전트가 생성한 코드를 요청하면 세 가지 다른 의미를 가질 수 있습니다.

1. 소스코드

개발자는 구현을 검사하고, 테스트를 실행하거나, 기존 코드베이스에 병합해야 합니다.

일반적으로 Git 저장소와 풀 요청이 정답입니다. 변경 사항을 검토하고, 테스트를 확인하고, 코드를 프로덕션에 통합하는 데 익숙한 워크플로를 제공합니다.

2. 작업 버전

제품 관리자가 온보딩 흐름을 클릭하고 싶어합니다. 디자이너는 반응형 레이아웃을 보고 싶어합니다. 이해관계자가 대시보드를 사용해 보고 싶어합니다.

여기서는 소스 파일을 보내는 것이 특별히 유용하지 않습니다. 브라우저에서 열 수 있는 앱이나 아티팩트가 필요합니다.

3. 다른 사람이 계속할 일

팀원은 앱을 검토하고, 변경 사항을 제안하고, AI 에이전트가 피드백을 구현하도록 하려고 합니다.

이는 다른 종류의 핸드오프입니다. 대상에는 스냅샷 이상의 내용이 저장되어야 합니다. 작업과 그 역사를 보존하고 작업을 계속하는 사람이 접근할 수 있도록 해야 합니다.

이러한 워크플로는 겹치지만 서로 바꿔 사용할 수는 없습니다.

코드를 공유하는 것과 업무를 넘겨주는 것의 차이점

상담원이 고객 분석 대시보드를 구축한다고 상상해 보세요.

여기에는 3개의 KPI 카드, 사용량 차트, 날짜 필터가 포함되어 있습니다.

팀원에게 React 파일을 보낼 수 있습니다. 결과를 보려면 개발 환경이 필요합니다.

스크린샷을 보낼 수 있습니다. 그들은 레이아웃을 이해하지만 필터를 테스트할 수는 없습니다.

어딘가에 배포할 수 있습니다. 상호 작용할 수 있지만 피드백을 수집하고 프로젝트를 업데이트하는 프로세스는 여전히 필요합니다.

이제 약간 다른 작업 흐름을 상상해 보세요.

에이전트는 공유 아티팩트 작업 영역에 대시보드를 생성하고 해당 URL을 제공합니다.

팀원이 아티팩트를 열고 필터를 테스트한 후 차트에 피드백을 남깁니다. 에이전트에게 동일한 아티팩트를 변경하도록 요청합니다.

URL은 동일하게 유지됩니다. 작품에는 역사가 있습니다. 다른 대화를 시작하거나 이전 에이전트가 구축한 내용을 설명할 필요가 없습니다.

이것이 디자인할 가치가 있는 핸드오프입니다.

AI 생성 코드를 팀과 공유하는 방법

다음은 실제 작업 흐름입니다. AgentGrid.io, Anima가 구축한 사람과 AI 에이전트를 위한 공유 아티팩트 작업공간입니다.

1단계: 선호하는 AI 코딩 도구로 구축

Claude Code, Codex, Cursor 또는 사용하기 편한 다른 도구를 사용하여 계속 작업하세요.

예를 들면:

사용량 차트, 날짜 필터, 3개의 KPI 카드를 사용하여 반응형 제품 분석 대시보드를 구축하세요. React를 사용하세요.

코드를 생성하는 데 사용하는 도구를 변경할 필요가 없습니다.

2단계: 팀이 액세스할 수 있는 위치에 결과 저장

에이전트를 AgentGrid에 연결하고 다음을 질문하세요.

이 대시보드를 AgentGrid에 앱으로 배치하세요. 나에게 아티팩트 링크를 제공하고 비공개로 유지하세요.

AgentGrid는 앱을 자체 URL 및 버전 기록과 함께 아티팩트로 저장합니다.

독립적으로 연결할 수 있는 코딩 에이전트를 사용하는 경우 다음을 따르세요. AgentGrid 연결 지침. Claude 또는 ChatGPT와 같은 브라우저 기반 도우미는 지원되는 통합을 사용합니다.

중요한 부분은 에이전트가 액세스 권한이 있는 작업 영역에 아티팩트를 생성한다는 것입니다.

3단계: 팀원에게 액세스 권한 부여

아티팩트를 열고 해당 링크를 복사합니다.

보내기 전에 팀원이 작업 공간에 액세스할 수 있는지 확인하세요. 개인 아티팩트 URL은 저작물을 식별합니다. 그 자체로는 권한을 부여하지 않습니다.

내부 협업의 경우 일반적으로 이것이 원하는 것입니다. 팀원은 작업을 공개적으로 액세스하지 않고도 검토할 수 있습니다.

참조 아티팩트 공유 작동 방식.

4단계: 실제 결과에 대한 피드백 수집

팀원이 대시보드를 열고 날짜 필터가 예상대로 작동하지 않는 것을 발견했습니다.

어떤 구성 요소가 손상되었는지 설명하는 별도의 Slack 메시지를 작성하는 대신 아티팩트의 관련 부분에 첨부된 피드백을 남길 수 있습니다.

AgentGrid는 앱 요소 및 문서 구절에 대한 리뷰 댓글을 지원합니다. 승인된 사람과 대리인은 해당 댓글을 함께 작업할 수 있습니다.

그러면 검토 중인 항목에 대한 토론이 계속 진행됩니다.

5단계: 상담원이 작업을 계속하도록 허용

이제 연결된 에이전트에게 다음과 같이 말할 수 있습니다.

이 AgentGrid 아티팩트를 열고 날짜 필터를 수정하세요. 기존 레이아웃을 유지하고 동일한 아티팩트를 업데이트합니다.

실제 아티팩트 URL을 포함하세요.

에이전트는 필요한 액세스 권한과 기능이 있는 경우 아티팩트를 검사하고 업데이트할 수 있습니다.

변경 사항은 변경한 에이전트에 따라 동일한 버전 기록에 표시됩니다. 팀원은 동일한 아티팩트로 돌아가 결과를 검토할 수 있습니다.

참조 AgentGrid의 버전 기록.

Claude, ChatGPT, Cursor 및 Codex는 어떻습니까?

일부 AI 도구에는 이미 유용한 기본 공유 기능이 있습니다.

Claude는 생태계 내에서 지원되는 아티팩트를 공유할 수 있습니다. GitHub는 ​​코드 검토에 적합합니다. 개발 플랫폼은 미리 보기 배포를 제공할 수 있습니다.

단지 무언가를 공유하기 위해 이러한 워크플로를 교체할 필요는 없습니다.

AgentGrid는 다음 단계가 포함될 때 유용합니다. 동일한 아티팩트를 작업하는 사람과 에이전트, 특히 다양한 AI 도구에서 그렇습니다.

예를 들어 팀에서는 Claude를 사용하여 인터페이스 초안을 작성하고, Codex를 사용하여 동작을 개선하고, 인간 검토자가 피드백을 남길 수 있습니다.

공유 아티팩트는 해당 작업의 공통 대상을 제공합니다.

대신 언제 게시해야 합니까?

공개 데모가 필요한 고객과 같이 작업 공간 외부의 사람들을 위한 작업인 경우 해당 작업을 게시할 수 있습니다.

AgentGrid는 지원되는 앱 및 Markdown 아티팩트를 공개 URL에 게시할 수 있습니다.

그러나 공유와 게시는 동일한 작업이 아닙니다.

비공개 아티팩트 링크에는 승인된 작업공간 액세스가 필요합니다. 게시된 배포는 공개적으로 액세스할 수 있습니다. 나중에 아티팩트에 대한 변경사항이 해당 공개 페이지에 표시되기 전에 다시 게시되어야 합니다.

의도한 경우에만 게시하세요.

상담원이 끝나면 물어보는 것이 더 좋은 질문입니다.

“파일 내보내기”로 모든 코딩 세션을 끝내는 대신 다음과 같이 질문하십시오.

다음에 이 제품이 필요한 사람은 누구이며, 이 제품으로 무엇을 해야 합니까?

개발자가 코드를 병합해야 하는 경우 풀 요청을 생성하세요.

누군가 앱을 테스트해야 하는 경우 작동하는 미리보기를 제공하세요.

사람과 대리인이 함께 작업을 검토하고 계속해야 하는 경우 공유 공간을 제공하세요.

AI 코딩 세션의 출력이 워크플로의 끝일 필요는 없습니다. 그것은 다른 모든 사람들의 출발점이 될 수 있습니다.

👉 AgentGrid를 살펴보세요.

FAQs

|

Co-founder & CPO