react 프로젝트 구성시 서버별 env 파일 선택하기 (env-cmd)
env-cmd 라이브러리를 사용하면, .env.production, .env.development 등의 복잡한 fallback 구조를 몰라도 명시적으로 파일을 지정할 수 있다. vite에는 내장된 기능인 것 같은데, next.js를 쓰는 플젝에서 env-cmd 를 발견함.
안드로이드 -> 윈도우 원격접속 (remote desktop, rdp, 원격 데스크톱) 솔루션 parsec 설정 정리
환경 Client 갤럭시 s23u Dex parsec option (client) Renderer: openGL vulkan으로 했을 경우, host 로그아웃시 client parsec이 먹통 벽돌이 되어, 앱 데이터를 삭제해야만 하는 상황이 있었음. H.265: On s23u, ryzen7900 내장 gpu는 H265를 잘 지원한다고 함. H264 대비 거의 2배의 효율을 갖는다고. Immersive Mode 커서를 화면 위 끝으로 옮겼을 때, android menu bar 등이 내려오지… Read More »
워드프레스(wordpress)를 직접 설치해서 사용하는 경우, 글 목록 정렬(list order by)을 커스텀 하는 방법 (feat. code snippet plugin)
그동안 소스 검색하고 여러가지 삽질을 했었는데, AI를 사용하니 그냥 딸깍이구나. code snippet 플러그인을 사용하면, 해당 기능 자체를 토글할 수도 있고, 테마 변경 등에도 영향을 받지 않아 아주 편리하다. https://chatgpt.com/share/695c614e-d4d8-8001-b99f-06c22ae60702
MP3파일 일괄 볼륨조정하기 (mp3 volume normalizing – feat. GPT)
늘 하던대로 MP3Gain 프로그램을 사용하려 했지만, 유튜브 3시간짜리 mp3라서 하다가 뻗는 경우가 너무 많았음. 그래서 GPT에 문의해 보니 ffmpeg cli 로 multicore를 full로 사용해서 하는 방법이 있다고 함. 먼저 ffmpeg를 다운로드 받고 bin dir을 path에 등록하자. GPT의 안내대로 2개의 bat 파일을 만들어서 수행 성공! 볼륨을 일괄 조정하고자 하는 폴더 내에 bat 파일들을 풀어놓고 normalize_parallel.bat을 실행하면… Read More »
갤럭시 삼성 덱스(DeX) 모니터 연결시, 고해상도 옵션 안보이는 문제 해결
good lock 앱 > MultiStar > I love Samsung Dex > 외부 디스플레이 고해상도 표시 활성화
[typescript] NPE를 방지하며 vscode 에서 타입 추론도 가능하게 하는 함수 (react-query return data, empty object fallback)
export const safeObj = <T extends object>(obj: T | undefined): T => { return (obj ?? {}) as T; } 진짜 개좋네… 고마워 GPT!
[링크] playwright 관련
https://www.dawnscapelab.com/running-and-debugging-playwright-tests/
[링크] 샤오미 Mi Home 앱, 한국, 중국 지역락 관계없이 통합 관리하는 방법
https://redbadastory.tistory.com/202 이번에 샤오미 타워팬 2를 샀는데, 앱을 중국으로 해야만 등록이 가능하다고 했다. 찾아보니 러시아 능력자가 Mi Home 의 커스텀 앱 apk를 만들어 배포하고 있었다. 그래도 께름칙하니, 갤럭시의 보안폴더에서 브라우저를 실행, apk를 다운받고, 보안폴더 내의 탐색기(내폴더)에서 설치했다. 잘 되네! 감사감사!
intellij 에서 특정 테마(theme)중 특정 영역(문법)의 색상(color) 변경하기
‘ctrl + shift + a’ > ‘color theme’ 입력 > 변경을 원하는 언어(e.g. python)를 선택하여 변경
git ignore 가 작동하지 않을 경우 체크 포인트
tracked 파일일 경우에는 .gitignore가 작동하지 않는다. 그럼 git rm –cached [filePath] 로 untracked 처리한다면? => 적용은 되겠지만, 다른 사람들에게도 untracked 처리되므로 주의해야 한다. tracked 파일을 로컬에서만 changes 에 보이지 않게 하고 싶으면 update-index를 사용하자. git update-index –assume-unchanged [filePath] git commit의 대상이 아니며, 로컬 only 작업이므로 외부 영향을 미치지 않는다. git update-index –no-assume-unchanged [filePath] 로 원복할… Read More »
mui grid 내에서 비동기 작업이 필요할 경우 (e.g. axios)
renderCell 하위 부분을 custom component화 해서 useEffect나 useQuery를 사용하자.
CORS 설정 관련 경험 기록
CORS 설정 OPTIONS method는 CORS 상황에서 발생한다? 여기서 CORS 관련 response header가 검증되면 브라우저가 본 요청을 보내는 것 같다. spring과 nginx에 CORS header 설정이 공존한다면 관리의 편의를 위해 spring에서만 CORS header를 설정하자 spring에서 CORS설정시 allow credentials 가 true일 경우, allow origins에’*’를 사용할 수 없다.
react에서 lodash debounce의 적용시 팁
꼭 이벤트핸들러에 딱 붙여서 하지 않아도 된다. FC body에서 debounce를 씌운 함수에, useCallback을 씌우고 변수로 할당하면 된다. debounce의 모든 영역에서 useCallback을 씌우는 것이 핵심이다!!
react 에서 hook을 호출할 수 없는 상황일 경우
함수를 주입받는 것도 생각해 보자.
react에서 js로 children 을 재귀 탐색하는 것은 불가능 한 듯.
냉무
yup 으로 custom function 사용시 yup.matches() 말고 yup.test()를 사용하자.
matches()는 메시지의 type이 matches()로 고정되고, react-hook-form에서 errors 배열을 추출할 대 구조가 달라서 문제가 된다.
[react query] 즉시 새로운 데이터를 가져오기
방법 1 queryClient.invalidateQueries({ queryKey }); await queryClient.refetchQueries({ queryKey }); // 데이터를 즉시 새로 가져옴 두 개의 함수를 호출해야 한다는 것, await 에도 주의하자. 방법 2 refetch(); // 데이터를 새로 가져오고 useQuery의 결과를 업데이트 지금 새로운 데이터를 fetch 하지 않아도 되는데, 캐시는 확실히 지워야 할 경우 e.g.) edit modal 닫을 때 cache clear queryClient.removeQueries({ queryKey });… Read More »
mybatis if문(when)에서 알 수 없는 NumberFormatException 이 발생하는 경우
if 문 내의 비교 문자열이 외따옴표로 감싸져 있지 않은지 확인하자. 오류 케이스 <if test="activeYn == 'Y'"> 성공 케이스 <if test='activeYn == "Y"'>
Ctrl + Shift + X 로 캡쳐하는 프로그램, 단축키 바인딩 제거
개발하면서 대소문자 변환시 Ctrl + Shift + X 를 사용해서 대문자 변환을 하는데, 언제부터인지 이상한 캡쳐 프로그램 (capture)이 그 단축키를 점유해 버리는 짜증나는 경험을 하고 있었다. 찾지 못하던 중에 끝내 찾아냈으니… 범인은 바로… 웨일 브라우저 (whale) 어우 진짜 너무 짜증나네.
[링크] p6spy 커스텀 설정 정보
개요 기본 설정(enable, logger)은 application.yml 에서 서버별로 설정 decorator: datasource: p6spy: enable-logging: true logging: slf4j 링크의 내용을 따라서 P6spyConfig 작성 P6spyPrettySqlFormatter 작성