프로젝트 제안서 가이드
1. 프로젝트 주제 선정
실현 가능하면서도 의미있는 프로젝트 주제를 선택합니다.
추천 프로젝트 아이디어
개인 웹사이트
- 포트폴리오 사이트
- 개인 블로그
- 취미 소개 사이트
- 이력서 웹사이트
정보 제공 사이트
- 지역 맛집 안내
- 여행지 정보
- 학습 자료 모음
- 책/영화 리뷰
실용 도구
- 할 일 관리 앱
- 간단한 계산기
- 날씨 정보 앱
- 메모 앱
게임 & 엔터테인먼트
- 퀴즈 게임
- 메모리 카드 게임
- 간단한 퍼즐
- 랜덤 추천기
2. 제안서 작성 양식
아래 양식을 참고하여 상세한 제안서를 작성하세요.
프로젝트 개요
- 프로젝트명: 웹사이트/앱의 이름
- 목적: 프로젝트를 만드는 이유와 목표
- 대상 사용자: 누구를 위한 서비스인지
- 주요 기능: 핵심 기능 3-5개
기술적 요구사항
- 사용 기술: HTML, CSS, JavaScript
- 페이지 구성: 메인 페이지, 서브 페이지 등
- 반응형 지원: 모바일, 태블릿, 데스크톱
- 브라우저 호환성: 최신 브라우저 지원
사이트맵 및 와이어프레임
- 페이지 구조도 (사이트맵)
- 각 페이지의 레이아웃 스케치
- 네비게이션 구조
- 주요 컴포넌트 위치
개발 일정
- 9-10주차: HTML 구조 및 기본 CSS
- 11-12주차: JavaScript 기능 구현
- 13-14주차: 세부 기능 완성 및 테스트
- 15주차: 최종 검토 및 발표 준비
3. HTML/CSS 프로토타입 요구사항
제안서와 함께 제출할 기본 프로토타입의 요구사항입니다.
필수 포함 사항
✅ HTML 구조
- 시맨틱 태그 사용 (header, nav, main, footer)
- 적절한 제목 태그 계층 구조
- 최소 3개 페이지 (메인 + 서브페이지 2개)
✅ CSS 스타일링
- 외부 CSS 파일 사용
- 일관된 색상 체계 및 폰트
- 기본적인 레이아웃 (Flexbox 사용)
- 반응형 디자인 (모바일/데스크톱)
✅ 사용성
- 명확한 네비게이션
- 읽기 쉬운 텍스트
- 접근 가능한 색상 대비
- 일관된 UI 패턴
✅ 코드 품질
- 들여쓰기와 주석
- 의미있는 클래스명
- HTML 유효성 검사 통과
- CSS 구조화
4. GitHub 저장소 설정
프로젝트 관리를 위한 GitHub 저장소 설정 방법입니다.
1단계: 저장소 생성
- GitHub에서 새 저장소 생성
- 저장소명: [이름]-web-project
- Public 저장소로 설정
- README.md 파일 포함
2단계: 폴더 구조
my-web-project/
├── index.html
├── css/
│ └── styles.css
├── js/
│ └── script.js
├── images/
│ └── (이미지 파일들)
├── pages/
│ ├── about.html
│ └── contact.html
└── README.md3단계: README.md 작성
- 프로젝트 설명
- 주요 기능
- 사용 기술
- 실행 방법