Claude (Artifacts) 웹사이트를 호스팅하는 방법
Claude는 Artifact로 멋진 사이트를 만들지만, Artifact는 Claude 안에 있어서 고객에게 진짜 URL을 줄 수 없어요. SiteDrop은 Artifact의 코드를 내 링크에 게시해서 일반 웹사이트처럼 작동하게 해요.
무료로 사이트 게시하기 →5단계로 게시하기
- Claude에서 웹사이트가 담긴 Artifact를 여세요.
- Artifact를 코드 보기로 바꾸고 전체 HTML(보이는 CSS나 JavaScript 포함)을 복사하세요.
- 새 폴더에 index.html로 저장하고, 따로 있는 에셋 파일은 그 옆에 추가하세요.
- 폴더를 .zip으로 압축하세요.
- .zip을 SiteDrop에 업로드하고, Claude로는 받을 수 없던 라이브 링크를 공유하세요.
사용할 수 있는 파일 형식
Claude Artifact는 거의 항상 CSS와 JavaScript가 안에 들어 있는 독립형 index.html 하나예요. 정적 호스팅에서 가장 쉬운 경우죠. Artifact가 URL로 이미지나 아이콘 글꼴을 불러온다면 같은 폴더에 내려받고 태그가 로컬 파일을 가리키게 하세요. 그러면 Claude가 계속 켜져 있는지와 상관없어요.
문제가 생기는 경우와 해결 방법
- 고객에게 공유한 Artifact 링크가 작동하지 않아요.
Artifact URL은 Claude 안에서 표시되며 바뀌거나 만료될 수 있어요. 대신 SiteDrop으로 코드를 게시하세요. 내 소유의 독립된 URL은 Claude 세션에 좌우되지 않아요.
- 게시하면 글꼴이나 아이콘이 다르게 보여요.
Artifact가 zip에 포함되지 않은 CDN에서 불러오고 있었어요. 공개 CDN의 <link>를 그대로 두거나, 글꼴·아이콘 파일을 폴더에 내려받아 로컬로 참조하세요.
- 미리보기를 게시했는데 비어 있어요.
소스가 아니라 렌더링된 미리보기를 복사했어요. Artifact를 코드 보기(</> 전환)로 바꾸고 거기서 HTML을 복사하세요.
SiteDrop vs 그냥 Netlify 쓰기
Netlify는 저장소와 빌드 파이프라인을 위해 설계됐지만, 파일 하나짜리 Claude Artifact에는 그 어느 것도 필요 없어요. HTML 파일 하나를 범용 배포 도구에 끌어다 놓으려면 작업에 비해 계정 설정이 너무 많아요. SiteDrop은 바로 “파일은 있으니 온라인에 올려 줘”를 위해 만들어져서, 독립형 Artifact라면 30초 업로드로 진짜 링크와 선택 사항인 커스텀 도메인까지 얻을 수 있어요.
Claude (Artifacts) 호스팅 — 자주 묻는 질문
Claude Artifact 링크를 그냥 공유하면 안 되는 이유가 뭔가요?
Artifact 링크는 보는 사람이 Claude 안에서 열어야 하고, 바뀌거나 만료될 수 있어요. SiteDrop으로 코드를 게시하면 직접 관리하는 영구적이고 독립된 URL이 생겨요.
Artifact가 독립형 HTML 파일 하나인데, 작동할까요?
완벽하게 작동해요. index.html로 저장하고 zip으로 묶어 업로드하세요. 독립형 Artifact가 가장 쉬운 경우예요.
Claude (Artifacts) 사이트를 게시할 준비가 됐나요?
.zip을 업로드하면 1분 안에 공유할 수 있는 라이브 링크가 생겨요. 7일 무료 미리보기, 카드는 필요 없어요.
지금 공개하기 →