더북(TheBook)

6.4.3 date-fns로 날짜 포맷팅하기

현재 FeedListItem에서 시간을 보여줄 때 Date 객체의 toLocaleString()을 사용하고 있는데, 작성한 시간에 따라 다음과 같은 형식으로 시간이 보이도록 수정해보겠습니다.

방금 전

3분 전

1시간 전

3일 전

2021년 8월 23일 07:00

이때 유용하게 사용할 수 있는 라이브러리가 date-fns입니다. 이 라이브러리는 날짜/시간에 관련한, 다양한 기능을 제공합니다. 다음 명령어를 사용해 라이브러리를 설치하세요.

$ yarn add date-fns

이 라이브러리에 어떤 기능이 있는지 확인하고 싶다면 다음 링크를 참조해주세요.

https://date-fns.org/docs/Getting-Started

이 라이브러리에서 불러와 사용할 함수는 다음과 같습니다.

formatDistanceToNow: 현재 시각을 기준으로 단어를 사용해 시간을 나타냅니다. (예: 5분 전)

format: 다양한 형태로 날짜를 포맷팅합니다.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.