# React Hooks

React Hooks: 기초부터 심화까지
React Hook은 React 16.8 버전에서 새롭게 도입된 기능으로, 클래스 컴포넌트에서만 사용 가능했던 state와 lifecycle 메소드를 함수형 컴포넌트에서도 사용할 수 있게 해준다. 이번 포스팅에서는 React Hook의 기초적인 사용 방법부터, 실제 예

TIL 0314
[목차] React를 배워야 하는 이유 React Component 클래스형 컴포넌트 vs 함수형 컴포넌트 React-Hooks State useState state를 변수로 사용하는 이유 서버컴퓨터로 전송하기 위해 state에 담아두기 작성한 내용을

React Hooks - useRef
React 16.8 버전에서 새로 추가된 React Hooks 기능중 useRef에 대해 알아보도록 하자. 언제 사용할까? 어떻게 사용할까? useRef를 자세히 보면 모든 유형의 값 또는 null 넣을 수 있고, RefObject를 반환해주는걸 볼 수 있다.

React Hooks - vanilla JavaScript로 구현하기
Hook은 React 16.8부터 도입된 기능으로, React를 배우거나 사용해 본 사람이라면 누구나 써봤고, 또 많이 쓰고 있을 기능일 텐데, 이 Hook은 대체 어떤 원리로 동작하는 걸까? 어떻게 컴포넌트가 계속 리렌더링되고 변경되는 것과 무관하게 상태를 관리할까?

[React] React Hooks
Hook은 함수 컴포넌트에서 사용하는 메소드입니다. 함수 컴포넌트 이전에는 클래스(class) 컴포넌트가 있었습니다. 많은 React 개발자들이 이 클래스 컴포넌트를 사용하여 React 앱을 개발해왔습니다. React의 클래스 컴포넌트는 조금 생소한 개념일 수 있습니다

React Hooks 총 정리 -2
이 포스트는 전에 올렸던 React Hooks의 종류 및 개념에 대한 총 정리를 이어서 작성하는 글 입니다.useState를 대체할 수 있는 함수이다.state보다 복잡한 상태관리가 필요한 경우 reducer를 사용할 수 있다.reducer는 이전 상태와 Action을

React Hooks 총 정리 -1
오늘 면접을 보고왔는데, 기술면접을 보던 중 React Hooks에 대한 질문을 받았는데, 대답을 제대로 하지 못한 부분이 있어서 이를 회고할 겸 모든 React Hooks에 대해 총 정리를 해보려고 한다.Hook은 함수형 컴포넌트가 클래스형 컴포넌트의 기능을 사용할

[React] React Hooks에 대하여(작성중)
React는 v16.8부터 컴포넌트 상태와 컴포넌트 생명주기를 관리할 수 있는 API인 Hook을 제공한다. Hook을 사용하면 함수 컴포넌트도 클래스 컴포넌트처럼 컴포넌트 내부에 상태를 저장할 수 있고 컴포넌트 생명주기에 관여할 수 있다.
# React Hooks
시작 전 참고 영상 React Hooks가 무엇인가? https://www.youtube.com/watch?v=yS-BU6eYUDE React Hooks 사용 예시 https://www.youtube.com/watch?v=sZDvByH2mNU 📌 React Hook
useState
컴포넌트내 상태값을 관리하기 위한 Hook컴포넌트의 상태컴포넌트내에서 사용할 변수conststate, setState=useState('초기값');상태값 변경시 리턴받은 함수로 상태값 변경set함수를 이용하여 상태값을 변경하면 화면이 재 렌더링된다.
[Today I Learned] 12월 2주차 day6
함수형 컴포넌트에서 react state와 생명주기 기능을 연동 할 수 있게 해주는 것이다.이전 글에서 다뤘던 class component와는 다르게 hook을 사용한다.hook 은 클래스(class)안에서는 동작하지 않으며, class 없이 react를 사용할 수 있
Unit4 회고
[React]심화 🔆 Virtual DOM Virtual DOM > Virtual DOM이 나오게 된 배경🤔 실제 DOM은 스크립팅 언어가 접근 및 탐색하는 속도가 빨라 탐색 후 변경 및 업데이트하는 속도는 역시 빠르다. 하지만 JavaScript로 조작하는 DOM

React 심화
DOM은 Document Object Model의 약자로, 뜻을 그대로 풀자면 문서 객체 모델을 의미DOM은 브라우저가 트리 구조로 만든 객체 모델트리는 “데이터 저장"의 의미보다는 “저장된 데이터를 더 효과적으로 탐색”하기 위해 사용되므로, 빠른 자료 탐색 성능이 장

React LifeCycle과 React Hooks
이번 글에서는 React와 React Router의 Built-in Hooks에 대해서 파헤쳐 보겠습니다.이 과정에서 나만의 Custom Hook을 제작하는 방법과 이제는 굳이 암기할 필요가 없어진 React LifeCycle에 대해서도 알아보게 될 예정입니다.