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 테스트 결과 내용도 업..
Turborepo와 모노레포
·
Development Tools/Monorepo
최근에 디프만 팀 프로젝트를 시작하면서 플젝 경험이 많으신 개발자분들과 함께 하게 됐다. "신기술 경험"이라는 목표로 기술 스택을 선정했기에 처음 접하는 기술들이 많았다. 본격 기능 구현 전인 세팅 단계라, 모노레포와 Turborepo에 대해 학습하기로 했다. 우리 팀은 모노레포를 도입해야 하는 상황이라고 가정을 하고 사용하는 것이기에 기술에 대한 이해도가 부족했다.이해를 돕기 위해 기업에서 모노레포를 도입하는 칼럼이나 영상을 많이 찾아보았고, 인프콘에서 모노레포, 터보레포 발표 영상을 발견하게 되었다.https://youtu.be/9RSNWt3AU-M?si=chd996mpn_cg94rc 모노레포란?하나의 레포지토리에서 여러 프로젝트를 독립적으로 관리하는 방식이다. 코드 관리와 협업 측면에서 큰 장점을 ..
[백준 | node.js] 14502번: 연구소 BFS, DFS, 백트래킹 풀이
·
Coding Test/BackJoon
백준 14502번 연구소 문제 링크https://www.acmicpc.net/problem/14502문제 정리- 안전 영역 크기의 최댓값을 구하는 문제- 0: 빈 칸, 1: 벽, 2: 바이러스가 있는 곳- 바이러스는 벽 부분을 제외하고 상하좌우 방향으로 바이러스를 전파한다.문제 출력- 안전 영역 크기의 최댓값을 구하여라.문제 접근0. 문제 유형 파악하기바이러스가 벽 부분을 제외하고 전파하는데, 안전 영역이 최댓값이 되려면 바이러스 전파가 최소화되어야 하므로걸리는 BFS 로 풀이한다. (3 ≤ N, M ≤ 8)의 범위가 주어졌기에 시간복잡도는 크게 신경쓰지 않았다. (+ 벽을 세우는 부분은 모든 가능성을 확인해야 하기 때문에 DFS로 풀이한다.) 1. 초기 설정- 상하좌우 방향 벡터를 설정한다.- resu..
[백준 | node.js] 7576번: 토마토 BFS 풀이
·
Coding Test/BackJoon
백준 7576번 토마토 문제 링크https://www.acmicpc.net/problem/7576 문제 정리- 토마토가 모두 익을 때까지의 최소 날짜를 구하는 문제- 1: 익은 토마토, 0: 익지 않은 토마토, -1: 토마토가 들어있지 않은 칸 - 익은 토마토는 상하좌우 방향으로 인접한 토마토를 하루에 하나씩 익게 한다.문제 출력- 저장될 때부터 모든 토마토가 익어있는 상태라면 0 - 토마토가 모두 익지는 못하는 상황이면 -1 - 그 외의 경우 걸리는 최소 일수문제 접근0. 문제 유형 파악하기익은 토마토가 인접한 토마토를 하나씩 익게하고 전체를 모두 익게 하는데 걸리는 최소 일수를 요구했으므로 BFS 로 풀이한다.시작점이 여러 개(=익은 토마토들의 위치)라는 점이 특징이다. 1. 초기 설정- 상하좌우 방..
FE 질문 (2)
·
Technical Interview
1. 클로저에 대해서 설명해주세요.클로저란, 함수가 선언될 때의 스코프를 기억하며, 함수가 생성된 이후에도 그 스코프에 접근할 수 있는 기능을 말한다.(함수가 자신이 생성된 환경을 기억하는 것)자바스크립트의 함수가 일급 객체라는 특성과 렉시컬 스코프의 조합으로 만들어진다.1-1. 클로저는 언제 활용하나요?클로저는 변수와 함수의 접근 범위를 제어하고, 특정 데이터와 상태를 유지하기 위해 사용된다.1) 데이터 은닉 : 외부에서 접근할 수 없는 비공개 변수와 함수를 만들 수 있다. 데이터를 은닉하여 외부 접근을 막고, 데이터 무결성을 유지할 수 있다. 특정 함수 내부에서만 접근 가능한 변수를 생성하고, 조작할 수 있는 함수만 외부로 노출하여 안전하게 데이터를 관리한다.2) 비동기 작업에 활용 : 비동기 작업에..