내가 짜던 똥코드

개발 연차로 13년차인데, 나는 아직도 내가 1년차인것 같다. 매번 코드를 짤 때 마다, 혹은 남과 대화 할 때 마다 나는 똥코드를 발견하고 수정하기의 연속이다. 똥코드라..

똥코드의 예로 아래와 같은 코드가 있다.

const [selected, setSelected] = useState(getIsSelected(id));

위 코드에서 문제점을 느끼지 못하고 있다면 당신은 이미 나랑 같은 똥코드를 짜고 있는 것이다. 위의 코드는 다음과 같이 수정되는게 맞다.

const [selected, setSelected] = useState(() => getIsSelected(id));

보기 편하게 둘이 붙여보면...

// 1번 - SHIT
const [selected, setSelected] = useState(getIsSelected(id));

// 2번 - GOOD
const [selected, setSelected] = useState(() => getIsSelected(id));

https://react.dev/reference/react/useState#avoiding-recreating-the-initial-state

원래 의도는 getIsSelected를 처음 렌더할 때만 넣어주기 위함이었으나, 1번과 같이 짜면 매번 렌더 할 때 마다 계속 getIsSelected을 호출하게 된다. 만약 getIsSelected 함수가 좀 복잡한놈일 경우 큰 손해가 된다.

이렇게 리액트에서 가장 기본적인 useState 조차도 요상망측하게 쓰고 있었던거라, 하, 세상에.

---

사실 이런 글을 쓰는 것은 매우 부끄럽고 부담되는 부분이다. 다들 13년차라고 하면 우와 고랩이다- 라고 생각하겠지만, 나는 이렇게 빈 부분들이 5조 5억개는 있을것 같아 매일 가슴이 무겁다.

매번 커뮤니티에 질문을 할 때, "헐 어떻게 저걸 몰라" 라고 생각할 사람들이 있을것도 같지만, 내 생각은 다르다. 내 무지가 들통나는게 두려워 질문하지 않으면 무지한 사람으로 남겠지만, 질문하고 답변을 얻으면 아는 사람으로 발전한다. 그래서 나는 쪽팔림을 무릅쓰고 항상 질문하는 편이다.

이 글에는 앞으로도 내가 짠 똥 코드를 발견했을 때 기록으로 남겨 박제하고자 한다.