<Yeonny0723/> <Yeonny0723/>

🍋 배경 아래 이미지와 같이 콘텐츠를 동적으로 바꿀 수 있고 & 보여주는 시점으로부터 3초 후 언마운트되는 스낵바를 개발하였다. 모든 스낵바 컴포넌트에 마운트 된 3초 후 언마운트되는 로직을 적용하는 것과 같이, 특정 컴포넌트에 반복적으로 적용할 로직이 있는 경우, 그 코드를 응집화 시킬 수 있는 방안에 대해 고민해보았다. 🍋 결과물 🍋 수정 전 다음은 스낵바 컴포넌트를 생성하고 사용하는 구문이다. content prop으로 내부 콘텐츠를 동적으로 받아올 수 있으며, 스낵바를 보여주고 싶을 때 Main 구문 내 activateSnackbar 함수를 호출하여, 그 시점으로부터 3초가 지난 시점에 스낵바가 자동으로 unmount 된다. // 스낵바 컴포넌트 선언 function Snackbar({conten..

🍋 서론 리액트를 잘 사용하는 단계는 거쳤고, 당연한 것들에 왜?라는 질문들 마구 던지는 요즈음, 리액트가 리렌더링 되는 시점, 즉 상태값과 프롭이 업데이트되는 시점에 어떠한 일들이 일어나는지 궁금해졌다. 흩어져있던 컨텍스트-클로져-리액트 퍼즐을 맞출 수 있는 시간이었다. 🍋 사전 지식 클로져란 무엇인가? 내가 생각하기에는 어떠한 모먼트이다. 렉시컬 스코프 밖에서 렉시컬 스코프 내부를 기억하고 접근할 수 있는. 이 말에 대한 설명이 와닿지 않다면 아래 🍋 전역 컨텍스트 & 함수 컨텍스트 부분부터 읽어보길 추천한다. 🍋 useState 훅이 어떻게 생겼는가 아래는 바로 사용은 익숙하지만, 어떻게 생겼는지는 생소한 useState 훅의 생김새이다. (코드참고링크) const React = (() => { l..