실전 ⏱ 5분 읽기 📅 2026-06-11 업데이트

챗GPT로 홈페이지 만들기

코딩을 몰라도 챗GPT에게 단계별로 시켜 내 홈페이지를 완성하는 전 과정을 비개발자 기준으로 풀었습니다.

챗GPT로 홈페이지 만들기를 배우는 강의실 풍경
챗GPT로 홈페이지 만들기를 배우는 강의실 풍경

'챗GPT로 홈페이지 만들기'의 핵심은 코딩 실력이 아니라 부탁하는 법입니다. 챗GPT는 시키는 만큼 정확히 만들어 줍니다. 그래서 잘 만드는 사람과 못 만드는 사람의 차이는, 결국 '얼마나 구체적으로 말했느냐'에서 갈립니다.

1단계 · 목적과 화면을 묘사한다

"홈페이지 만들어줘"는 너무 막연합니다. 대신 "흰 배경에, 가게 이름·한 줄 소개·전화 문의 버튼만 있는 한 장짜리 페이지를 index.html로 만들어줘. 글씨는 가운데 정렬"처럼 눈에 보이듯 묘사하세요. 결과가 한결 정확해집니다.

2단계 · 한 번에 한 가지씩 고친다

첫 결과가 나오면 한꺼번에 다 바꾸려 하지 마세요. "버튼 색을 초록으로", "그 아래 지도 한 칸 추가"처럼 한 번에 하나씩 요청하면 어디가 바뀌었는지 눈으로 확인하며 갈 수 있습니다. 이게 사고를 막는 가장 쉬운 습관입니다.

3단계 · 받은 코드를 띄운다

완성한 코드는 메모장에 붙여 index.html로 저장한 뒤, 무료 호스팅에 올리면 바로 주소가 생깁니다. 막히는 부분은 "이 파일을 어디에 저장하고 어떻게 인터넷에 올리는지 쉽게 알려줘"라고 챗GPT에게 그대로 물어보면 됩니다.

확인 습관. 챗GPT가 만든 코드도 가끔 틀립니다. 화면에서 직접 눌러보고, 이상하면 "이 부분이 이렇게 나왔는데 이렇게 바꿔줘"라고 되돌려주세요.

마치며

챗GPT로 홈페이지를 만드는 일은 '코드를 외우는' 게 아니라 '원하는 걸 말로 그려내는' 연습입니다. 무료 수련에서 이 대화의 결을 익히면, 다음 홈페이지는 훨씬 빠르고 깔끔하게 나옵니다.

AD
VIBE CODING ACADEMY

읽었으면, 직접 풀어보는 게 가장 빠릅니다.

무료 ‘수련’에서는 레벨별 챕터의 핵심을 익히고 퀴즈를 풀며 경험치(XP)를 쌓아 한 단계씩 레벨을 올립니다. 로그인하면 내 진행 상황이 저장됩니다.