(React) 블로그 만들기 - 반복문으로 글목록 나타내기

저번에 jsx에서 for 반복문을 사용할 수 없다고 했다.
{ } 안에서 map() 을 대신 사용하여 반복시켜주자.

{posts.map((post, index) => {
        return (
          <div key={index} className="list">
            <h3
              onClick={() => {
                setModal(true);
              }}
            >
              {post.title}
              <span
                onClick={(e) => {
                  e.stopPropagation();
                  const newLiked = [...liked];
                  newLiked[index] += 1;
                  setLiked(newLiked);
                }}
              >
                ❤️
              </span>
              {liked[index] + " "}
            </h3>
            <p>{post.date}</p>
            <hr />
          </div>
        );
})}

posts의 요소 개수만큼 반복하여 태그들을 뽑아준다.
posts.map(~) 의 결과는 array이고 그 array 를 { } 안에 넣어주면 html이 알아서 태그들을 보여준다.