# custom hook

74개의 포스트
post-thumbnail

React useOvelay, 선언적인 코드 작성하기

선언적인 코드?

2023년 5월 31일
·
0개의 댓글
·
post-thumbnail

데이터 가져오기 전까지 로딩 띄우는 useLoading 커스텀 훅 만들기 (TypeScript)

데이터를 가져올 때 로딩을 띄우고 싶다면 React Hook의 useState를 활용해서 사용할 수 있다. 로딩 상태값을 만들어서 데이터를 가져오기전까지 로딩을 띄우고, 다 가져왔으면 로딩을 없애주는 로직을 useState 훅을 사용하여 많이 사용해 왔을 것이다.

2023년 5월 21일
·
0개의 댓글
·
post-thumbnail

인증 로직 주입은 어디서 해야할까?(feat.횡단관심사분리)

인증이 필요한 특정 핸들러에 어떻게 인증로직을 주입해줄 수 있을까? react-hook-form 라이브러리를 뜯어보며 알아보자!

2023년 5월 20일
·
0개의 댓글
·
post-thumbnail

(SEB_FE) Section4 Unit3 React Hooks

함수 컴포넌트와 클래스 컴포넌트의 차이를 학습하고, 함수 컴포넌트에서 Hook을 사용하는 이유를 이해합니다.Hook의 사용 규칙에 대해 학습하고 이해합니다.useMemo의 쓰임새와 작성 방법에 대해 학습합니다.useCallback의 쓰임새와 작성 방법에 대해 학습합니다

2023년 5월 19일
·
0개의 댓글
·
post-thumbnail

[36] React - Custom Hook

기존 Hook을 조합해 새로운 동작을 정의하는 Custom Hook

2023년 5월 18일
·
0개의 댓글
·

Custom hook

Custom hook은 React에서 사용되는 함수이다. React의 기본 훅인 useState, useEffect, useContext 등과 마찬가지로, Custom hook은 use라는 접두사로 시작해야한다. 이는 React가 이 함수가 훅으로 사용되는 것을 인식할

2023년 5월 16일
·
0개의 댓글
·

Custom hook

커스텀훅이란?로직을 재사용하기 위한 방법 중 하나. useState, useEffect 등 리액트 내장 훅을 사용하여 공통된 로직이나 기능을 별도로 분리한 훅.기능은 동일하게 작동하되 중복 코드가 사라지고 전체적인 코드량 감소.파일의 이름 앞에 반드시 use라는 키워드

2023년 5월 14일
·
0개의 댓글
·
post-thumbnail

Pagination Custom Hook 구현

모행은 여행지 정보와 코스에 대한 정보를 주는 정보성 짙은 여행 플랫폼이었기에 페이지네이션이 사용되는 부분이 많았습니다. 해당 페이지네이션을 커스텀 훅으로 구현해 쓸 수 있다면 편리할 것 같아 직접 커스텀 훅으로 구현해보고자 했습니다.모행은 여행지 정보와 코스에 대한

2023년 5월 3일
·
0개의 댓글
·
post-thumbnail

미사일마켓 :: 폴더 구조 선정

기존의 개인 포트폴리오를 리팩토링하려고 했으나전체적인 UI도 변경하기위해 새로 만들기로 하였다.중고 마켓과 자유게시판이 함께 있는 중고 마켓 커뮤니티를 만드려고 한다.자유게시판 관련 파일은 container/presentational 패턴을 사용하고,중고 마켓 관련 파

2023년 5월 1일
·
0개의 댓글
·

디바운싱을 실무에 적용하다

디바운싱을 적용한 경험을 공유합니다.

2023년 4월 23일
·
0개의 댓글
·
post-thumbnail

[React]-Custom Hook을 만들어보자!!

Hook도 재사용 해보자고!!

2023년 4월 13일
·
0개의 댓글
·
post-thumbnail

한 주의 정리 - WIL

이번주(2월 20일 ~ 2월 26일)은 리액트 심화부터 백엔드와 프론트가 만나 처음 서로의 언어로 토이 프로잭트를 만드는 날이었다.1\. 리덕스 청크는 리덕스에서 많이 사용하고 있는 미들웨어중에 하나이다. thunk를 사용하면 dispatch를 할때 객체가 아닌 함수

2023년 2월 26일
·
0개의 댓글
·
post-thumbnail

리액트 - Custom hook

2월 26일 여정 49일차이다.오늘은 Custom hook이라는 것에 대해 간단하게 기록하려고 한다.Custom hook이라는 것은 무엇일까?먼저 간단한 아래의 예제 코드를 보자.위의 코드를 보면은 input의 개수가 증가하면 useState와 이벤트핸들러도 같이 증가

2023년 2월 26일
·
0개의 댓글
·
post-thumbnail

[프로솔브 리팩터링] Custom Hook을 이용해 컴포넌트의 UI와 비즈니스 로직 분리

프로솔브를 리팩터링하면서 Custom Hook을 이용해 UI와 비즈니스 로직들을 분리한 경험에 대해 다룹니다.

2023년 2월 23일
·
0개의 댓글
·

TIL.23.02.20. - useInput

useInput을 사람 흉내라도 내면서 작성한 코드입니다.

2023년 2월 20일
·
0개의 댓글
·
post-thumbnail

React Query Custom hook으로 사용하기

useQuery, useMutation을 Custom hook으로 만들어서 사용하기

2023년 2월 17일
·
0개의 댓글
·
post-thumbnail

antd로 화면 만들기-_app.js와 Head, 로그인 폼, 리렌더링 이해하기, 프로필 페이지와 회원가입 페이지 만들기(custom hook)

ant design ( css framework )아이콘을 바로 가져다 쓸 수 있음보통 고객이 있는 서비스에서는 잘 안씀 → why? 개성이 사라짐 (admin 느낌)혼자 개발하는 경우 → 디자이너 없이도 그럴듯하게 디자인 가능css 입히기styled-component

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

React Query 공부 (6) custom-hook

작은 앱이라면 상관없지만 큰 앱을 만들 때는 custom-hook을 사용해보자

2023년 1월 30일
·
0개의 댓글
·
post-thumbnail

[React] 로그인/회원가입 리팩토링

현재 로그인 / 회원가입 페이지의 경우 <User /> 라는 컴포넌트 하나로 관리되고 있고라우팅에 따라 다른 화면이 나타나도록 구현되어 있었다.그리고 크게 3개의 기능으로 이루어져 있는데인풋값 핸들링유효성 검사 서버와의 통신이다. 위의 기능을 포함한채 <Us

2023년 1월 26일
·
0개의 댓글
·