[TIL]231019_오픈API가져오기(1단계)

'오픈 API가져오기' 제목은 거창하지만 내용은 알맹이가 단 한개도 없을 오늘의 TIL

순수 바닐라 자바스크립트를 사용하여 영화검색 사이트를 만드는 프로젝트를 하기 위해서는 영화 정보 오픈 API에서 데이터를 받아와야 한다.

1단계 : TMDB 오픈 API 사이트에서 요청 코드 복사하기

const options = {
  method: 'GET',
  headers: {
    accept: 'application/json',
    Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI3OWU4MmZkM2YyNmQ1MzBmNDYyMGUxYWRlYTdlNTNmYyIsInN1YiI6IjY1MzA3ZTJjYWQ1OWI1MDBlMTI5ZTMwNyIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.XDs5Jyz-CPhJWQNlUDpXWh3eXjhxYxrD6AnbdRLUB98'
  }
};

fetch('https://api.themoviedb.org/3/movie/top_rated?language=en-US&page=1', options)
  .then(response => response.json())
  .then(response => console.log(response))
  .catch(err => console.error(err));

이러한 형태로 불러와지는데 이것을 그대로 사용하는 것이 아니라 내가 작업한 코드의 형식에 맞춰서 수정을 해야한다....

그러던 중!!!!!!!!!!!!!!!!!!!!! 다른 팀원분이 코드공유를 해주셔서 튜터님과 함께 하나하나 살펴보면서 이해해보려고 애써봤다🥲

이해한 내용을 풀어서 써보자면

• 오픈 API를 가져올때는 사이트에서 그냥 가져오는것이 아닌 몇가지 옵션을 넣어줘야함!
• 사이트에서 제공하는 옵션을 같이 넣어야 ‘나 이렇게 정보를 줘!’ 라고 요청하는것

fetch('https://api.themoviedb.org/3/movie/top_rated?language=en-US&page=1', options)

그 다음으로는 데이터를 가져와서 반복문을 통해 가져온 영화 리스트가 화면에 나타날 수 있게 짜는 코드였다.

그런데 이 부분은 내 작업파일에 맞게 수정중이기 때문에 아마 내일의 [TIL]에 쓸 수 있을 것 같다.