전체 글

✨  TEOConf2024 스피커로 참여하게 된 이유 지난 feconf에서는 처음 사회에 나온 주니어 개발자들에게 어떤 마인드 셋으로 임해야 하는지, 이상적인 개발 환경이 아닌 곳에서 어려움을 헤쳐 나가고 있는 개발자들에게 자신감을 심어주기 위해 라이트닝 스피커로 참여한 경험이 있었다.  이번에는 1년 동안 개발을 진행하면서, 프론트엔드 개발자가 어려워지는 순간은 프론트엔드가 서버에 의존적으로 되어서 수정작업을 빠르게 할 수 없는 것이 문제라고 생각했다.  이를 해결하기 위해 함께 고민하고, 도전해 봤던 기술적인 경험과 인사이트를 다른 개발자분들과 공유하고 싶어, 해피라는 이름으로 '어댑터 아키텍처를 통해 클라이언트 환경 개선하기'라는 주제를 가지고 TEOConf 2024의 스피커로 참여하게 되었다.  ..

Suspense와 ErrorBoundary에 대해 알아보자React에서 비동기 로딩과 에러 핸들링을 위해 Suspense와 ErrorBoundary는 각각 중요한 역할을 하는 것은 모두가 알고 있는 내용이다.이 글에서는 두 컴포넌트의 개념을 직접 구현해보는 과정을 통해 내부 구조를 이해하며, 최종적으로 두 컴포넌트의 차이점과 활용 방안을 정리해보고자 한다.✨  들어가기Suspense와 ErrorBoundary는 React에서 각각 비동기 작업의 로딩 상태와 컴포넌트 트리에서 발생하는 오류를 관리하는 데 사용되는 컴포넌트이다.Suspense: 비동기 로딩 상태를 처리하기 위해 사용되며, 주로 React.lazy와 함께 활용한다. 즉, Suspense는 컴포넌트를 렌더링하기 전에 로딩 중인 컴포넌트 대신 로..

중고나라 셀러 지원 센터의 다양한 부분을 개발하면서, 특히 interceptor를 활용해 인증/인가 기능을 구현한 배경과 마주했던 문제와 느낀 점을 전달하고자 이 글을 쓰게 되었다. ✨ 셀러 지원 센터에서의 인증/인가 구조셀러 지원 센터에서 인증/인가 구조는 셀러와 관리자가 분리되었다. 두 사용자 그룹에 따라 각각 다른 접근 방식이 필요했다. 셀러 회원셀러는 중고나라 웹사이트 회원가입 절차를 거쳐 셀러 지원 센터의 회원가입 절차를 진행할 수 있다. 그러나 회원 계정의 상태가 블랙이거나 이미 회원가입이 완료된 상태라면 회원가입이 제한되는 흐름이었다.정상적으로 회원가입 화면에 진입했을 경우, 셀러는 아이디와 비밀번호를 입력하고 마케팅 수신 동의 항목을 거쳐 가입이 진행된다. 이 때, 중복되는 아이디는 사용 ..