hmk run dev

현대의 React 개발에서는 훅이 상태와 부수 효과를 관리하는 강력한 도구로 자리 잡았습니다. 훅을 사용하면 컴포넌트 로직을 재사용 가능한 함수로 추출할 수 있어 코드가 모듈화되고 유지보수가 쉬워집니다. 이번 포스트에서는 useModal이라는 커스텀 훅을 사용하여 React 컴포넌트를 어떻게 개선했는지에 대한 실제 사례를 소개합니다.  기존 접근 방식 useModal을 도입하기 전에는 컴포넌트 내에서 모달 로직을 직접 처리했습니다. 이 방식은 반복적인 코드가 많아지고, 애플리케이션의 여러 부분에서 모달 상태를 관리하기 어려워지는 문제가 있었습니다. 다음은 모달 로직이 어떻게 처리되었을지에 대한 간단한 예입니다:// ... 기존 코드 ...const [isModalOpen, setIsModalOpen] =..

프론트엔드 개발자가 C++를 알면 여러 측면에서 이점을 가질 수 있습니다. C++는 성능과 시스템 수준의 프로그래밍에 강점을 가지고 있어, 프론트엔드 개발에 직접적으로 사용되지는 않지만 다음과 같은 간접적인 이점이 있습니다:C++를 자바스크립트와 비교하여 기초부터 배우고 싶다면, 두 언어의 주요 차이점과 개념을 중심으로 설명해 보겠습니다. C++는 컴파일러 언어이고, 자바스크립트는 인터프리터 언어라는 근본적인 차이가 있으며, 이에 따라 메모리 관리, 데이터 타입, 흐름 제어 등 다양한 측면에서 차이가 있습니다. 성능 최적화에 대한 깊은 이해: C++는 메모리 관리와 성능 최적화에 매우 민감한 언어입니다. 이를 통해 자바스크립트 엔진의 동작 원리나 브라우저 내부의 성능 최적화 과정에 대한 더 깊은 이해를 ..

로그는 에러 뿐만아니라 비즈니스 결정을 위한 중요한 요소가 된다.     이처럼 많은 로그를 자동화하기 위해서 많은 중복 코드가 발생할 수 밖에 없다.  토스는 자체 디자인 시스템인 TDS를 이용해 로깅을 자동화했다.  첫번째 시도 - 디자인시스템에 로그 기능을 추가하자개발 비용도 적고 기존에 사용하던 곳에도 적용하기 쉬웠음 그러나, 계열사 별로 로그 코드가 많고 형태가 달라 통합하기 쉽지않음그리고 로깅관련 코드가 함께 배포되는 이슈가 있었음  TDS가 로깅관련 코드를 포함해 로깅관련 수정사항을 반영하면 모든 컴포넌트의 디자인 사양도 변경해야하는 문제도 발생했다.   두번째 시도 -  HOC 형태로 로그 감싸기  TDS 컴포넌트를 감싸 제공하는 형태로 제공,서로 독집적으로 수정하고 배포가 가능해졌다. ..