overwritten.site: AI가 실시간으로 코드를 수정하는 협업 웹사이트

실용적 조언

신뢰할 수 없는 코드를 실행할 때는 Docker 컨테이너를 매번 새로 생성하여 격리 환경을 유지해야 한다.
브라우저 API를 사용자 코드 로드 전에 미리 캡처해두면 런타임에서의 악의적인 API 오버라이딩을 방지할 수 있다.
Playwright와 같은 브라우저 자동화 도구를 배포 파이프라인에 통합하여 시각적 파손을 자동으로 감지할 수 있다.

섹션별 상세

실시간 웹사이트 수정 워크플로를 구축했다. 사용자가 60자 이내의 프롬프트를 제출하면 Gemini와 Haiku 모델이 중재를 수행하고, 통과된 요청은 Docker 컨테이너 내의 aider로 전달되어 코드를 생성한다. 생성된 결과물은 다시 한번 중재를 거친 후 Playwright를 통해 사이트 파손 여부를 확인하고 최종 반영된다. 이 과정은 사용자 입력부터 배포까지 자동화된 파이프라인으로 작동한다.

보안 및 샌드박싱 전략을 통해 안전성을 확보했다. 사용자 코드가 시스템에 악영향을 미치는 것을 방지하기 위해 매 생성마다 새로운 Docker 컨테이너를 생성하고 내부 전용 네트워크를 사용한다. 핵심 사이트 요소는 보호되며, 사용자 코드가 로드되기 전에 기본 브라우저 API를 캡처하여 API 오버라이딩을 통한 공격을 차단한다. 이러한 다중 계층 보안 설계를 통해 실시간 코드 반영의 위험성을 관리한다.

수익화 및 큐 관리 시스템을 도입했다. 사용자에게 시간당 3회의 무료 슬롯을 제공하는 프리 레인과 Stripe를 통한 입찰 방식의 우선순위 레인을 운영한다. 우선순위 레인은 최소 2달러부터 0.5달러 단위로 입찰하며, 높은 금액을 제시한 사용자의 프롬프트가 먼저 처리되는 구조이다. 이는 서버 비용을 충당하면서도 활발한 참여를 유도하는 경제적 모델로 설계되었다.

용어 해설

에이더(aider): — LLM과 연동하여 소스 코드를 직접 수정하고 Git 커밋까지 자동화하는 명령줄 도구이다. 이 프로젝트에서는 사용자의 프롬프트를 실제 코드로 변환하는 핵심 엔진 역할을 수행하며, 복잡한 코드 편집 작업을 자동화하여 실시간 사이트 수정을 가능하게 한다.
샌드박싱(Sandboxing): — 외부에서 유입된 프로그램이나 코드를 시스템의 다른 부분과 격리된 독립된 환경에서 실행하는 보안 기술이다. overwritten.site에서는 신뢰할 수 없는 사용자 생성 코드가 서버 전체의 보안을 위협하거나 데이터를 탈취하지 못하도록 차단하는 방어막 역할을 한다.
도커 컨테이너(Docker Container): — 애플리케이션과 실행 환경을 하나로 묶어 어디서나 동일하게 실행할 수 있게 하는 가상화 기술이다. 매번 새로운 컨테이너를 생성하여 이전 작업의 잔재를 없애고, 독립된 네트워크 환경을 제공함으로써 사용자 간의 간섭과 보안 사고를 방지한다.
플레이라이트(Playwright): — 웹 브라우저를 프로그래밍 방식으로 제어하고 테스트할 수 있는 오픈소스 라이브러리이다. AI가 생성한 코드가 웹사이트의 레이아웃을 무너뜨리거나 필수 기능을 작동 불능으로 만들지 않았는지 배포 전 단계에서 자동으로 검사하여 사이트의 안정성을 유지한다.

언급된 도구

aider추천

AI 기반 코드 생성 및 수정 엔진

Docker추천

코드 실행 환경 격리 및 샌드박싱

Playwright추천

웹사이트 무결성 검증 및 자동화 테스트

Gemini추천

입출력 콘텐츠 중재(Moderation)

언급된 리소스

Demooverwritten.site