들어가며
JavaScript의 기본 Date 객체만으로 날짜를 다루다 보면 포맷 변경이나 날짜 계산이 번거롭게 느껴질 때가 있습니다.
이럴 때 날짜 라이브러리를 사용하면 원하는 형식으로 날짜를 보여주거나, 특정 날짜를 더하고 빼는 작업을 쉽게 처리할 수 있습니다.
이번 글에서는 moment의 기본 사용법을 정리해볼게요.
설치하기
1
npm install moment
yarn을 사용한다면 다음 명령어로 설치할 수 있습니다.
1
yarn add moment
사용할 파일에서 import합니다.
1
import moment from "moment";
format()
format()은 날짜를 원하는 문자열 형식으로 바꿔줍니다.
1
2
3
4
5
6
7
const date1 = moment().format("YYYY-MM-DD");
const date2 = moment().format("YYYY.MM.DD");
const date3 = moment().format("YYYY년 MM월 DD일");
console.log(date1); // "2024-04-13"
console.log(date2); // "2024.04.13"
console.log(date3); // "2024년 04월 13일"
YYYY, MM, DD처럼 대문자 포맷을 사용해야 원하는 값이 나옵니다.
add()
add()는 현재 날짜에 시간을 더할 때 사용합니다.
1
2
3
const futureDate = moment().add(7, "days").format("YYYY-MM-DD");
console.log(futureDate);
사용할 수 있는 단위는 years, months, days, hours, minutes, seconds 등이 있습니다.
subtract()
subtract()는 날짜에서 시간을 뺄 때 사용합니다.
1
2
3
const pastDate = moment().subtract(1, "months").format("YYYY.MM.DD");
console.log(pastDate);
add()와 반대 역할을 한다고 생각하면 됩니다.
fromNow()
fromNow()는 특정 날짜가 현재로부터 얼마나 떨어져 있는지 상대적으로 보여줍니다.
1
2
3
const relativeTime = moment("2024-04-10").fromNow();
console.log(relativeTime);
게시글 작성 시간처럼 “몇 분 전”, “며칠 전” 형태가 필요할 때 유용합니다.
한국어로 표시하고 싶다면 locale 설정이 필요합니다.
1
2
3
4
import moment from "moment";
import "moment/locale/ko";
moment.locale("ko");
diff()
diff()는 두 날짜 사이의 차이를 계산합니다.
1
2
3
const days = moment("2024-04-30").diff("2024-04-01", "days");
console.log(days); // 29
두 번째 인자로 단위를 전달할 수 있습니다.
1
2
3
moment("2024-04-30").diff("2024-04-01", "months");
moment("2024-04-30").diff("2024-04-01", "days");
moment("2024-04-30").diff("2024-04-01", "hours");
마무리
moment를 사용하면 날짜 포맷 변경과 날짜 계산을 간단하게 처리할 수 있습니다.
format은 출력 형식 변경, add와 subtract는 날짜 더하기와 빼기, fromNow는 상대 시간, diff는 날짜 차이를 구할 때 사용합니다.
다만 새 프로젝트에서는 dayjs나 date-fns 같은 더 가벼운 대안도 많이 사용하므로, 프로젝트 상황에 맞춰 선택하면 좋습니다.