210803 개발기둝: moment.js

2021. 8. 3. 21:20γ†πŸ“” TIL

 

πŸ—“  Moment.js

moment.js λŠ” javascript μ—μ„œ νŠΉμ • ν˜•νƒœμ˜ λ‚ μ§œλ₯Ό λ‹€λ£° λ•Œ μ‚¬μš©ν•  수 μžˆλŠ” Date-time library λ‹€.

λΈŒλΌμš°μ €μ— 따라 μ‹œκ°„λŒ€κ°€ λ‹€λ₯Έ 경우 ν˜Ήμ€ μ›ν•˜λŠ” ν˜•νƒœμ˜ λ‚ μ§œλ₯Ό 닀루고 싢을 λ•Œ moment.js λ₯Ό μ‚¬μš©ν•˜λ©΄ μœ μš©ν•˜λ‹€.

 

moment.js λ₯Ό λͺ°λžμ„ 땐 μžλ°”μŠ€ν¬λ¦½νŠΈ λ‚ κ²ƒμ˜ date 객체λ₯Ό μ›ν•˜λŠ” λ‚ μ§œ ν˜•νƒœ(ex YYYYMMDD) 둜  λ°”κΎΈλŠ” 일이 λ²ˆκ±°λ‘œμ› λ‹€.

1μ›”μ΄λ‚˜ 2μ›” 처럼 ν•œμžλ¦Ώμˆ˜ μ›”μ—λŠ” 0을 μ•žμ— κΌ­ λΆ™μ—¬μ•Όν–ˆκ³  (μΌμžλ„ λ§ˆμ°¬κ°€μ§€), 각각의 λ…„,μ›”,일을 λ‹€μ‹œ ν•˜λ‚˜μ˜ λ‚ μ§œλ‘œ 합쳐여 ν•˜λ‹ˆ μ—¬κ°„ 번거둜운 일이 아닐 수 μ—†μ—ˆλ‹€.

 

❌  moment.js λ₯Ό μ‚¬μš©ν•˜μ§€ μ•Šμ„ λ•Œ  ❌

export const eightStringDate = (): string => {
    const DATE = new Date()
    const year = String(DATE.getFullYear())
    let month = String(DATE.getMonth() + 1);
    let date = String(DATE.getDate());
    month = month.length < 2 ? '0' + month : month
    date = date.length < 2 ? '0' + date : date
    return year + month + date;
}

moment 없이 μ—¬λŸκΈ€μž(YYYYMMDD) ν˜•νƒœμ˜ λ‚ μ§œλ₯Ό λ§Œλ“€ λ•Œ μž‘μ„±ν•œ μ½”λ“œμ΄λ‹€. YYYYMMDD ν˜•νƒœμ˜ μ—¬λŸ 문자λ₯Ό 뽑기 μœ„ν•΄ λΆ€μˆ˜μ μΈ μ½”λ“œκ°€ 많이 μ‚¬μš©λœλ‹€.

 

πŸ”΅  moment.js λ₯Ό μ‚¬μš©ν•  λ•Œ  πŸ”΅ 

 

moment 라이브러리 μ„€μΉ˜

$ npm i moment
// or
$ yarn add moment

 

import moment from "moment";

export const eightStringDate = (): string => {
  const Date = new Date();
  return moment(DATE).format("YYYYMMDD"); // 20210803
}

μš°μ„  moment 라이브러리λ₯Ό import ν•œλ‹€.

moment() λΌλŠ” ν•¨μˆ˜μ— λ‚ μ§œ 객체λ₯Ό 넣은 ν›„ format() λ©”μ„œλ“œλ₯Ό μ‚¬μš©ν•˜λ©΄ κ°œλ°œμžκ°€ μ›ν•˜λŠ” ν˜•νƒœμ˜ λ‚ μ§œλ₯Ό 좜λ ₯ν•  수 μžˆλ‹€.

κΈ°μ‘΄ μ½”λ“œμ— λΉ„ν•΄ 5쀄 μ΄λ‚˜ μ€„μ–΄λ“€μ—ˆλ‹€.

 

λ‚ μ§œ 뿐만 μ•„λ‹ˆλΌ μ‹œκ°„ λ˜ν•œ μ›ν•˜λŠ” 포맷으둜 좜λ ₯ν•  수 μžˆλ‹€.

export const gmtDate = (): string => {
    const DATE = new Date();
    return moment(DATE).format("YYYY-MM-DD HH:MM:SS") // 2021-08-03 09:00:00
};

 

moment 라이브러리λ₯Ό μ‚¬μš©ν•˜λ©΄, μ›ν•˜λŠ” 포맷의 λ‚ μ§œλ₯Ό 좜λ ₯ν•˜κΈ° 훨씬 μˆ˜μ›”ν•΄μ§„λ‹€! λͺ¨λ‘ μ• μš©ν•˜λ„λ‘ ν•˜μž :)