✨ 먼저 Hook이란? 함수 컴포넌트에서 React state와 Lifecycle 기능을 연동할 수 있게 해주는 함수 (버전 16.8부터 도입) 만들어진 목적 자체가 함수 컴포넌트에서 사용하기 위함이었으니 당연히 클래스 컴포넌트 안에서는 동작하지 않음 기존에 함수 컴포넌트를 사용하다가 state를 추가하고 싶어서 클래스 컴포넌트로 바꾸곤 했는데 이제 그럴 필요가 없다! ⚙️ Hook의 사용 규칙 1 .최상위에서만 Hook 호출이 가능 (루프, 조건문, 중첩된 함수 안에서는 사용할 수 없음) : 조건문을 Hook 내부에 넣는 것은 괜찮음 👉   컴포넌트가 렌더링 될 때마다 항상 동일한 순서로 Hook이 호출되는 것이 보장되어 state를 올바르게 유지할 수 있음 2️. 리액트 함수 컴포넌트 내에서만 호출이 가능하며, 일반 자바스크립트 함수 안에서는 호출하면 안됨 (custom hook에서는 가능) 🛠 왜 Hook을 만들었을까? 컴포넌트들 사이에서 상태 로직을 재사용하는 것의 어려움 hi…

🤔 React란 무엇인가? 페이스북에서 제공해주는 , 컴포넌트 기반으로 되어 있어서 를 만들어 사용자에게 보여진다. 웹 페이지를 만들기에는 html, css로도 충분하지만 html, css 만으로 동적인 데이터를 UI에 뿌려주기에는 적합하지 않다. 이 때 리액트를 이용한다면 리액트를 사용!! React 공식 홈페이지, 위키백과 - React 🥸 그럼 왜 React를 사용하지? 🛠 Component 단위 작성 컴포넌트는 UI를 구성하는 개별적인 뷰 단위로서, UI를 개발을 레고라고 한다면, 컴포넌트는 블록 역할을 하게 된다. 이러한 블록을 조립해 하나의 완성품을 만드는 것과 같다. 이러한 특징은 하나의 컴포넌트를 여러 부분에서 사용할 수 있게 해준다. 가령, 웹 애플리케이션의 여러 곳에 버튼이 필요하다면, 공통된 하나의 버튼 컴포넌트를 생성하고 그 컴포넌트를 필요한 곳에 가져다 사용하면 된다. 이러한 특징은 하게 한다. 하나의 요소의 변화가 다른 요소들의 변화에 영향을 미치는 복잡…