기획
드디어 첫 번째 프로젝트를 시작합니다. 우리 가게 홈페이지를 만들 거예요.
코드를 쓰기 전에 먼저 해야 할 일이 있습니다. 바로 기획입니다. 무엇을 만들지 정하는 단계입니다.
어떤 가게인가요?
먼저 어떤 사업을 위한 홈페이지인지 정해 봅시다. 실제 운영하시는 가게가 있으면 그걸로 하시고, 없으면 가상으로 하나 정해도 됩니다.
| 업종 예시 | 필요한 정보 |
|---|---|
| 카페 | 메뉴, 가격, 분위기 사진 |
| 미용실 | 시술 종류, 가격, 예약 안내 |
| 학원 | 수업 과정, 시간표, 수강료 |
| 꽃집 | 상품 종류, 주문 방법 |
| 네일숍 | 디자인 사진, 가격표 |
| 음식점 | 메뉴, 가격, 매장 사진 |
이 코스에서는 카페를 예시로 진행합니다. 다른 업종이더라도 구조는 같으니 따라오시면 됩니다.
어떤 페이지가 필요한가요?
홈페이지에 어떤 페이지들이 있어야 할지 정해 봅시다. AI에게 도움을 요청할 수도 있습니다:
"동네 카페 홈페이지를 기획하고 있어. 어떤 페이지가 필요할까?"
보통 이런 페이지들이 필요합니다:
| 페이지 | 내용 | 중요도 |
|---|---|---|
| 메인 페이지 | 첫인상. 가게 이름, 분위기, 대표 사진 | 필수 |
| 메뉴/서비스 | 판매하는 것들의 목록과 가격 | 필수 |
| 오시는 길 | 지도, 주소, 주차 안내 | 필수 |
| 연락처 | 전화번호, 카카오톡, 문의 양식 | 필수 |
| 영업시간/공지 | 영업시간, 휴무일, 공지사항 | 권장 |
내용을 미리 정리해 두세요
AI에게 요청하기 전에, 아래 내용을 미리 적어두면 작업이 훨씬 수월합니다. 메모장이나 종이에 적어보세요:
기본 정보:
- 가게 이름:
- 한 줄 소개 (슬로건):
- 전화번호:
- 주소:
- 영업시간:
- 휴무일:
메뉴/서비스 (3~5개):
- 메뉴 이름 / 가격 / 한 줄 설명
분위기:
- 어떤 느낌의 홈페이지를 원하나요? (예: 따뜻한, 모던한, 귀여운, 고급스러운)
- 주요 색상이 있나요? (예: 갈색, 초록, 하늘색)
예를 들어 이렇게 적을 수 있습니다:
>
- 가게 이름: 봄날 카페
- 슬로건: 매일 아침, 따뜻한 한 잔
- 전화번호: 02-1234-5678
- 주소: 서울시 관악구 봉천로 123
- 영업시간: 평일 8:00~21:00, 주말 9:00~20:00
- 메뉴: 아메리카노 4,500원, 카페라떼 5,000원, 당근케이크 6,500원
사진 준비하기
홈페이지에 넣을 사진도 미리 준비하면 좋습니다:
- 대표 사진 1장 (가게 외관 또는 내부)
- 메뉴/서비스 사진 3~5장
- 로고 (있으면)
사진이 없어도 괜찮습니다. 일단 텍스트만으로 만들고, 나중에 사진을 추가할 수 있습니다.
이 절의 요약
- 코딩 전에 기획이 먼저입니다 — 무엇을 만들지 정하세요
- 가게 종류를 정하고, 필요한 페이지 목록을 만드세요
- 가게 이름, 전화번호, 주소, 메뉴 등 내용을 미리 정리해 두세요
- 사진이 있으면 좋지만 없어도 시작할 수 있습니다
- 다음 절에서 프로젝트를 실제로 생성합니다