[ChatGPT] 홈페이지 만들기 #1

chatGPT로 홈페이지를 만들 수 있을까? 하는 궁금증이 생겼다.

React (JavaScript 라이브러리) 로 만들려고 했으나 시간이 거릴 거 같아서 HTML으로 소스를 부탁했다.

 

나 : HTML으로 사이트 만드려고 하는데 반응형이였으면 좋겠고, 상단에 NavBar 가 있어. 거기에는 학원, 학교 탭이 있어.

Chat :

HTML

 

CSS

 

나 : NavBar 아래에는 카드형 정보가 들어갔으면 좋겠는데 반은 이미지 영역이고 반은 학원명, 학원소개로 구성하려고 해

Chat :

HTML

CSS

 

사실 내 질문이 구체적이지 않았는데도 잘 알아듣는 느낌이었다.👍

그 이후로도 카드는 최대 4개가 픽스야, 카드에 스타일을 주고 싶어. 예로 당근마켓 카드같은 형태로,

카드 안 하단에 전화번호를 넣고 싶어, 카드가 4개가 되면 자동으로 다음줄로 넘어갔으면 좋겠어,

nav 도 당근마켓처럼 스타일을 바꾸고 싶어, 더 세련되면 좋겠어. 왼쪽에 로고도 넣고 싶어 

등등 물어본 결과 아래와 같이 index.html이 완성되었다. 

시간은 3시간 정도 걸렸고, 따라 하고 싶은 홈페이지가 있다면 학습시켜서 결과를 도출해 보면 좋겠다.

 

 

 

밋밋한 거 같아 상단에 소개 이미지를 넣고 싶다고 했다.

나 : 상단에 소개 이미지를 넣고 싶어

Chat :

 

이렇게 완성되었다. 

카드를 누르면 모달창까지 띄우는 게 목표인데 현재 모달창 이벤트만 추가한 상태이다.

#2에는 모달을 꾸며보도록 하겠다.