발제 : 24.07.31
제출 : 24.08.07
내가 맡은 파트(담당)는 상세페이지의 상단부분의 내용표시의 기능 구현이다. 맡은 작업은 js로 기능 동작을 구현함으로써 tmdb사이트에서 api호출을 받고 리스트 페이지에서 카드를 선택했을때 한페이지로 영화정보가 보일수 있게하는 작업이다. 상영일,제목,평점,오버뷰, 스틸것 등을 구현 한다.
//상세정보 상영일,제목,평점,오버뷰
fetch(URL)
.then(response => response.json())
.then(datails => {
console.log(datails);
document.getElementById('release_date').innerText = datails.release_date;
document.getElementById('title').innerText = datails.title;
document.getElementById('vote_average').innerText = datails.vote_average;
document.getElementById('overview').innerText = datails.overview;
})
//상세정보 스틸컷
fetch(`https://api.themoviedb.org/3/movie/533535/images?api_key=${API_KEY}&include_image_language=null`)
.then(response => response.json())
.then(still => {
console.log(still.backdrops);
for (let i = 0; i < 5; i++) {
stillcut(still.backdrops[i].file_path);
}})
function stillcut(img) {
const imggs = document.createElement('div');
imggs.className = 'stillcut'
imggs.innerHTML = `
<img src="https://image.tmdb.org/t/p/w500${img}" alt="스틸컷 이미지"/>
`
document.getElementById('still').append(imggs);
}