# hooks

aptakqmf12

그저 input의 .focus()기능을 사용하기위해 쓰던 useRef에 대해 깊게 공부해보자인자로 넘어온 초기값을 .current 프로퍼티에 저장한다따라서 .current안의 값이 바뀌어도 useRef자체가 바뀌는게 아니라서 재랜더링이 일어나지 않는다.useRef안에

kim98111

React Hooks 사용시 지켜야 할 규칙

jujusnake

useEffect

tmdals3785

"SWR"이라는 이름은 HTTP RFC 5861에 의해 알려진 HTTP 캐시 무효 전력인 stale-while-revalidate에서 유래되었습니다. SWR은 먼저 캐시로부터 데이터를 반환한 후, fetch 요청(재검증)을 하고, 최종적으로 최신화된 데이터를 가져오는

jujusnake

useState

sosoyim

🚩 글의 주제 : 타입스크립트를 이용하여 기본적인 리액트 훅을 사용하는 방법 알아보기❓ 리액트도 아직 제대로 다뤄본 적이 없는데 생전 초면인 TS 까지 하려니 프로젝트 진행시 막히는 부분이 많은 것 같았다. 잠시 프로젝트를 내려놓고 TS를 이용해 Hooks를 하나하

hongdol

React Hooks useState useEffect useReduce useRef useCallback useMemo

seokkitdo

리액트의 컴포넌트에서는 동적인 값을 상태(state)라고 부릅니다. 리액트에서는 리렌더링을 위한 조건으로 여러 가지가 있는데 그 중 하나가 상태값 변경입니다. 리액트에서는 useState라는 훅을 통해 컴포넌트에서 상태를 관리할 수 있습니다.const count, se

tank3a

setState() const food = ["tomato", "banana"]; const [name1, name2] = food; => const name1 = "tomato"; const name2 = "banana"; JSX에선 for, class 등

leedocs

: Higher Order Component ( 고차 컴포넌트 )HOC = function(컴포넌트) { return 새로운 컴포넌트;}컴포넌트를 받아 새로운 컴포넌트를 리턴하는 함수 이다.withRouter(컴포넌트) -> router에 의해 호출되지 않아도 matc

kbstar

TIL 두 걸음굉장히 친숙하면서도 어딘가 낯선 State..코딩에선 과연 이녀석은 어떤 녀석일까 문득 궁금해졌다.알아보기에 앞서, 어제 했던 CSS-IN-JS 실습을 하면서 왜 React를 쓰는지 의문이였던 녀석을 좀 더 자세히 복습 겸 학습을 하려고 한다.1.Reac

junejae_1625

함수형 컴포넌트가 클래스형 컴포넌트보다 훨씬 간단하다는건 저번 글을 통해 알수 있다. 하지만, 함수형 컴포넌트 그 자체만으로는 클래스형 컴포넌트의 모든 기능을 흉내낼 수 없다.그래서 React에서 함수형 컴포넌트에서도 클래스형 컴포넌트와 동일한 기능을 사용 가능하도록

jkl1545

컴포넌트가 보여줘야할 내용이 사용자의 상호작용에 따라 동적으로 값이 바뀌어야 할 때 사용할 수 있는 React Hooks 중 하나이다.useState는 배열을 리턴하는데 첫 번째 인자는 state의 초깃값이고, 두 번째 인자는 값을 갱신할 수 있는 함수이다.useSta

sunky97

react-useContext useContext 란? > context 객체(React.createContext에서 반환된 값)을 받아 그 context의 현재 값을 반환합니다. · · · useContext 를 설명하기에 앞서 React 의 Context 객체

angel_eugnen

먼저 axios 를 AddDependenct 해준다. 이것은 npm을 설치하는것과 같다,이렇게 정보를 받는다.refetching 하는 방법useEffect를 다시 하게 만들어서 refetching(다시 가져오기)를 해보는 것이다.어떻게 useEffect를 실행해 볼까

angel_eugnen

알람이 실행되는 것을 만들어 볼 것이다.이런것 처럼!!notification을 추가한다notification API를 사용하고 갖는 것옵션이 다양하게 있다..사람들이 title과 option을 전해 줄 것이다.그러면 우리는 확인해야 한다.Notification 사용 법

uomnf97_web

내용 : use state, use effect에 관해 배우고, hooks library build를 할 것. 이론, 예제, 실전 실습으로 이루어진 강의npm : 여러가지 npm package를 등록해두는 곳으로 use-input, use-interval등 여러 패키지

angel_eugnen

때때로 유저가 지나쳤을 때 색상을 바꾸거나 한다.scroll을 감지할 수 있다.버튼 두개를 만들어서 fullscreen으로 만들어 줄 것이다.다시 크기를 되돌려보자이론을 가지고 해볼 수 있다usecallBack을 가지고..fullscreen이 되면 reiggerFull

angel_eugnen

기본적으로 하나의 element를 가지는데, 자동으로 서서히 나타나게 할 것이다.먼저 hello 가 나오고 서서히 bye가 나올 것이다. hook을 더 크게 만들고 싶다면timing, opacity 같은 것들은 property를 설정해주면 되겠지..navitor가 on

angel_eugnen

기본적으로 탭을 닫을 때 실행되는 function이다.활용도는 다양하다마우스가 페이지를 벗어났을 때 console 에 알림을 줘볼까?이것이 useBeforeLeave였다///