비전트 AI 호스팅 · 편집기 시작하는 7가지 방법 3편
구독 중인 ChatGPT, Claude, Codex 같은 AI를 편집기에 연결하면, AI에게 말로 시켜 홈페이지를 만들고 고칠 수 있습니다. 코드나 키는 필요 없습니다.
이미 쓰고 있는 AI가 있다면 새 도구를 익힐 필요가 없습니다. 연결은 처음 한 번만 하고, 그다음부터는 평소처럼 AI에게 말하면 열어 둔 편집 화면이 바뀝니다. 아이비전트(IBIGENT) 비전트 AI 호스팅 편집기에서 실제로 연결한 순서를 화면과 영상으로 정리했습니다.
순서
편집기 오른쪽 「새 홈페이지 제작」 창에서 3번을 누르면 「MCP & CLI 연동」 안내가 열립니다.
처음 한 번만 합니다. AI에게 안내 문장을 보내거나, AI 앱에 주소를 넣고 아이비전트로 로그인한 뒤 [연결 허용]을 누릅니다.
편집기 오른쪽 아래 「MCP & CLI 연동」에 연결됨이 보이면 준비가 끝난 것입니다.
「첫 화면 제목을 바꿔줘」처럼 말하면 AI가 편집 화면을 읽고 말한 부분만 고칩니다.
2~3초 뒤 편집 화면에 반영됩니다. 마음에 들면 저장합니다. 저장 전까지는 실제 사이트에 나가지 않습니다.
1. 「사용 중인 AI로 연결해 만들기」 누르기
편집기 오른쪽 「새 홈페이지 제작」을 누르면 7가지 방법이 나옵니다. 3번을 누르면 창이 닫히고 「MCP & CLI 연동」 안내가 열립니다.
2. AI 연결하기 (처음 한 번)
가장 쉬운 방법은 안내 맨 위 문장을 [복사]해 쓰는 AI에게 그대로 보내는 것입니다. Claude Code, Codex 같은 터미널 AI는 이 문장만 보고 스스로 연결합니다.
Claude, ChatGPT 앱은 AI가 대신 추가하지 못합니다. 안내의 「1. AI 도구에 연결하기」에서 쓰는 도구를 펼쳐 한 번만 직접 등록합니다. 주소를 넣으면 아이비전트 로그인 창이 뜨고, 로그인 후 [연결 허용]만 누르면 됩니다.
| 연결 방법 | 내용 |
|---|---|
| 방법 A. 커넥터 연결 | AI 앱 화면에서 주소를 넣고 로그인만 합니다. 터미널이 필요 없어 처음이면 이 방법이 편합니다. Claude, ChatGPT(개발자 모드 필요) |
| 방법 B. 터미널 연결 | 명령 한 줄이나 설정 파일(mcp.json 등)에 주소를 넣습니다. Claude Code, Cursor, Codex, Antigravity |
3. AI에게 말로 시키기
편집기를 열어 두고, 오른쪽 아래 「MCP & CLI 연동」에 연결됨이 보이는지 확인합니다. 그다음 AI에게 말로 시킵니다.
| 구분 | 내용 |
|---|---|
| 말하는 예 | 「첫 화면 제목을 따뜻한 공간으로 바꿔줘」, 「회사 소개 섹션 만들어서 넣어줘」, 「상단 메뉴 이름 바꿔줘」 |
| 선택한 부분 | 편집 화면에서 먼저 누른 부분도 알아듣습니다. 「선택한 부분 글자색 빨간색으로 바꿔줘」처럼 말하면 됩니다. |
| 반영 | 2~3초 뒤 편집 화면에 바로 반영되고 아래에 [되돌리기] 알림이 뜹니다. 마음에 들면 저장합니다. |
4. 잘 안 될 때
| 이럴 때 | 확인할 것 |
|---|---|
| 열린 편집 화면이 없다고 할 때 | 편집기가 열려 있는지, 「MCP & CLI 연동」이 연결됨인지 확인합니다. |
| 편집 화면이 여러 개일 때 | AI가 어느 화면인지 물어봅니다. |
| 기기를 바꿨을 때 | 새 기기나 새로 설치한 도구에서는 「1. AI 도구에 연결하기」를 한 번 더 합니다. |
되돌리고 싶을 때
AI가 고친 직후 편집 화면 아래 [되돌리기] 알림을 누르면 고치기 전으로 돌아갑니다. 저장하기 전까지는 실제 사이트에 반영되지 않습니다.
이전 편과 다음 편
이전 편: 채팅으로 새로 만들기
다음 편: 주소(URL)로 만들기
비전트 AI 호스팅 편집기 시작하는 7가지 방법
쓰는 AI로 홈페이지를 고쳐 보세요
14일 무료체험으로 편집기를 열 수 있습니다. 비전트 AI 호스팅 보기
