List

<List type={dayType} list={day} class={"item_list"}/>

---

 <Swiper
	slidesPerView={'auto'} navigation={true} modules={[Navigation]}
	className={`swiper item_slide ${props.class}`}
>
	{props.list.map(item => (
		// 인물일 경우에만 가지고 있는 known_for_department 값을 가지고 person, item 클래스 부여
		<SwiperSlide
          className={`list_card ${item.known_for_department ? 'person_card' : 'item_card'}`}
          key={item.id}
        >
			<Link to={`${item.overview ? `/detail/${props.type}/${item.id}` : `/person/${item.id}`} `}>
            {
              item.poster_path ? (
                <img
                  src={`https://image.tmdb.org/t/p/w220_and_h330_face${item.poster_path}`}
                  alt={item.title || item.name}
                  loading="lazy"
                />
              ) : item.profile_path ? (
                <img
                  src={`https://image.tmdb.org/t/p/w154${item.profile_path}`}
                  alt={item.title || item.name}
                  loading="lazy"
                />
              ) : (
                <picture className="img_none">
                  <img src={imgNone} alt="img_none" loading="lazy"/>
                </picture>
              )
            }
            <h3>{item.title || item.name}</h3>
          </Link>

        </SwiperSlide>
      ))}
    </Swiper>

---

사용 케이스

메인

1. 지금 상영중이에요
2. 가장 인기있는 컨텐츠
3. 오늘 가장 많이 찾아본 컨텐츠
4. 이번주 가장 많이 찾아본 컨텐츠
   

등장인물

추천작품

유명작품