전체 글

📍들어가기 리액트는 함수형 프로그래밍이다. 하지만, 이에 맞게 기능을 개발하지 않고 함수를 만들게 된다면 의존성이 깊은 함수를 구현해내 의도하지 않은 버그를 마주할 가능성이 높아진다. 그래서 [원티드]프리온보딩-12월챌린지를 수강하면서 알게 된 액션/계산/데이터로 구현하기를 정리해보려 한다. ✨ 액션 / 계산 / 데이터 함수형 프로그래밍에서 구분해야 될 것은 단 3가지이다. 액션 👉 실행 시점과 횟수에 의존, 즉 부수효과가 있는 순수하지 않는 함수 ex) 이메일 보내기, 데이터 베이스 읽기 단점 외부 세계에 영향을 줄 수 있음, 테스트 시 로직과 외부 세계를 함께 재현해야 하는 문제 발생 실행하기 전까지 어떤 일이 발생하는지 알 수 없음 계산 👉 입력으로 출력을 계산, 순수함수 ex) 최댓값 찾기, 이메..

🌼 들어가기 모던 리액트 : Deep Dive 책을 정독하던 도중, useState의 lazy initialization에 대한 원리를 이해하고 싶었다. 콜백 함수로 넘기면 처음 초기화일때만 실행되는것일까...? 내부 구조가 어떻게 되어있길래, 값과 함수, 콜백함수의 양상이 다르게 발생되는 것일까...? 그냥 그렇구나..하기에는 너무 이해하고 싶었다. 이를 위해서 React 패키지의 구조를 살펴보며 useState를 불러오는 react 코어를 알아야 했다. 따라서 이번 글에서는 리액트의 패키지 구조를 살펴보고자 한다. ✨ React 패키지 구조 리액트 패키지는 총 5가지로 나눌 수 있다. 1️⃣ react 코어 컴포넌트 정의와 관련된 패키지이며, createElement( ) 와 다른 패키지의 모듈을 제..

💡 들어가기 어떤 경우에 useQuery와 useMutation 사용하는지, 또 타입 지정의 방식은 어떻게 이루어지는지 살펴보면서 기능개선을 한 작업을 바탕으로 해당 내용을 공유하려 한다. ✅ useQuery react 개발자라면 모두가 알고 있는 fetching, caching, 서버 데이터와의 동기화를 지원하는 라이브러리일 것이다. useQuery의 데이터 타입은 아래와 같다. export declare function useQuery (queryKey: TQueryKey, queryFn: QueryFunction, ..