브라우저에서 대화하며 코딩하는 '말하는 HTML 놀이터'

터미널 명령어 대신 웹 브라우저 창을 통해 클로드(Claude) AI와 대화하며 코딩하는 새로운 실험적 방식입니다. 화면을 클릭하거나 내용을 바꾸는 것만으로 AI에게 다음 수정을 맡길 수 있어 훨씬 직관적입니다.

이 프로젝트는 클로드 개발 도구(Claude Code)와 웹 브라우저를 연결해 주는 기발한 아이디어를 담고 있습니다. 로컬 웹 페이지에서 사용자가 버튼을 누르거나 입력을 하면 그 내용이 파일로 저장되고, 클로드 AI가 이 파일을 실시간으로 읽어 코드를 즉시 고쳐줍니다. 이런 방식은 내가 만든 화면을 바로 확인하면서 AI에게 피드백을 줄 수 있어 UI 개발 속도를 크게 높여줍니다. 또한 코딩을 배우는 대화형 수업 기능이나 코드 수정을 편하게 검토하는 기능도 들어있어 혼자 일하는 개발자에게 매우 유용합니다.

핵심 포인트

  • 복잡한 명령어 대신 웹 브라우저 화면을 보며 AI에게 지시를 내릴 수 있습니다.
  • 브라우저에서의 동작이 AI의 코드 수정을 실시간으로 유도합니다.
  • 웹사이트 화면을 직접 보면서 고칠 수 있어 개발 과정이 훨씬 빨라집니다.
  • 별도의 복잡한 설정 없이 내 컴퓨터 안의 파일만 활용해 간편하게 작동합니다.

용어 한 줄 설명

터미널
명령어를 입력해 컴퓨터를 조작하는 검은 화면 형태의 도구입니다.
명령
AI가 무엇을 할지 알려주기 위해 입력하는 짧은 안내 글입니다.
클로드
텍스트와 이미지를 사람처럼 이해하고 분석하는 인공지능 모델의 이름입니다.
코딩
컴퓨터가 이해할 수 있는 언어로 명령을 작성하여 프로그램을 만드는 일입니다.
개발 도구
소프트웨어를 만들거나 관리할 때 쓰는 도구입니다.
개발
컴퓨터 프로그램을 만드는 모든 과정입니다.
아이디어
새로운 사업이나 제품을 만들기 위한 생각이나 구상입니다.
피드백
사용자가 한 행동이 맞는지 틀린지 알려주는 반응입니다.
원문 보기