React
8 posts
데이터 동기화 메커니즘으로서의 useEffect 탐구하기

들어가며 7월부터 주 5일, 하루 30분씩 개발 탐구를 하는 시간을 가져보자라는 습관 만들기를 시작했고, 5일을 채우지 못할 때가 있어도 느슨하게 지속해나가고 있다. 매일 사용하는 React와 더 친해져보고 싶다는 생각이 들어 내부 구현에 대한 아티클을 하나 둘씩 찾…

August 14, 2024
React
반복되는 분기처리에 전략패턴 도입하기

들어가며 최근 소속된 개발자 커뮤니티의 네트워킹 행사에서 반복되는 분기처리에 전략패턴 도입하기라는 제목으로 발표를 했다. 주제를 정해 발표 자료를 준비하고 피드백을 요청해 다듬어나간 경험만으로도 즐겁고 알찬 경험이었지만, 글로도 남겨보면 더 오래오래 남을 것 같아 블…

July 15, 2024
React
[번역] HOC Pattern

본 글은 원글 patterns - HOC Pattern을 학습용으로 번역한 것입니다. 고차 컴포넌트 패턴 애플리케이션에서 여러 컴포넌트에 동일한 로직을 사용하고자 할 때가 있습니다. 이 로직에는 컴포넌트에 특정한 스타일링을 적용시키는 것, 권한 요구, 전역 상태룰 …

March 17, 2024
React
[번역] Compound Pattern

본 글은 원글 patterns - Compound Pattern을 학습용으로 번역한 것입니다. 들어가며 라는 문장에 깊은 감명을 받았던 최근.. patterns에 정리된 패턴 하나하나를 뽀개보려 한다. 원문 자체가 단순한 영문으로 이루어져 있지만 이해한 후 다시한번 …

March 03, 2024
React
react-hook-form을 사용하며 알게된 것들

들어가며 업무 중 react-hook-form을 사용하다보니 공식문서에 기재된 best practice뿐만 아니라 이런 저런 방법으로 응용이 필요했다. 나름의 방법으로 고심해보며 중간중간 드는 궁금증들은 실제 구현된 코드도 찾아보며 해결해보기도 했다. 그 여정을 간단…

December 24, 2023
React
ReactNode, ReactElement 그리고 JSX.Element

들어가며 Typescript로 개발을 하다보면 자주 마주치는 타입 ReactNode, JSX.Element 그리고 ReactElement. 어느 날 문득 나는 각 타입의 차이를 명확히 설명할 수 있나라는 의문이 들었고, 그 대답은 아니다였기에 정리해본다. React…

May 07, 2023
React
점차 느려지는 Count 애니메이션 구현하기

들어가며 우리는 종종 숫자를 count하는 애니메이션을 접하게된다. 예를 들어 게임 화면에서 유저가 획득한 포인트를 보여줄 때, 할인된 가격을 안내할 때, D-day까지 남은 일수를 보여줄 때 등등 숫자값을 강조해야하는 상황에서 자주 사용된다. 그럼 이 애니메이션은 …

July 18, 2022
React
React Portal을 이용한 Modal 구현하기

한국인에게 portal이란.. 닥터스트레인지의 마법진같은 포탈만 떠오를 수 있다. 이미 충분히 익숙한 다른 곳으로 이동시킨다는 개념을 이어받아 컴포넌트를 부모 컴포넌트의 바깥에 렌더링해주는 신기한 portal을 알아보자. Portal이란 React 공식 문서에 따…

November 05, 2021
React