Showing Posts From

블로그

유튜브 → 블로그 → 스택오버플로우: 나의 검색 순서

유튜브 → 블로그 → 스택오버플로우: 나의 검색 순서

유튜브 → 블로그 → 스택오버플로우: 나의 검색 순서 아침부터 에러 오늘도 출근했다. 슬랙 확인. 선배가 남긴 메시지. "이신입님, 어제 올린 PR 머지했어요. 근데 프로덕션에서 useEffect 무한루프 도는 것 같은데 확인 부탁드립니다." 심장이 멈췄다. 급하게 코드 열었다. 어디가 문젠지 모르겠다. 일단 로컬에서 돌려봤다. 멀쩡하다. 프로덕션은 왜 터진 거지. 검색 시작.1단계: 유튜브 일단 유튜브다. "리액트 useEffect 무한루프" 검색창에 친다. 영상이 수십 개 뜬다. 썸네일에 빨간 화살표 그려진 거 클릭. 10분짜리 영상. 한국어다. 좋다. 재생 시작. 인트로 30초 스킵. "안녕하세요 여러분~" 10초 더 스킵. 본론 나온다. 의존성 배열 설명. 아 이거 아는 건데. 계속 본다. 5분쯤 지나니까 내 상황이랑 비슷한 예제 나온다. 오. 이거다. 근데 끝까지 봐도 정확한 해결책은 안 나온다. 댓글 본다. "이 방법 말고 cleanup 함수 쓰는 게 나을 것 같은데요" cleanup 함수? 그게 뭔데. 다시 검색. "리액트 cleanup 함수" 또 10분짜리 영상. 본다. 이번엔 영어 영상이다. 자막 켠다. 대충 이해했다. 근데 내 코드에 어떻게 적용하지. 시간 30분 지남. 유튜브의 장점은 이거다. 일단 편하다. 누워서도 볼 수 있다. 출근길 지하철에서도 본다. 코드 치는 화면 보면서 따라 하면 된다. 개념도 영상으로 보면 이해가 빠르다. 근데 단점도 있다. 내 문제랑 정확히 일치하는 영상은 없다. 비슷한 것만 있다. 그래서 여러 개 봐야 한다. 그러다 보면 시간이 흐른다. 어느새 1시간. 선배가 지나간다. 모니터 얼른 가린다. 유튜브 보는 거 들키면 안 된다.2단계: 블로그 유튜브로 안 되면 블로그다. 구글 검색. "react useEffect infinite loop production" 한글로 검색했다가 결과 별로면 영어로 다시 검색한다. 첫 페이지에 벨로그 글 세 개. 티스토리 두 개. 미디엄 하나. 일단 벨로그부터 본다. 제목이 정확히 내 상황이다. "프로덕션에서만 발생하는 useEffect 무한루프 해결" 클릭. 들어간다. 글 읽는다. 코드 예시 있다. 복사한다. 내 코드랑 비교한다. 어? 비슷한데 살짝 다르다. 댓글 본다. "이거 저도 겪었는데 결국 strict mode 문제였어요." strict mode? 그게 뭔데. 다시 검색. "리액트 strict mode 무한루프" 티스토리 글 나온다. 읽는다. 아. Next.js는 기본으로 strict mode 켜져 있대. 그래서 개발 환경에서는 useEffect가 두 번 실행된대. 근데 프로덕션은 다르대. 이해했다. 근데 해결은 못 했다. 시간 1시간 지남. 블로그의 장점은 이거다. 검색하면 바로 나온다. 글이니까 빨리 읽을 수 있다. 코드도 복사 붙여넣기 쉽다. 내 상황이랑 비교하면서 볼 수 있다. 한국어 블로그 많다. 같은 고민 하는 사람들 많다. 댓글에 답 있을 때도 있다. 근데 단점도 있다. 글이 오래됐다. 2년 전 글이다. 리액트 버전이 다르다. 어떤 글은 틀린 정보다. 댓글에 "이거 옛날 방식이에요" 써 있다. 블로그마다 설명이 다르다. 누구 말이 맞는지 모르겠다. 결국 여러 글 읽어야 한다. 그러다 보면 헷갈린다. 점심시간 지났다. 밥 못 먹었다.3단계: 스택오버플로우 마지막 희망. 스택오버플로우. 영어로 검색한다. "useEffect infinite loop production only" 질문 글 나온다. 2015년. 오래됐다. 답변 10개. 첫 번째 답변 체크 표시 있다. 좋아요 234개. 읽는다. 영어다. 천천히 읽는다. 코드 예시 있다. 복사한다. 내 코드에 붙여넣는다. 에러 난다. 다시 본다. 아. 이 답변은 클래스 컴포넌트 기준이다. 나는 함수형 쓴다. 스크롤 내린다. 다른 답변 본다. "This answer is outdated. Use hooks instead." 댓글에 써 있다. 또 스크롤. 세 번째 답변. 좋아요 89개. 읽는다. 함수형이다. 코드 복사. 붙여넣는다. 돌려본다. 된다. 심장이 뛴다. 프로덕션 배포한다. 기다린다. 에러 안 난다. 해결했다. 시간 2시간 반 지남. 스택오버플로우의 장점은 이거다. 정확하다. 전문가들이 답한다. 여러 답변 비교할 수 있다. 좋아요 많은 거 보면 된다. 댓글에 최신 정보 있다. "이 답변은 옛날 거예요" 친절하게 알려준다. 비슷한 질문 링크도 있다. 따라가면서 보면 이해된다. 근데 단점도 있다. 영어다. 읽는 데 시간 걸린다. 질문 자체를 이해 못 할 때도 있다. 내가 모르는 용어 많다. 답변이 너무 전문적이다. "You should implement memoization with useMemo" 이런 거 나오면 또 검색해야 한다. 그래도 결국엔 여기서 답 찾는다. 유튜브랑 블로그에서 못 찾으면 마지막은 여기다. 내 검색 패턴 정리하면 이렇다.문제 생긴다 유튜브 검색 (20~30분) 대충 개념 이해 블로그 검색 (30분~1시간) 비슷한 사례 찾기 스택오버플로우 (1~2시간) 정확한 답 찾기 해결매번 이 순서다. 왜냐면 유튜브가 제일 쉽다. 영상 보면 이해된다. 근데 정확하지 않다. 블로그는 중간이다. 한글이라 읽기 편하다. 근데 정보가 들쭉날쭉하다. 스택오버플로우는 어렵다. 영어고 전문적이다. 근데 제일 정확하다. 그래서 쉬운 것부터 시작한다. 안 되면 어려운 걸로 간다. 효율적인지 모르겠다. 근데 내가 할 수 있는 방법은 이거다. 검색도 실력 요즘 깨달은 게 있다. 검색도 실력이다. 같은 문제인데 검색어를 어떻게 치느냐에 따라 결과가 다르다. "리액트 에러" 이렇게 치면 별로다. "react useEffect dependency array infinite loop" 이렇게 쳐야 한다. 영어로 쳐야 결과가 많다. 한글로 치면 한정적이다. 에러 메시지 그대로 복사해서 검색하는 것도 좋다. "TypeError: Cannot read property 'map' of undefined" 이거 그대로 복붙하면 관련 글 바로 나온다. 키워드를 정확히 쓰는 것도 중요하다. "안 돼요" 이러면 안 된다. "작동 안 함" 도 애매하다. "infinite loop" "memory leak" "type error" 이렇게 정확한 단어 써야 한다. 그리고 여러 소스를 봐야 한다. 유튜브 하나만 보고 끝내면 안 된다. 블로그 세 개는 읽어야 한다. 스택오버플로우도 답변 여러 개 비교해야 한다. 시간 걸린다. 근데 이게 공부다. 선배는 어떻게 하나 궁금했다. 점심 먹으면서 물어봤다. 선배한테. "저는 검색할 때 보통 어떤 순서로 하세요?" 선배가 웃었다. "나도 비슷해. 근데 요즘은 ChatGPT부터 물어본다." ChatGPT. 나도 쓴다. 근데 제대로 못 쓴다. "에러 났어요 어떻게 해요" 이렇게 물어보면 답이 애매하다. 선배는 다르게 쓴다. "에러 메시지랑 내 코드 다 붙여넣고, 뭘 시도했는지도 설명한다. 그러면 정확한 답 나온다." 아. 그렇게 쓰는 거구나. 나는 질문을 대충 했다. 그래서 답도 대충 나왔다. 질문을 잘해야 한다. 검색어도 그렇고 ChatGPT도 그렇고. 정확하게 물어봐야 정확한 답이 나온다. 당연한 건데 몰랐다. 시간이 아깝다 오늘 하루 검색한 시간 계산했다. 약 4시간. 실제 코드 짠 시간은 1시간. 검색이 4배 더 길다. 이게 맞나 싶다. 근데 다른 동기들도 비슷하다고 한다. "나도 하루에 검색만 서너 시간 한다." 다들 그렇다. 신입이니까 모르는 게 당연하다. 그래서 검색한다. 근데 언제까지 이럴까. 1년 차 되면 나아질까. 2년 차 되면. 선배들도 검색한다. 근데 속도가 다르다. 나는 한 문제에 3시간. 선배는 30분. 10배 차이다. 경험 차이다. 검색 실력 차이다. 나도 언젠가 빨라질까. 그러려면 지금 이 과정이 필요하다. 검색하면서 배운다. 시행착오하면서 는다. 아깝지만 어쩔 수 없다. 검색 기록 브라우저 히스토리 봤다. 오늘 하루만.react useEffect infinite loop (3회) useEffect cleanup function 사용법 (2회) react strict mode 끄기 (1회) next.js production build useEffect (2회) stackoverflow react hooks (5회) 리액트 의존성 배열 (1회) how to debug useEffect (1회)검색어만 15개. 열어본 페이지는 30개 넘는다. 유튜브 영상 4개. 블로그 글 12개. 스택오버플로우 6개. 그중에서 실제로 도움 된 건 3개. 효율 10%. 나머지 90%는 시간 낭비. 근데 그 3개 찾으려면 30개 봐야 한다. 검색은 원래 이런 거다. 쓸데없는 것도 보고 헤매다가 결국 찾는다. 지름길은 없다. 내일도 내일도 검색한다. 또 유튜브 보고 블로그 읽고 스택오버플로우 뒤진다. 이게 내 일상이다. 3개월 차 신입이 할 수 있는 거. 언젠가는 검색 없이도 코드 칠 수 있을까. 선배처럼 척척 해결할 수 있을까. 모르겠다. 근데 지금은 이렇게라도 한다. 검색하면서 배운다.오늘도 4시간 검색했다. 내일은 3시간으로 줄이고 싶다.