20240426 이게 왜 되지?

RingKim1·2024년 4월 27일

TIL

목록 보기

9/77

Today

1. Math 객체 정리

최댓값, 최솟값, 절댓값, 제곱근, 거듭제곱 반환
반올림, 올림, 내림, 버림
랜덤

2. 개인 프로젝트

진행한 것은 많이 없지만 생각보다 많은 트러블 슈팅들이 있었다..
일단 진행사항을 보자면..

~~검색 기능 구현~~
~~포스터 호버링: 영화정보 구현~~

결론적으로 다하긴 했는데 며칠전 강의에서 들었던
이게 왜 되지?가 맞는 말인 것 같다.

Learn

🏌️Trouble shooting

1. addEventListener 미작동

영화 검색을 위해 창에 키를 누르면 동작하도록 처음 써본 addEventListener
하지만, 작동을 하지 않았는데 원인을 찾아 헤매다 30분이 흐르고..
튜터님들 께서 바쁘기 때문에 매니저님과 머리를 맞대본 결과

😰HTML내 자바스크립트를 위치가 스크립트를 먼저 읽어오고 홈페이지 구성하는 문제..

🪄스크립트를 <body>태그 제일 아래쪽으로 내려서 해결.

2. 검색 기능 구현 중 : value값 찾기

TMDB에서 데이터를 찾는 방법을 찾아왔다.

하지만 아무리 해도 검색기능이 구현이 되지 않았다.

검색 이벤트에는 아무 문제가 없고.. 핸들러 문제인가? 두어 시간이 지나갔다..
애꿎은 css만 만지작 거리고 있다.

역시 스스로 해결책을 찾지 못하고 튜터님께 코드 리뷰 요청..
코드를 공유해 드리고 자리에 돌아온지 5분도 채 안되서 튜터님께서 다시 호출하셨다.

😰내가 만든 검색 핸들러에서 주소값에 val를 제대로 읽고있지 않다는 점.

API를 다루는데 있어서 제공하는 사이트(TMDB) 내 문서를 잘 읽어보면 해결 가능하다.
사실 못 본 내 잘못이지만 상당한 디테일이 없으면 무슨 오류인지 영원히 못찾을 것 같다.

~~허무하다 내 2시간~~

// 수정 전
fetch(`https://api.themoviedb.org/3/search/movie?val&include_adult=false&language=en-US&page=1`, options)
     .then(response => response.json())
     .then(response => { }

// 수정 후
fetch(`https://api.themoviedb.org/3/search/movie?query=${val}&include_adult=false&language=en-US&page=1`, options)
     .then(response => response.json())
     .then(response => { }