토이프로젝트 계획서

1. 프로젝트 주제

• 한줄 요약 : 영화관 시야 공유 플랫폼
• 상세 설명 :
  • 클라이언트가 관심있는 영화관별 좌석에 대한 코멘트 입력 및 후기 제공
  • 키값 : 영화관명, 영화제목, 좌석명, 좌석평점, 코멘트
  • 웹종합반 내용을 전체적으로 복기하기 위해 홈페이지를 제외하고 동일한 기능의
    페이지를 각각 구현

2. 페이지별 와이어프레임

• 첫 페이지

   홈페이지 : 영화관 선택 페이지

 - 1번 기능 : 각 영화관별 페이지로 이동(링크 태그)

 - 조원 5명이 각각 한페이지를 만듬

     ex) 롯데시네마: 성욱, 메가박스:하나 등등등

• 두번째 페이지

   각 영화관별 좌석 추천 후기 게시판

 - 1번 기능 : 홈 페이지 화면으로 이동

 - 2번 기능 : 다른 영화관 페이지로 이동

 - 3번 기능 : 각 input 박스별 데이터 값 입력,

               키값별 필수 includes 값 입력,

               placeholder로 예시 표시, 

               좌석 평점은 별점으로 리스트 선택

• 4번 기능 : 데이터값 서버에 저장

  - 5번 기능 : 입력 버튼을 누르면 5번의 후기리스트를 팝업창으로 띄우거나 입
              력 창 아래에 show
  
  - 6번 기능 : 해당 후기 리스트 수정
  
  - 7번 기능 : 해당 후기 리스트 삭제

3. 역할분담/ 체크리스트

[역할 분담]

• 홈 페이지 → 미정
• 각 페이지 개인이 생성(도메인 구매 후 배포까지)

4. 찾아본 코드들

현재 페에지 URL을 가져옵니다
javascript
window.location.href

버튼 클릭시 페이지 이동하기
html

<input 
id='go_home'    
type='button'
onclick='newPage()'
value='이 버튼을 클릭하면 블로그 홈으로 이동합니다.' />

javascript

function newPage()  {
  window.location.href = 'https://hianna.tistory.com'
}

svg 태그
-SVG태그는 Scalable Vector Graphics의 약자로 벡터 기반 그래픽을 XML 형식으로 정의하는 것을 의미합니다.
-SVG태그는 SVG그래픽을 담기 위한 요소입니다.
-SVG태그 내부에 담을 수 있는 것은 원, 사각형, 다각형, 라인, path 등이 있습니다.
-SVG태그는 파일의 모든 요소와 모든 속성에 애니메이션을 적용할 수 있습니다.

버튼 클릭시 페이지 열기

1. 즉시 이동
<button onclick="location.href='https://naver.com'">네이버</button>
2. 새 창으로 열기
<button onclick="window.open('https://naver.com ')">네이버</button>
이후 언급되는 window.open() 인터페이스에 대해선 mdn에서 자세히 볼 수 있다.
3. 팝업으로 열기
<button onclick="window.open('https://naver.com', 'window_name', 'width=430, height=500, location=no, status=no, scrollbars=yes');">네이버</button>
마지막 width=430 같은 옵션 값은 mdn 문서의 Parameters 에서 windowFeatures를 참고해보면 더 많은 옵션을 확인할 수 있다.