thumbnail
@Donghee_Kim
Front-end developer, knowledge sharer, avid reader and writer
동료들의 멋진 행동에서 나의 액션 아이템 찾기

들어가며 2023년 인프콘에 참석했을 때 진유림님의 팀플레이어 101: 팀의 성공을 위해 달리는 메이커 되기 세션을 들었었다. 세션은 청중에게 팀플레이어가 되기 위한 몇가지 액션 아이템을 제안하는 것으로 마무리 되었는데, 내게는 그 중 하나인 동료들의 멋진 행동을 모아보고 나의 액션 아이템으로 만들기가 기억에 남았다. 그렇게 1년 정도가 지났고, 돌이켜보니 나도 모르게 동료분들의 멋진 행동을 남몰래 머릿속에 저장하고 나름대로 따라하고 있더라. 동료의 멋진 행동들을 동료평가의 긍정적인 피드백으로 적어낸 적은 있지만 내게 어떤 영향을 미쳤는지, 내 공간에 기록해 본 적은 없는 것 같아 적어보는 글. 딱 1년이 지났으니 정리하기 좋은 시점이다! 지시 대명사 줄이기 - 스쿼드 기획자님으로부터 개인적으로 업무적인 커뮤니케이션에선 ‘알잘딱깔센’으로 두루뭉술한 내용도 센스있게 알아듣는 것보단, 최대한 정확한 전달이 필요하다고 생각하는 편이다. 그 중 하나로, 대화 참여자들이 모두 같은 화면을 …

September 01, 2024
회고록
데이터 동기화 메커니즘으로서의 useEffect 탐구하기

들어가며 7월부터 주 5일, 하루 30분씩 개발 탐구를 하는 시간을 가져보자라는 습관 만들기를 시작했고, 5일을 채우지 못할 때가 있어도 느슨하게 지속해나가고 있다. 매일 사용하는 React와 더 친해져보고 싶다는 생각이 들어 내부 구현에 대한 아티클을 하나 둘씩 찾아 읽어보다가 이미 유명한 Dan abramov의 블로그의 글 A Complete Guide to useEffect에서 useEffect는 lifecycle보다는 data의 동기화 메커니즘으로 바라보아야 한다는 문장에 제대로 꽂혔다. To get productive, you need to “think in effects”, and their mental model is closer to implementing synchronization than to responding to lifecycle events. 그 전까진 useEffect는 대략 lifecycle, dependency에 따라 실행된다라고 뭉뚱그려 알고있던 …

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

들어가며 최근 소속된 개발자 커뮤니티의 네트워킹 행사에서 반복되는 분기처리에 전략패턴 도입하기라는 제목으로 발표를 했다. 주제를 정해 발표 자료를 준비하고 피드백을 요청해 다듬어나간 경험만으로도 즐겁고 알찬 경험이었지만, 글로도 남겨보면 더 오래오래 남을 것 같아 블로그에도 정리해본다. 전략패턴에 관심을 가지게 된 계기 인력 관리 솔루션의 출퇴근 기능을 담당하며 다양한 근태 타입과 사용자 권한에 따른 따른 분기처리가 필요했다. 서비스 특성상 스케줄 등 다른 기능을 개발하는 팀원이 내 코드를 참고할 일도 있을 것이고, 추후 요구사항이 변동될 가능성도 있어(세상엔 내 생각보다 다양한 근태 유형이 존재했다..) 가독성과 유지보수에 대한 고민이 많았다. 머릿속을 스쳐지나간 절망편 시나리오들··· 고민을 이어나가던 도중 개발 커뮤니티에서 보았던 디자인 패턴은 내 코드를 공용어로 만든다는 문장이 떠올랐고, 이를 인사이트 삼아 디자인 패턴을 적용해보자는 생각이 들었다. 디자인 패턴 Desi…

July 15, 2024
React
[번역] HOC Pattern

본 글은 원글 patterns - HOC Pattern을 학습용으로 번역한 것입니다. 고차 컴포넌트 패턴 애플리케이션에서 여러 컴포넌트에 동일한 로직을 사용하고자 할 때가 있습니다. 이 로직에는 컴포넌트에 특정한 스타일링을 적용시키는 것, 권한 요구, 전역 상태룰 추가하는 것 등이 포함될 수 있습니다. 여러 컴포넌트에서 같은 로직을 재사용할 수 있도록 하는 방법 중 하나는 고차 컴포넌트 패턴을 사용하는 것입니다. 이 패턴으로 애플리케이션 전체에서 컴포넌트 로직을 재사용할 수 있습니다. 고차 컴포넌트(HOC)는 또다른 컴포넌트를 전달받는 컴포넌트입니다. 고차 컴포넌트는 매개변수로 전달하는 컴포넌트에 적용시키고자 하는 특정 로직을 포함하고 있습니다. 해당 로직을 적용한 후, 고차 컴포넌트는 추가적인 로직이 포함된 요소를 반환합니다. 애플리케이션에서 여러 컴포넌트에 특정한 스타일링을 추가하고 싶다고 가정해봅시다. 매번 로컬에서 style 객체를 만드는 대신, 전달하는 컴포넌트에 …

March 17, 2024
React