목록전체 글 (115)
all is well!!
👀 목표1.원시타입과 참조타입의 개념을 이해하기2.리액트에서 어떤식으로 값과 참조가 쓰이는지 이해하기3.배열 메소드를 적재적소에 잘 사용하기 👀 얕은 비교로 살펴보는 다양한 값 비교🟣 리액트에서의 얕은 비교얕은 비교는 객체의 참조주소만 똑같은지 비교한다.리액트에서 얕은 비교를 사용하는 이유는 상태가 변할때 페이지가 렌더링 되면 다른 상태값들이 일치하는지 체크하는데깊은 비교를 사용하면 안쪽의 depth까지 똑같은지 둘러보고 오기때문에 연산비용이 더 많이든다.그래서 빠르게 처리하기 위해서 리액트에서 렌더링할때 얕은 비교를 사용해서 state의 참조값이 다르면값이 바뀌었구나! 인지하고 재 렌더링 하게된다. 그래서 useState에 값을 변경할때 불변성을 지켜주기 위해 ...을 쓰거나 a.con..

👀 목표1. 컴포넌트가 언제 리렌더링 되는지 살펴보기2. 다양한 훅을 이해하고 사용하기 👀 React의 렌더링 라이프 사이클🟣 1. Trigger단어 그대로 렌더링을 시작하게끔 방아쇠를 당기는 과정. 언제 Trigger가 발동되나요?1. 첫번째 렌더링이 수행될때a. ReactDOM.createRoot(..).render()2. 컴포넌트의 state가 변경될 때a. 클래스 컴포넌트의 setState 메서드b. useState, useReducer등 상태변경 훅의 setter 함수 호출. 1. 렌더링 Batch 처리Trigger 과정에서 여러가지 작업을 한번에 묶어서 수행하는 Batch 기법을 사용한다.function Component() { const [count, setCount] = u..
지난 챕터를 돌아보며챕터1을 한 문장으로 : 난 아직 JS를 잘 몰랐구나!챕터1에서 가장 기뻤던 순간 : 첫번째 과제 후 멘토님의 리뷰를 확인했을때 부족한 점을 알게되어서 좋았다.챕터1에서 기억에 남는 트러블슈팅 : diff 흐름이 이해가 잘 안가서 시간이 오래걸렸음다음 챕터 시작을 앞두고,챕터1에서 가장 기억에 남는 성취 : 그래도 공부하기 전보다 리액트의 내부구조를 큰 흐름은 이해를 했다.다음 챕터에서 반드시 달성하고 싶은 목표 : 꼭 이해하고 넘어가자. 꼭 블로그 정리도 하자.
### 1. 문제 **(과제, 프로젝트를 진행하면서 부딪혔던 기술적인 문제)** 이번 주차를 지나며 겪었던 문제가 무엇이었나요?처음 알게된 데이터 타입들로 비교하고 응용해서 forEach, map 등등의 메소드를 직접 구현하는게 어려웠습니다. ### **2. 시도** 문제를 해결하기 위해 어떤 시도를 하셨나요?chat gpt, 구글링, 먼저 pr하신분들의 코드를 보면서 왜 이런 코드를 작성해야하는지 이해하려고 노력했습니다. ### **3. 해결** 문제를 어떻게 해결하셨나요?pr 코드들을 보면서 고민해보고 생각해낸 추측을 chat gpt와 대화하면서맞는 추측한 내용으로 과제에 적용했습니다. ### **4. 알게된 것** 문제를 해결하기 위해 시도하며 새롭게 알게된 것은 무엇인가요?1.얕은 비교는 참조주소..
### 1. 문제 **(과제, 프로젝트를 진행하면서 부딪혔던 기술적인 문제)** 이번 주차를 지나며 겪었던 문제가 무엇이었나요?react에서 여러가지 메모이제이션 훅의 적절한 사용이 어려웠습니다. ### **2. 시도** 문제를 해결하기 위해 어떤 시도를 하셨나요?관련 강의와 chat gpt와 구글링을 하면서 언제, 왜 사용해야 하는지학습했습니다. ### **3. 해결** 문제를 어떻게 해결하셨나요?관련 강의를 통해 렌더링과 관련해서 고민해보고 생각해낸 추측을 chat gpt와 대화하면서맞는 추측한 내용을 다져가면서 정리해서 과제에 적용했습니다. ### **4. 알게된 것** 문제를 해결하기 위해 시도하며 새롭게 알게된 것은 무엇인가요?1.함수는 실행될때마다 새로운 실행컨텍스트가 생성되기 때문에그 안의 ..