# CustomHook

11개의 포스트
post-thumbnail

타입 스크립트에서 useEffect 안에서 API 통신하는 useAsync 커스텀 훅 만들기

평소 데이터 페치를 하면서 보통은 컴포넌트 내에서 함수를 만들어 개발을 하였다. 그런데 컴포넌트의 양이 많아지고 서버 개발을 하는 분이 종종 간단한 수정이 있으면 Axios를 볼 때가 있어서 함께 개발하는 하는데 피로감이 있어보였다. 나의 목표는 페이지가 떴을때 위의

2022년 5월 8일
·
0개의 댓글
post-thumbnail

React - useDidMount custom hook

useDidMount hook 생성하기React의 class형 컴포넌트에서는 componentDidMount라는 메서드가 존재한다.리액트 16.8버전 이후 hook이 도입되었지만 componentDidMount와 그나마 유사한 hook은 useEffect가 유일하다.내

2022년 4월 2일
·
0개의 댓글
post-thumbnail

useState 에 두번째 인자로callback 사용하기

클래스안에서는 this.setState에 두번째 인자가 들어가면 이미 첫번째인자에서 업데이트한 state를 두번째 인자에서 받아서 사용가능하다.그러나 useState에서 setState는 그 기능이 제공되지 않고 있다. 애초에 첫번째 인자만 받아들 일 수 있다.그러나

2022년 3월 4일
·
0개의 댓글

🌝 TIL 2016

[Destructuring] [customHook] [refetch efficiency] [.replace()]

2022년 2월 17일
·
0개의 댓글

custom hook with useNavigation

custom hook with useNavigation

2022년 2월 10일
·
0개의 댓글
post-thumbnail

[React] Hooks

함수 컴포넌트에서 React state와 생명주기 기능(lifecycle features)을 "연동(hook into)" 할 수 있게 해주는 함수이다.class 컴포넌트 안에서는 동작하지 않으며, useState, useEffect 등 내장 Hook을 제공한다.(Hoo

2021년 10월 23일
·
0개의 댓글
post-thumbnail

[React] 커스텀 Hooks 생성 후 TypeScript 타입 지정하기

사용자의 입력값을 받는 Hooks 생성하고 타입 지정하는 방법 🤗

2021년 9월 13일
·
0개의 댓글

모달창 만들기

클릭시 모달창이 나오는 기능을 구현하던중 재사용이 만을듯하여 커스텀훅으로 만들기로 하였다. 생각해야할 이슈는 모달바깥쪽을 클릭했을때 모달이 사라져야한다. 모달이 생겼을때 스크롤을 없애야한다. 1. html구조 파악하기 컴포넌트로 모달을 만들어 재사용할것이기 때문에

2021년 6월 15일
·
0개의 댓글
post-thumbnail

clickOutside close 구현하기

기본토글버튼에서 바깥을 클릭했을때 close되면서 해당 target을 클릭했을때는 open을 유지하는 기능을 재사용가능한 hook으로 구현해보았다.아이콘은 font-awesome에서 사용하였으며, css는 다른파일의 styled-components로 구성하였다.'클릭

2021년 3월 19일
·
0개의 댓글

[프로젝트 회고] React/ Django SPA Website: #2. Custom Hook / Context API

나의 프로젝트를 어디서나 defense 할 수 있을 때까지!

2021년 1월 8일
·
0개의 댓글

Custom Hooks 만들기

로그인이나 회원가입 기능을 구현할 때, input tag 를 많이 사용하게 될 것이다. input tag의 상태값을 받기위해서 value 값과 onChange 함수를 구현해주어야 하는데, input 이 많아 지면 Component 에서 작성해야 하는 함수가 많아진다.

2021년 1월 7일
·
0개의 댓글