Movie-App(3)

jb kim·2021년 12월 25일
0

Web Projects

목록 보기
38/50

console.log(data.results);
=> showMovies(data.results);

function showMovies(movies) {
  main.innerHTML = '';

  movies.forEach((movie) => {
    //const { title, poster_path, vote_average, overview } = movie;
    const title = movie.title;
    const poster_path = movie.poster_path;
    const vote_average = movie.vote_average;
    const overview = movie.overview;

    const movieEl = document.createElement('div');
    movieEl.classList.add('movie');

    movieEl.innerHTML = `
            <img src="${IMG_PATH + poster_path}" alt="${title}">
            <div class="movie-info">
          <h3>${title}</h3>
          <span class="${getClassByRate(vote_average)}">${vote_average}</span>
            </div>
            <div class="overview">
          <h3>상세 보기</h3>
          ${overview}
        </div>
        `;
    main.appendChild(movieEl);
  });
}

function getClassByRate(vote) {
  if (vote >= 8) {
    return 'green';
  } else if (vote >= 5) {
    return 'orange';
  } else {
    return 'red';
  }
}
profile
픽서

0개의 댓글