Conversation
⚡️ Lighthouse Report
📊 Performance Details (성능 세부 지표)
|
|
🚀 Storybook preview: https://687852cd7789368357f3bb71-wcnufpgsid.chromatic.com/ |
| const [date, time] = deadline.split('T'); | ||
| const replacedDeadline = new Date(deadline.replace('Z', '')); | ||
|
|
||
| const date = replacedDeadline.toLocaleDateString('sv-SE'); |
There was a problem hiding this comment.
스워덴 날짜-시간을 쓰지 않고, 이런식으로 줄수 있을까요?
| const date = replacedDeadline.toLocaleDateString('sv-SE'); | |
| const date = replacedDeadline.toLocaleDateString('ko-KR'); |
혹시 스웨덴쪽으로 한 이유가 무엇인지 궁금합니다!
There was a problem hiding this comment.
ko-KR 쪽으로 하면 2026.03.27 식으로 표현이 되고 sv-SE로 해야 2026-03-27로 표현돼서 스웨덴쪽으로 작성했습니다!
There was a problem hiding this comment.
비슷한 애로사항이 조금 존재했네요.
로컬 타임존 기준으로 2024-05-16T01:30:00.000Z → 2024-05-15 이렇게 만들고 싶은데 best practice가 뭔가요?
Temporal을 쓰라고 하지만, Safari가 아직 미지원이니 현재는
const toLocalDateString = date =>
new Date(date - date.getTimezoneOffset() * 60_000)
//오프셋 계산
.toISOString()
// 기존에 주던 (DATE)T(TIME) 방식으로 불러옴.
.replace(/T.*/, "");
// T이후의 string 다 짜르면 DATE만 남음.이 정도의 유틸 함수를 하나 만들어서 sv-SE를 대체하는 것이 괜찮을것 같아요. Temporal이 크로스브라우저 지원을 완전히 갖추면 아래것도 생각해볼수 있지만.. 일단 이렇게 쓰는게 어떠할까요?
// Temporal 완전 지원 이후(지금은 쓰지 못함.)
const toLocalDateString = date =>
Temporal.Instant.from(date.toISOString())
.toZonedDateTimeISO(Temporal.Now.timeZoneId())
.toPlainDate()
.toString(); // "2025-03-27"There was a problem hiding this comment.
저는 유틸함수를 따로 빼서 대체하는 것도 좋을 것 같습니다 ! Temporal 부분에 대해서는 조금 더 고민해야겠지만 ,, 우선 현재로서는 마빈이 말한 방법이 최선일 것 같아요~!
There was a problem hiding this comment.
유틸함수 분리 좋을 것 같아요! 수정해보겠습니다👍
근데 지금 방 생성 페이지에서 설정한 데드라인 날짜, 시간 그대로 서버에서도 보내주고 있습니다.
예를들어 2026/03/29 13:00 -> "2026-03-29T13:00:00" 이렇게 오고 있습니다!
그래서 9시간 조정 없이 아래와 같은 형태로 작성될 것 같은데 어떻게 생각하시나요?
const formatUTCDateTime = (isoString: string) => {
const iso = new Date(isoString).toISOString();
const [date, timeWithMs] = iso.split('T');
const time = timeWithMs.slice(0, 5);
return { date, time };
};There was a problem hiding this comment.
오, 그방법이 있으면 그렇게 하면 됩니다!
|
@thgml05 고생하셨습니다 해삐
어떻게 생각하실까요.? |
| const replacedDeadline = new Date(deadline.replace('Z', '')); | ||
|
|
||
| const date = replacedDeadline.toLocaleDateString('sv-SE'); | ||
| const time = replacedDeadline.toLocaleTimeString('ko-KR', { | ||
| hour: '2-digit', | ||
| minute: '2-digit', | ||
| hour12: false, | ||
| }); |
There was a problem hiding this comment.
| const replacedDeadline = new Date(deadline.replace('Z', '')); | |
| const date = replacedDeadline.toLocaleDateString('sv-SE'); | |
| const time = replacedDeadline.toLocaleTimeString('ko-KR', { | |
| hour: '2-digit', | |
| minute: '2-digit', | |
| hour12: false, | |
| }); | |
| function parseDeadline(deadline: string) { | |
| const d = new Date(deadline.replace('Z', '')); | |
| return { | |
| date: `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`, | |
| time: `${String(d.getHours()).padStart(2, '0')}:${String(d.getMinutes()).padStart(2, '0')}`, | |
| }; | |
| } |
There was a problem hiding this comment.
혹시 원인을 정확히 파악하기 힘들다고 이야기해준 부분이 예를들어 어떤 걸 이야기하는지 알 수 있을까요??🧐
There was a problem hiding this comment.
원인이라기보단 의도파악에 조금 더 가까울 것 같습니다! 추후에 코드만 보면 왜 스웨덴 로케일이 여기에 있는지 하고 의아해질 것 같습니다! YYYY-MM-DD 포맷을 얻기 위한 트릭이라는 걸 알려면 sv-SE의 날짜 포맷 특성을 별도로 알고 있어야하고, 주석도 없다면 나중에 더더욱 헷갈리지 않을까요!?
그리고 단순히 생각해보면, 서버에서 내려온 날짜를 우리 화면에 맞게 표시하기 위해 가공하는 로직인데, 이때 sv-SE라는 스웨덴 로케일의 포맷 특성을 빌려 쓰는 방식이 직관적이지 않다고 느꼈습니다. YYYY-MM-DD 포맷이 필요하다면 직접 조립하는 게 의도가 더 명확할 것 같습니다.~
There was a problem hiding this comment.
sv-SE 포맷 특성을 바로 알지 못한다고 가정하면 호이초이가 제안해준 코드가 더 직관적인 방향일 수 있겠네요!
그럼 이 방향으로 수정해보도록 하겠습니다!
|
🚀 Storybook preview: https://687852cd7789368357f3bb71-dnalvjvklm.chromatic.com/ |
#️⃣ 연관된 이슈
📝 작업 내용
📸 참고 이미지
수정 전


수정 후
💬 리뷰 요구사항