개발/짧은글 (4) 썸네일형 리스트형 [회고] 퇴사에서 이직까지 이직을 시작한 후 첫 면접에 떨어진 뒤 배운 내용을 포스팅 한 뒤 7~8월 간 이직을 위해 부단히 시간을 보냈다. 당연히 붙을 거라고 오만하게 생각했던 첫 기술 면접에서 탈탈 털린 후 자바스크립트와 리액트 위주로 기본기를 다시 잡았다. 자바스크립트를 공부한 것은 매우 좋은 선택이었다. 한 기업에서는 '리액트 하시는 분들이 잘 모르시는게 있는데 자바스크립트에서 bind, call, apply의 차이점이 무엇일까요?'라는 나름 야심찬 질문을 던졌을 때 준비가 잘 되어 있어 당당하게 대답했던 기억이 난다. 그리고 중간에 사이드 프로젝트를 구해서 기존에 하던 next.js가 아닌 react native 개발을 진행했다. expo는 처음 써봤는데 아직 다양한 SDK를 사용하지 않아서인지 크게 불편함을 느끼고 있지.. React-Query의 queryKey 설정 이슈 :: 페이지에서 검색 필터를 통해서 graphql 쿼리문의 where절에 조건을 추가해줬음에도 변경된 쿼리를 React Query가 불러오지 않음. const SomePage: NextPage = () => { const [filterValue, setFilterValue] = useState(); // filterValue 변경 시 자동으로 변경된 값을 가져오지 않음. const { data } = useQuery("some page contents", () => Someservice.getSomeContents(filterValue) }; return ( ); }; export default SomePage; (예시를 위한 코드로 실제 실행을 보장하지 않음) 해결 방법 :: React Query.. Delete `␍` eslint (prettier/prettier) 에러(LF, CRLF의 차이) 집에서 사이드 프로젝트를 진행하던 중, 기존 맥북으로 하던 작업을 데스크톱(윈도우)로 작업을 진행하였다. 맥북에서 작업하던 코드는 이상이 없었는데 윈도우로 새롭게 컴포넌트를 작성하니 작성한 코드의 문(statement) 끝마다 에러를 발생시키는 것이 아닌가? 멀쩡히 잘 되던 코드를 새로 작성했는데 이와 같은 에러가 발생하자 원인을 검색해보았다. 원인은 바로 LF와 CRLF의 차이로 인한 것이었다. 이를 위해서는 LF와 CRLF가 무엇인지 확인할 필요가 있다. CR : Carriage Return(\r) LF : Line Feed(\n) CR과 LF는 각각 새로운 줄 바꿈을 바꾸는 방식을 의미한다. CR의 경우 현재 줄에서 커서의 위치를 맨 앞으로 옮기는 동작, LF의 경우 현재 커서의 위치에서 하나의 줄.. [React/Next.js] createContext createContext는 React에서 지원하는 Context API의 메소드 중 하나이다. React 또는 Next.js에서 전역 상태(Global State) 관리에는 Redux(Redux Saga)나 Recoil 등을 많이 사용한다. 최근에는 Zustand라는 라이브러리도 떠오르고 있는 것으로 알고 있다. 최근에 하는 프로젝트에서는 Recoil를 사용했는데, 난감한 경우가 하나 있었다. 다크 모드 구현을 위해서 어떤 모드인지(라이트인지, 다크인지)에 대한 상태를 담고 있어야 할 필요가 있었다. Recoil을 사용하자니 _app.tsx가 Recoil Root를 선언하기 때문에 사용할 수가 없었다. 그렇다고 local storage를 사용하자니 Next.js에서 사용하기 때문에 undefined로 정.. 이전 1 다음
