작성한 질문수 2

4

안녕하세요 이정환입니다.

예제 코드를 작성할 때에 국내 시간대 이외의 시간대를 고려하지 못했네요
미국 시간대의 경우 문제가 발생하는게 사실입니다.
우선 수강에 불편함을 드려 죄송합니다 🥲

이 문제가 발생한 이유는 new Date(yyyy-mm-dd) 형식은 UTC 타임을 기준으로 Date 객체를 생성하기 때문입니다. 따라서 말씀하신 것 처럼 UTC -n 시간대에서는 문제가 발생할 수 있습니다.

이 문제에 대한 해결책은 말씀하신 getStringDate를 이용하는 것 도 훌륭한 해결책이 될 수 있습니다.
그런데 다른 해결책도 궁금하시다면 아래의 2가지를 참고하실 수 있습니다.

첫번째 : yyyy-mm-dd 00:00:00 형식 사용하기

yyyy-mm-dd 형식과 달리 yyyy-mm-dd 00:00:00 형식을 사용해 Date 객체를 생성하면 UTC 기준이 아닌 현재 시간대(로컬 타임)를 기준으로 Date 객체를 생성합니다. 이를 이용하면 시간대가 달라서 겪는 문제를 쉽게 해결될 수 있습니다. 우리 프로젝트에 적용하시려면 src/App.js의 onCreate를 다음과 같이 수정하시면 됩니다.

  // src/App.js

  const onCreate = (date, content, emotionId) => {
    dispatch({
      type: "CREATE",
      data: {
        id: idRef.current,
        date: new Date(`${date} 00:00:00`).getTime(),
        content,
        emotionId,
      },
    });
    idRef.current += 1;
  };

두번째 : yyyy/mm/dd 형식 사용하기

yyyy-mm-dd 형식과 달리 yyyy/mm/dd 형식 또한 앞서 살펴본 yyyy-mm-dd 00:00:00 형식과 같이 로컬타임을 기준으로 Date 객체를 생성합니다. 따라서 다음과 같이 src/App.js를 수정하시면 문제가 해결됩니다.

  // src/App.js

  const onCreate = (date, content, emotionId) => {
    dispatch({
      type: "CREATE",
      data: {
        id: idRef.current,
        date: new Date(date.replaceAll("-", "/")).getTime(),
        content,
        emotionId,
      },
    });
    idRef.current += 1;
  };

yyyy-mm-dd 형식의 문자열을 문자열 메서드 replaceAll을 이용하여 yyyy/mm/dd 형식으로 변환합니다.

이 두 방법외에도 new Date(yyyy, mm, dd) 형식을 사용할 수 있으나 이 때의 mm은 0부터 11 까지로 월을 표현하기 때문에 월에 -1을 해주어야 하는 문제가 있어 우리 프로젝트에 어울리지는 않다고 생각되므로 권장드리지는 않습니다.

감사합니다.

1

감사합니다 . yyyy-mm-dd 00:00:00 형식을 사용하니 간단히 해결되었습니다.

getTime의 문제가 아닌 new Date()을 만들때 사용되는 형식의 문제였군요. 좋은정보 감사합니다!