ChatGPT·Claude가 만든 HTML을 웹사이트로 올리는 방법

hdply · 2026-07-04

ChatGPT, Claude, Gemini에게 웹페이지를 만들어달라고 했더니 미리보기에서 그럴듯하게 보이는 HTML 코드가 잔뜩 나왔습니다. 다음 질문은 늘 똑같죠: 이걸 어떻게 올려서 다른 사람에게 보여주지? 가장 짧은 경로를 알려드립니다.

1단계: AI에게 "파일 하나로" 만들어달라고 하기

코드를 복사하기 전에 AI에게 이렇게 요청하세요: "CSS와 JavaScript를 전부 인라인으로 넣은 단일 HTML 파일로 만들어줘." 완결된 index.html 하나가 여러 파일로 쪼개진 것보다 호스팅하고 공유하고 수정하기 훨씬 쉽습니다.

2단계: 코드 복사 — 파일로 저장할 필요도 없습니다

hdply에서 무료 계정을 만들고, 편집기를 열어 AI가 준 HTML을 그대로 붙여넣으세요. 배포 버튼을 누르면 my-site.hdply.com 같은 나만의 주소로 HTTPS와 함께 즉시 라이브됩니다. 이미 파일로 저장했다면 드래그앤드롭도 됩니다.

"AI가 다 썼다"에서 "친구가 링크를 연다"까지: 약 1분.

3단계: AI와 주고받으며 몇 초 만에 재배포

AI로 만든 페이지의 진짜 강점은 반복 수정입니다: 고쳐달라고 하고, 새 코드를 받고, 붙여넣고, 저장. 배포할 때마다 버전이 자동으로 기록되므로 5번째 버전이 망가지면 클릭 한 번으로 4번째로 되돌릴 수 있습니다. Git도 빌드 파이프라인도 없이 대화 → 붙여넣기 → 저장 루프면 충분합니다.

올리기 전에 확인할 세 가지

코드에 비밀키가 없는지. AI가 날씨 위젯이나 지도, LLM 호출용 API 키를 넣었다면 주의하세요 — 페이지는 공개되고 소스는 누구나 볼 수 있습니다. 공개용으로 설계된 키만 쓰거나 해당 기능을 빼세요.
이미지는 진짜 URL이어야 합니다. AI는 가끔 존재하지 않는 이미지 경로를 씁니다. 실제 호스팅된 이미지 링크를 쓰거나, 외부 파일이 아예 필요 없는 인라인 SVG로 만들어달라고 하세요.
모바일 확인. 일단 배포하고 휴대폰으로 URL을 열어보세요. 이상한 부분은 AI에게 고쳐달라고 하면 되고, 재배포는 몇 초면 됩니다.

채팅 링크나 스크린샷으로 공유하면 안 되나요?

채팅 공유 링크는 만료되거나 로그인을 요구하고, 프롬프트까지 노출됩니다. 스크린샷은 클릭이 안 되죠. 진짜 URL은 영구적이고, 어떤 기기에서든 열리고, 완성된 결과물처럼 보입니다 — 실제로 완성된 결과물이니까요.