Loading...
2023. 1. 12. 01:39

리액트 기본 배우기 -훅에 대해서-

1. 훅이란 무엇인가 클래스 컴포넌트에서는 생성자 constructor에서 state를 정의하고 setState() 함수를 통해 state를 업데이트한다. 이처럼 클래스 컴포넌트는 state와 관련된 기능뿐만 아니라 컴포넌트의 생명주기 함수들까지 모두 명확하게 정의되어 있어서 잘 가져다 쓰기만 하면 된다 하지만 함수 컴포넌트는 클래스 컴포넌트와는 다르게 코드도 굉장히 간결하며, 별도로 state를 정의해서 사용하거나, 컴포넌트의 생명주기에 맞춰 어떤 코드가 실행되도록 할 수 없었다 그래서 함수 컴포넌트에 이런 기능을 지원하기 위해 만든것이 훅이다. 훅을 사용해서 함수 컴포넌트도 클래스 컴포넌트의 기능을 모두 동일하게 구현할 수 있게 된다. Hook이라는 영단어는 갈고리라는 뜻을 갖는다. 프로그래밍에서는 ..

2023. 1. 12. 01:20

리액트 기본 배우기 -state에 대하여-

1. state란 무엇인가 리액트에서 state는 리액트 컴포넌트의 상태 상태라는 단어가 정상이냐, 비정상이냐를 나타내는 것보다는 리액트 컴포넌트의 데이터라는 의미에 더 가깝다. 리액트 컴포넌트의 변경 가능한 데이터를 state라고 부른다. state는 사전에 미리 정해진 것이 아니라, 리액트 컴포넌트를 개발하는 개발자가 직접 정하는 것이다. state를 정의할 때 중요한 점은 렌더링이나 데이터 흐름에 사용되는 값만 state에 포함시켜야 한다는 점이다. state가 변경될 경우 컴포넌트가 재렌더링되기 때문에, 렌더링과 데이터 흐름에 관련 없는 값을 포함시키면, 컴포넌트가 다시 렌더링되어 성능을 저하 시킬 수 있다. 그래서 렌더링과 데이터 흐름에 관련 있는 값만 state에 포함하도록 해야하며, 그렇지 ..