React Hook Form 렌더링 최적화
·
Programming/React
회사에서 개인의 기술 성장을 위하여 3주에 1번씩 사내 기술 세션 발표가 열리는데, 비록 2주차였지만 더욱 몰두하고자 자원하여 발표한 사내 기술 세션 발표 내용입니다.최근에 회사에서 새로운 기능을 개발하면서, 자연스럽게 react-hook-form을 처음 접하게 되었습니다. 처음엔 단순히 폼 상태를 다루기 위한 도구 정도로 생각했지만, 실제로 기능을 만들다 보니 생각보다 많은 개념들이 녹아 있었고, 특히 "렌더링 최적화" 관점에서 매우 중요한 포인트들이 존재한다는 걸 알게 되었습니다. 이 최적화를 진행한 배경이 기능은 고객에게 직접적으로 맞닿는 인터페이스가 아니었기 때문에 백오피스 성능이 상대적으로 중요하지는 않았습니다. 하지만 react-hook-form 라이브러리를 사용하면서 고객의 데이터를 입력한 ..
[AND | RN] 라이브러리 코드 파헤치기: Android 14(SDK34)의 Broadcast Receiver 트러블슈팅
·
Programming/React-Native
약 4년 전에 개발된 React Native 프로젝트 리브랜딩 프로젝트 재오픈을 하면서 배포 이슈에 뒤덮였던 2025년 초..연말 회고, 연초 다짐 이런거 할 겨를이 없었던 것 같다. 프로젝트 2개, 코테에, 버겁지만 항상 개발과 함께했던 겨울을 지나 봄이 왔다. 그저 기능을 구현했다는 걸로 절대 개발자가 될 수 없음을 계속 느끼고 있다. 험난했던 배포 과정iOS 재오픈!교내 커뮤니티 런칭을 앞두고 iOS 배포에서는 앱스토어 심사관과 많은 소통을 했다. 로그인 에러 나는 기기 시뮬레이터 실행해서 영상, 사진도 보내고, 정책이 담긴 파일에 정책 수정도 하고.. 배포에 많은 힘을 들여 결국 오픈하게 되었다. 오픈 후 신규 유입이 몇백명 단위로 나왔는데, 안드로이드 재오픈 이후로 A/B 테스트 결과 내용도 업..
React 프로젝트 의존성 버전 업그레이드 하기 - axios (0.18.0 → 1.7.7)
·
Programming/React
개발 인턴 3개월 차, 4년 전부터 이어오던 프로젝트를 담당하면서 처음 하는 것들이 많았다.이번에 보안 검사를 진행하던 중, axios에서 취약점 점수가 7.5로 나타났고, 그 결과 취약점 개선을 담당하게 되었다. 해당 라이브러리의 버전 업그레이드를 진행하면서 발생한 여러 문제를 해결해야 했고, 이번 기회에 보안 관련 개념을 새롭게 학습할 수 있었다.CVSS (Common Vulnerability Scoring System) 란?- 보안 취약점의 심각도를 정량적으로 측정하고, 0.0~10.0 사이의 점수를 부여하는 시스템 점수 범위 심각도 예시 0.0 없음 (None) 취약점 영향 없음 0.1~3.9 낮음 (Low) 미미한 영향 4.0~6.9 보통 (Medium) 조치 필요하지만 긴..
Kakao 소셜 로그인: Local 환경에서는 되고, S3 + Cloudfront 배포 후는 안되는 문제 해결
·
Programming/React
카카오 로그인 redirect URI 이슈를 3일간 붙잡고 있던 기록을 푼다.. 로컬에서 redirect URI의 경로를 /auth/callback으로 설정했을 때 정상적으로 동작했다. AWS S3와 CloudFront로 배포했을 때 redirect URI를 인식하지 못해 404 에러가 발생했다. 2가지 원인을 추측했다.정적 웹 호스팅으로 S3에 배포했기 때문에 카카오 소셜 로그인을 사용할 수 없다.경로를 인식하지 못한다. 리액트 라우터 문제일 수 있다.CloudFront를 처음 다뤄보았기 때문에 구글링을 엄청 했다. 퇴근 전에 다른 개발자분께 조언을 받아 2 가지 솔루션을 받았다.BrowserRouter 대신 HashRouter를 사용해보라. URL이 복잡해질 수 있지만 이 방법으로 해결한 경험이 있다..