분류 전체보기(18)
-
[React JS] 특정 브라우저에서만 URLSearchParams 의 size 가 null 일 때
인생을 살다보면 URLSearchParams 을 활용해 쿼리스트링값을 활용해야할 때가 있다.더 나아가, 쿼리스트링 오브젝트의 크기를 알고 싶을 때가 있다. 이때 자바스크립트는 좋은 api를 제공한다. 바로 URLSearchParams().size 이다.문제하지만 특정 브라우저에서는(내 경우에는 IPad OS 16의 Safari 16.5) URLSearchParams().size 를 찍으면 자꾸 null로 떴다. can i use를 들어가보면 URLSearchParams는 대부분의 브라우저에서 지원하고 있다. 도대체 뭐가 문제인걸까.원인can i use를 들여다보니 size 는 지원하는 범위가 남달랐다. 진짜 최신 브라우저는 지원하지만 2년 정도 전 버전의 브라우저에서는 지원하지 않는다고 되어있다! 나는 ..
2025.05.18 -
[React JS] Vite 빌드 시 파라미터로 개발 소스 내 assets 캐시 버스팅 하는 방법
발단인생을 살다보면 vite로 React 애플리케이션을 빌드할 때 아래와 같이 파일 경로에 hash 값을 넣는 방법이 아니라`static/[name].[hash].js`파라미터를 통해 캐시 버스팅을 하고 싶을 때가 있다. 아래처럼 말이다.`static/[name].js?[hash]`;문제는 이렇게 하면 해당 파일은 컴파일 되지 않는다.아래와 같은 에러가 나면서 말이다.ENOENT: no such file or directory, open ' ... some absolute path here ... \site\www\public\frontend\assets\someCss.css?v=82315f25'나의 경우에는 .css 파일을 파라미터를 사용하여 불러오고 싶었다.그 이유는 말하자면 길다.물리적 탈모를 경험..
2025.04.02 -
[React JS] Warning: Internal React error: Expected static flag was missing. 에러와 hook 호출의 규칙
Warning: Internal React error: Expected static flag was missing. Please notify the React team. 리액트 프로젝트를 진행하는 중에 이런 에러가 발생했다.아니 이게 뭐지?! 하면서 구글링을 했더니 나와 같은 문제를 겪은 사람들이 있었다.내가 작성한 코드 둥에 hook의 규칙을 위반하는 것이 있는 것이라고 한다. if (!isVisible) return null; 바로 컴포넌트 내에서 early return 하는 것이 문제가 된다고 하는데, 내 코드 중 이런 것이 있었다.만약 early return 을 hook까지 호출할 필요가 없지 않나? 라는 생각으로 early return 하는 부분 다음에 hook을 호출 하였던 것이었다. i..
2024.07.17 -
[React JS] React 로 MPA(Multi Page Application) 구현하기
React 프로젝트를 진행하던 중, 고객사에서 SPA 말고 MPA로 해달라는 요구가 들어왔다.하지만 당시 개발마감 일자까지 1달 밖에 남지 않은 촉박한 상황이었으며 이미 팀원들의 화면개발은 거의 다 완료된 상태였다. SPA를 MPA로 전환하기 위해서는 다른 프레임워크를 끼우는 방법이 있지만, 무언가를 새롭게 배워야하는 비용과 그때까지 작업하던 소스코드를 변경하는 비용은, 마감 일자가 1달 밖에 안남은 상황에서, 많은 부담이 되었다.팀원들이 작업한 소스코드를 최대한 유지하고 새롭게 무언가를 배우는 비용은 줄이되, SPA를 MPA로 전환하는 방법이 필요했다. 머리를 쥐어짜며 끙끙 앓고 있던 나에게 직장 선배가 아래 링크의 글을 보내주며 이 글을 참고하면 React를 MPA로 전환할 수 있겠다고 이야기 하였다..
2024.04.22 -
[React JS] Yarn 명령어 실행하는데 self signed certificate 에러가 날 경우
문제프로젝트를 받고 yarn으로 패키지를 설치하려니깐 이게 웬열;; 이런 에러가 났다.$ yarnyarn install v1.22.22info No lockfile found.[1/4] Resolving packages...error Error: self-signed certificate in certificate chain at TLSSocket.onConnectSecure (node:_tls_wrap:1674:34) at TLSSocket.emit (node:events:518:28) at TLSSocket._finishInit (node:_tls_wrap:1085:8) at ssl.onhandshakedone (node:_tls_wrap:871:12)info Visit http..
2024.04.12 -
[Electron + React JS] electron에서 postgresql 연결하기 (2)
git: https://github.com/kingkiboots/electron-pg-example electron에서 postgresql 연결하기 두 번째 시간에 오신 여러분들을 환영한다. 저번 시간에는 node.js에서 postgresql에 crud를 수행하는 service를 만들고 이를 renderer에서 사용하기 위한 밑작업을 수행하였다. (링크: https://wheatbeingdeep-codinggiliee.tistory.com/15 ) 저번 시간의 내용을 정리해 보자면, electron에서 postgresql와 연결하기 위해서는 pg라는 라이브러리를 설치한다. 그리고 이를 사용할 때에 pool을 사용하시는 걸 추천한다. electron이 제공하는 contextBridge.exposeInMai..
2024.03.05