agentation

Agentation은 실행 중인 웹 페이지에서 보이는 것과 AI 코딩 에이전트가 소스에서 변경해야 하는 것 사이의 간극을 메우기 위해 설계된 시각적 피드백 도구입니다. UI 문제를 글로 설명하는 대신, 직접 가리키면 됩니다. 작동 방식: 패키지를 개발 의존성으로 설치하고 앱과 함께 `<Agentation />` 컴포넌트를 렌더링합니다. 오른쪽 하단 모서리에 툴바가 나타납니다. 이를 활성화한 다음 페이지의 아무 요소나 클릭하여 주석을 답니다. 이 도구는 클래스 이름, CSS 선택자, 요소 위치를 캡처한 후, 복사하여 에이전트에 전달할 수 있는 구조화된 마크다운 출력을 생성합니다. README의 예시는 "사이드바의 파란 버튼"이라고 말하는 대신, `.sidebar > button.primary`와 메모를 에이전트에 제공하여 에이전트가 직접 grep할 수 있게 하는 것입니다. README에 나열된 주요 기능: - 자동 선택자 식별로 모든 요소를 클릭하여 주석 달기 - 특정 콘텐츠에 주석을 달기 위한 텍스트 선택 - 여러 요소를 드래그하여 다중 선택 - 요소가 없는 영역도 주석을 달 수 있는 영역 선택 - CSS, JS, 비디오 애니메이션을 고정하여 특정 상태를 캡처하는 애니메이션 일시 정지 - 선택자, 위치, 컨텍스트를 포함한 구조화된 마크다운 출력 - 시스템 기본 설정을 따르거나 수동으로 설정하는 다크 및 라이트 모드 - 순수 CSS 애니메이션을 사용하는 런타임 의존성 제로 요구 사항 및 범위: React 18 이상, 데스크톱 브라우저(모바일은 지원되지 않음). 이 프로젝트는 에이전트 독립적이므로 복사된 출력이 특정 AI 코딩 어시스턴트에 묶여 있지 않습니다. 라이선스: README에 따르면 이 프로젝트는 2026 Benji Taylor의 저작권이며 PolyForm Shield 1.0.0에 따라 라이선스가 부여됩니다. 이는 기존 오픈소스 라이선스가 아닌 소스 사용 가능 라이선스이므로 상업적 사용 전에 약관을 검토하세요. 전체 문서는 agentation.com에서 호스팅됩니다.