전체 글
-
Date 타입의 불변성이 보장 되어야 하는 이유Javascript/개념 및 설명 2024. 7. 6. 12:48
js-joda나 day.js나 date-fns 등은 immutable 불변성을 보장하여 날짜 및 시간 객체가 변경 불가능 하기 때문에 예기치 않은 오류를 예방 할 수 있다. 로컬 시간대 사용 문제Date 객체는 생성할 때 시스템의 로컬 시간대 를 사용합니다. 이는 같은 코드라도 실행 환경에 따라 다르게 동작할 수 있습니다예를 들어, 동부 호주에서는 "new Date(2013, 0, 1)"이 실제로는 2012년 12월 31일 오후 1시(UTC)로 해석됩니다.이는 전 세계 어디에서든 동일한 시간으로 처리되어야 하는 소프트웨어에서는 큰 문제를 일으킬 수 있습니다. // 동부 호주의 로컬 시간대 (GMT+11)에서 실행된다고 가정let date = new Date(2013, 0, 1);console.log(da..
-
Moment.js를 사용하지 말아야 될 이유Javascript/라이브러리 및 API 2024. 7. 6. 12:39
Reference- https://d2.naver.com/helloworld/645609- https://unspecified.wordpress.com/2013/08/02/why-you-should-never-mutate-a-javascript-date/- https://momentjs.com/docs/#/-project-status/recommendations/momment.js 공식 문서에서도 레거시 프로젝트라고 정의 되어 있다.파일 크기가 아주 크다는 것이 가장 큰 단점Moment.js 객체는 가변 객체이다. 이 가변성은 예기치 않은 버그를 일으킬 수 있다.
-
npm publish중에 마주하게 된 에러Nestia 2024. 6. 28. 20:24
npm publish This command requires you to be logged in to Switch to Login module (by typing "how-to-npm" on command line)Type "npm adduser" to loginType "npm whoami" to confirm if logged inSwitch back to the package at which you are getting error(my case it was Publish Again)Type "npm publish"Done https://github.com/workshopper/how-to-npm/issues/25 npm publish has resulted in error "You need to a..
-
-
true/false toggle 메뉴 구현시 useReducer로 구현하기React.js 2024. 6. 27. 12:18
기존 코드// 컴포넌트const [isEndDateOpen, setIsEndDateOpen] = useState(false); setIsEndDateOpen(!isEndDateOpen)}> + 종료 날짜 및 시간 setIsEndDateOpen(!isEndDateOpen)}> - 종료 날짜 및 시간 useReducer로 개선하기// 컴포넌트const [isEndDateOpen, setIsEndDateOpen] = useReducer(state => { return !state;}, false);+ 종료 날짜 및 시간- 종료 날짜 및 시간 개선 후 장점코드가 간결 해진다.useState를 사용해서 true/false 토글시에 useCallback으로 감싸주어야 하거나 해야될 때 가 있는데 u..
-
react-hook-form에서 useController 커스텀 훅 사용React.js/React-hook-form 2024. 6. 25. 19:20
input 타입의 time 필드가 여러개가 존재 할때 재사용할 수 있는 컴포넌트를 만들때 useController 커스텀훅을 사용하면 좋을것 같았다. 재사용 컴퍼넌트를 만들때 useController에서 사용하고자 하는 props를 정의 해주어야 한다.control, name, validationOptions // FieldTime.tsximport React from 'react';import { Control, Path, RegisterOptions, useController } from 'react-hook-form';import Field from '../Field';interface Props> { control: Control; name: Path; validationOptions?: Omit..
-
Typescript에서 튜플 데이터를 가공 후 다시 리턴 하는 방법Typescript 2024. 6. 24. 14:36
// repository{ ... ... 중략... .then((data) => { const [schedule, number] = data; const newSchedule = schedule.map((value) => { return this.transformSharedMembers(value); }); // 튜플 데이터의 리턴타입을 어떻게 지정 해주어야할것인가? return [newSchedule, number]; }); private transformSharedMembers(data: ScheduleEntity) {..
-
Nestjs ConfigModule 사용시 환경변수 boolean값을 가져올때 string으로 가져오는 문제Nest.js 2024. 6. 24. 14:09
let cookieOptions: CookieOptions = { maxAge: Number(this.configService.get(ENV_COOKIE_MAX_AGE)), secure: this.configService.get(ENV_COOKIE_SECURE),}; CookieOptions에서 secure 프로퍼티의 옵션에는 boolean 값만 올 수 있는데typeof this.configService.get('COOKIE_SECURE')typeof this.configService.get(ENV_COOKIE_SECURE)> this.configService.get으로 .env 에 true나 false값을 가져오면 ***cookie_secure=*** string ***cookie_secur..