1/10 TIL

CodHan·2024년 1월 10일

영화사이트 팀 프로젝트

기존 개인과제에서의 프로젝트를 팀끼리 이어서 하게 되었다. 필수 기능 구현은 크게 4가지로 나뉜다.

  • API 연결
  • 포스터 클릭시 상세 페이지 구현
  • 영화 리뷰 작성 기능(+비밀번호 검사)
  • 유효성 검사

내가 맡은 기능은 리뷰작성 기능이다.

리뷰작성기능

1.HTML & CSS

부트스트랩으로 가져와서 구현했다.

2.토글기능

위에 HTML양식이 버튼을 누르면 나타나게 구현했다.

toggle안에 내용 전체를 toggleVal로 감싼다.
style에 디폴트를 none을 준다.
디폴트 true와 조건문을 활용해 block을 준다.
꼭 기능을 했으면 boolean을 바꿔줘야 한다.

3. 입력값 저장기능 구현

입력버튼 (inputBtn)에 클릭 이벤트 생성
각 value들을 변수지정
input값을 담을 빈배열 생성 (중요)
빈배열을 전역으로 설정 해주어야 한다.
생성한 빈 배열에 push 메서드로 넣어준다.

4. 생성기능 구현

늘 했던 것 처럼 insertAdjacentHTML을 활용해 자바스크립트로 직접 html을 추가한다.
(추가하고 싶은 곳의 부모를 가져와야 함)

profile
코테, 계획 그리고 KPT

0개의 댓글