TIL: react-datepicker, day.js

Datepicker

https://reactdatepicker.com/#example-specific-date-range
구현되어있는 예시가 많고 예제 코드가 잘 되어있어
잘 조합해서 쓰면 좋은 것 같다

yarn add react-datepicker
yarn add --save-dev @types/react-datepicker

import { useState } from "react";
import DatePicker from "react-datepicker";

import "react-datepicker/dist/react-datepicker.css";

const Example = () => {
  const [startDate, setStartDate] = useState(new Date());
  return (
    <DatePicker selected={startDate} onChange={(date:Date) => setStartDate(date)} />
  );
};

day.js

자바스크립트 기본 Date 객체와 자료형이 다르다
typescript.. 조금 곤란하지만 오히려 좋아
사용이 매우 간편하고 직관적이라 Date 객체를 사용하는 부분 모두 대체할 예정

yarn add dayjs

import * as dayjs from 'dayjs'
var now = dayjs()

now.fotmat('YYYY-MM-DD') // format 정의 속성으로 toString