지구인사이드 - 제로웨이스트 웹사이트

프로젝트 개요

웹기초 수행평가를 위한 제로웨이스트 실천 유도 사이트

주요 기능

1. 메인 페이지 (main.html)

• 제로웨이스트 개념 소개
• 5R 원칙 설명 (Refuse, Reduce, Reuse, Recycle, Rot)
• 플라스틱 배출량 통계 및 로드맵
• 체크리스트를 통한 유튜브 영상
• 문의 폼
• 공지사항 팝업

2. 제품 & 브랜드 페이지 (products.html)

• 제로웨이스트 제품 소개
• Google Maps iframe을 통한 제로웨이스트 샵 위치 안내

3. 뉴스 & 트렌드 페이지 (news.html)

• 최신 제로웨이스트 관련 뉴스 표시

4. 리소스 센터 페이지 (resource.html)

• 개발자 프로필 소개
• 사용된 기술 스택

기술 스택

• HTML5
• CSS3
• JavaScript

📁 파일 구조

1206김일강_1210배준하/
├── html/
│   ├── main.html          # 메인 페이지
│   ├── products.html      # 제품 & 브랜드 페이지
│   ├── news.html          # 뉴스 & 트렌드 페이지
│   ├── resource.html      # 리소스 센터 페이지
│   └── popup.html         # 공지사항 팝업
├── css/
│   ├── main.css           # 메인 페이지 스타일
│   ├── products.css       # 제품 페이지 스타일
│   ├── news.css           # 뉴스 페이지 스타일
│   └── resource.css       # 리소스 페이지 스타일
├── js/
│   ├── main.js            # 메인 페이지 스크립트
│   ├── products.js        # 제품 페이지 스크립트
│   ├── news.js            # 뉴스 페이지 스크립트
│   └── resource.js        # 리소스 페이지 스크립트
├── images/                # 이미지 파일들
└── README.md              # 프로젝트 설명서

🔧 개발자 정보

• 배준하: "배움을 멈추지않는 개발자"
• 김일강: "스스로 빛내려는 개발자"