본문 바로가기

TIL

UTC와 KST, 헷갈려서 정리해봤습니다

시간은 어디서나 흐르지만, 표현 방식은 다릅니다.
전 세계가 공유하는 UTC, 그리고 우리가 사용하는 KST. 이 둘의 차이를 정확히 알고 있어야 시간 처리 오류를 줄일 수 있습니다.

🌐 UTC란?

UTC는 Universal Time Coordinated, 즉 세계 협정시를 의미합니다.
전 세계 기준이 되는 시각으로, 모든 시간대의 기준점입니다.

예를 들어,

📍 UTC 기준 00:00은
📍 한국(KST) 기준 09:00입니다.

즉, KST는 UTC에 +9시간을 더한 시간대입니다.

🇰🇷 KST란?

KST는 Korean Standard Time, 즉 한국 표준시입니다.
한국은 UTC 기준 +9시간의 시차를 가지고 있으므로:

UTCKST
00:00 09:00
12:00 21:00
 

❗ 왜 UTC/KST가 중요한가요?

  • 프론트엔드에서는 사용자의 현지 시각으로 보여줘야 합니다.
  • 백엔드/DB에서는 통일된 기준(보통 UTC)으로 저장해야 합니다.
  • 시차가 적용되지 않으면 날짜가 하루씩 밀리거나, 예약 기능이 엉뚱한 시각에 실행되는 문제가 생깁니다.

특히 해외 서비스를 다루거나, 서버와 클라이언트가 다른 타임존일 경우에는 더욱 중요합니다.

 
import dayjs from "dayjs";
import utc from "dayjs/plugin/utc";
import timezone from "dayjs/plugin/timezone";

dayjs.extend(utc);
dayjs.extend(timezone);
dayjs.tz.setDefault("Asia/Seoul");

// KST -> UTC
export const formatUTC = (date: Date | undefined) => {
  try {
    if (!dayjs(date ? date : "").isValid()) return undefined;

    return dayjs(date).utc().format();
  } catch {
    return undefined;
  }
};

// UTC -> KST
export const formatKST = (date: Date | undefined) => {
  try {
    let formatDate = dayjs(date ? date : "");
    if (!formatDate.isValid()) return undefined;

    return formatDate.tz().format();
  } catch {
    return undefined;
  }
};

Day.js를 활용한 시간 변환 (UTC ↔ KST)

이전에는 날짜 객체를 new Date()로 처리했지만, 직관적이지 않고 timezone 지원이 부족했습니다.
그래서 우리는 dayjs와 timezone 플러그인을 사용했습니다.

🔧 설치

npm install dayjs
npm install dayjs-plugin-utc dayjs-plugin-timezone

📌 초기 설정

import dayjs from "dayjs";
import utc from "dayjs/plugin/utc";
import timezone from "dayjs/plugin/timezone";

dayjs.extend(utc);
dayjs.extend(timezone);
dayjs.tz.setDefault("Asia/Seoul"); // 기본 타임존을 KST로 설정

🔁 KST → UTC 변환 함수

export const formatUTC = (date: Date | undefined) => {
  try {
    if (!dayjs(date ? date : "").isValid()) return undefined;
    return dayjs(date).utc().format(); // UTC 기준 포맷으로 반환
  } catch {
    return undefined;
  }
};
  • 예: 2025-05-26T09:00:00+09:00 → 2025-05-26T00:00:00Z

서버에 저장할 때는 일반적으로 이 UTC 포맷을 사용합니다.

🔁 UTC → KST 변환 함수

export const formatKST = (date: Date | undefined) => {
  try {
    let formatDate = dayjs(date ? date : "");
    if (!formatDate.isValid()) return undefined;
    return formatDate.tz().format(); // KST 기준으로 반환
  } catch {
    return undefined;
  }
};
  • 예: 2025-05-26T00:00:00Z → 2025-05-26T09:00:00+09:00

사용자에게 보여주는 시간은 보통 이렇게 변환된 KST 시간입니다.

사용 예시

const now = new Date();

console.log("KST 기준 현재 시각:", formatKST(now));
// KST 기준 현재 시각: 2025-05-26T09:00:00+09:00

console.log("UTC 기준 현재 시각:", formatUTC(now));
//UTC 기준 현재 시각: 2025-05-26T00:00:00Z

정리

구분 UTC KST
의미 세계 협정시 한국 표준시
기준 기준값 (0) UTC + 9시간
사용 서버 저장, 통합 로그 사용자 UI, 예약 시간 표시 등

마무리

시간은 언제나 흐르지만, 그 표현은 상황에 따라 달라집니다.
UTC와 KST의 차이를 명확히 이해하고, 이를 코드에서 정확히 처리하는 것은 예약, 일정, 만료 시간 등 핵심 기능의 신뢰도를 높이는 중요한 기초라고 생각합니다!