Search
❤️

하루 계획(50) [2025.1~]

Search
듀오랑고
헬스 1시간
react advanced 11장
simple react 구현하기
.
2025/07/10
듀오링고
윗몸일으키기 50, 스쿼트 50
react advanced 11장
.
2025/07/09
듀오링고
스픽
헬스 1시간
면접 스터디 5시
react advanced 11장
코테 준비
.
2025/06/26
듀오링고
스픽
수영 1시간
코딩테스트 준비
react advanced 10장
면접 스터디 준비
블로그 글쓰기
lang chain 책 읽기
•
문제 상황: heavy component에서 props로 onClick같은 콜백 함수를 넘겨야하고, 그 함수가 state를 참조하는 경우 매번 리렌더링이 일어난다.
•
해결 시도 및 실패: 이를 해결하기 위해 헤비컴포넌트를 React.memo로 메모이제이션하고 props에 useCallback을 사용해도, onClick에서 매 키 스트로크마다 달라지는 input 값을 참조한다면(그리고 dependencies에 명시가 되어있다면) onClick은 재생성되고 결국 memo는 props가 달라졌다고 판단해 헤비컴포넌트를 리렌더링한다.
•
해결 시도 및 실패2: 그래서 이번에는 React.memo에서 comparison 콜백에서 헤비 컴포넌트의 title props가 달라졌을 때만 리렌더링이 되게 시도하지만, 이런 경우 title이 달라지지 않는 이상 onClick props는 이전 버전의 onClick함수를 캡처하고 있어서 만약에 input 값이 달라진다해도 헤비컴포넌트의 onClick 함수에서는 이전 input값을 계속해서 렌더링한다. 그렇다고 onClick을 comparison 로직에 추가한다면 React.memo(HeavyComponent)라는 기본 보일러플레이트 코드와 다를 바가 없다.
.
2025/06/25
듀오링고
헬스 1시간
코딩테스트 강의 듣기
react advanced 10장
lang chain 책 읽기
블로그 글쓰기
.
2025/06/24
듀오링고
수영 1시간
react advanced 9장
코딩 테스트
내일 계획 세우기
.
2025/06/23
듀오링고
스픽
수영 1시간
react advanced 9장
코딩테스트
다음주 계획 세우기
row * col 이중 배열 만들기
•
잘못된 코드
이렇게 작성하면 visited 배열의 각 행이 동일한 참조 배열을 공유하게 되어, 하나를 바꾸면 모든 행의 해당 열도 같이 true로 바뀌는 문제가 발생.
•
예시
.
2025/06/20
듀오링고
헬스 1시간
MVEX 관람
스픽
내일 계획 세우기
.
2025/06/19
듀오링고
스픽
헬스 1시간
react advanced 8장
코딩테스트 강의 - graph
react advanced 8
•
state로 관리하게 되면 해당 상태를 가진 컴포넌트 안의 모든 컴포넌트가 리렌더링 된다.,
•
하지만 context로 분리하게 되면 해당 상태를 필요로 하는 컴포넌트만 리렌더링할 수 있다.,
•
context value change: Context.provider를 관리하는 컴포넌트가 부모 컴포넌트의 리렌더링에 의해 리렌더링된다면 value는 재생성되고 이 context를 사용하는 컴포넌트들은 리렌더링될 것이다.,
•
이럴 때는 context value를 useMemo, useCallback을 사용해서 메모이제이션 해준다.,
•
context value를 쓰는 컴포넌트가 여러 개고, 각 컴포넌트에서 다른 value를 사용한다면 context를 분리해서 context consume하는 컴포넌트들끼리 서로 리렌더링에 영향이 가지 않게 할 것.,
•
useReducer를 사용하면 여러 state를 관리하는 데 도움이 되고 state에 영향을 받지 않으면서(state를 의존하지 않고) state를 업데이트할 수 있다. (ex. toggle),
.
2025/06/18
듀오링고
스픽
내일 계획짜기
react advanced 7장
코딩테스트 강의 듣기 - tree
.
2025/06/17
듀오링고
스픽
react advanced 6장
코딩테스트
내일 계획 세우기
.
2025/06/15
듀오링고
스픽
react advanced 5장
코딩테스트
내일 계획짜기
.
2025/06/11
듀오링고
클라이밍
코딩테스트 풀기 - 스택 문제
기초 공부
운전연수
.
2025/06/05
듀오링고
운전연수
수영
기초 공부
코딩테스트 강의 듣기 - 큐, 스택
내일 계획 짜기
.
2025/06/04
듀오링고
운동 1시간 - 자전거
코딩테스트 강의 듣기
기초 공부
내일 계획 짜기
nextjs (4일 - 이번주 금요일까지)
•
authentication
•
CSP
•
css-in-js
•
ISR
•
lazy loading
.
2025/06/03
코테 준비 - 연결리스트
프론트 기초 공부
듀오링고
수영
내일 계획 짜기
.
2025/06/02
듀오링고
스픽
코딩테스트 강의듣기
피아노 학원
.
2025/05/12
듀오링고
스픽
인아웃 기록
프론트엔드 기본 공부 - 시맨틱 웹
블로그 글쓰기
내일 계획 짜기
.
2025/04/20
듀오링고
스픽
인아웃 기록
집수리 봉사활동
모리 MVP 기능 기획 (이 앱을 왜 써야하는지 + 비즈니스 모델 생각해서)
내일 계획 짜기
이번주 할일
블로그 글쓰기
.
2025/04/19
듀오링고
스픽
인아웃 기록
수영
내일 계획 짜기
이번주 할일
모리 MVP 기능 기획 (이 앱을 왜 써야하는지 + 비즈니스 모델 생각해서)
블로그 글쓰기
.
2025/04/18
듀오링고
스픽
인아웃 기록
내일 계획 짜기
프론트엔드 기본 공부
이번주 할일
모리 MVP 기능 기획 (이 앱을 왜 써야하는지 + 비즈니스 모델 생각해서)
블로그 글쓰기
.
2025/04/17
듀오링고
스픽
수영
인아웃 기록
내일 계획 짜기
이번주 할일
모리 MVP 기능 기획 (이 앱을 왜 써야하는지 + 비즈니스 모델 생각해서)
블로그 글쓰기
.
2025/04/16
듀오링고
스픽
산책
인아웃 기록
내일 계획 짜기
이번주 할일
모리 MVP 기능 기획 (이 앱을 왜 써야하는지 + 비즈니스 모델 생각해서)
블로그 글쓰기
.
2025/04/15
듀오링고
스픽
수영
인아웃 기록
내일 계획 짜기
이번주 할일
모리 MVP 기능 기획 (이 앱을 왜 써야하는지 + 비즈니스 모델 생각해서)
블로그 글쓰기
.
2025/04/14
듀오링고
스픽 수업
나의 커리어를 3문장으로 영어로 소개해보기 (작성 & 암기)
remoteok.com, weworkremotely.com 포지션 스크랩
.
2025/04/09
Load more