고양이손으로 개발

# 이슈 리액트 개발을 하다 보면, 특히 함수형 컴포넌트를 사용하면서 중복 실행되는 코드들을 모두 점검하고 수정했음에도 useEffect가 두 번 실행되는 경우가 있다. useEffect의 의존성 배열을 공백으로 두면 컴포넌트가 마운트 되는 순간 한번 실행되는데 useEffect(() => { // 한번만 실행되는 로직 }, []); 이 로직을 제외한 다른 useEffect, console.log 등 등 제거해도 해당 로직만 두 번씩 실행돼서 당황했었다. 찾아보니 리액트에서 제공하는 기능 중 하나인 'StrictMode'의 영향이라고 한다. 다행히? 개발 모드에서만 발생하는 현상으로, 실제 빌드 시 한 번만 실행된다고 하는데.. 그런 건 중요하지 않다면, 지금 이 기능을 사용하고 싶지 않다면 # 방안 우..

# 이슈 리액트 환경에서 커스텀 훅, 또는 공통 함수가 필요한 경우가 더러 있다. 커스텀 훅이란 리액트에서 사용하는 훅들 (use~ 이름의 함수들)을 제외한 사용자 정의 함수인데, 개인적으로는 쉽게 공통함수와 비슷한 결로 이해하고 있었다. 그리고 이렇게 이해한 게 문제였다,, 문제 해결 부분만 보고 싶으신 분들은 아래 #방안 부터 읽으시면 됩니다. 문제가 발생한 순서는 이렇다. 일부 페이지에서 id값을 받아 특정 텍스트로 변환하는 함수가 필요함 공통 함수만 만들면 되겠다! 커스텀 훅이 공통 함수인가? 이걸로 해보자 물론 커스텀 훅은 공통함수가 맞지만, 반대의 경우는 성립되지 않는다. 문제의 코드이다. export default function useFuction() { // 공통 함수 내용 return ..