React Folder structure

Jisoo Shin·2023년 12월 28일

Bigc인턴

목록 보기
7/19

Utils 폴더

  • 프로젝트 전체에서 사용 가능한 JS / TS 함수를 저장
  • React 컴포넌트와 상관없이 사용 가능한 함수들
  • EX) 데이터 변환 및 매핑, 날짜 및 시간 관련, 에러 처리

Hooks 폴더

  • 커스텀 React hook을 저장하는데 사용
  • React 기능(상태 관리 등)을 추상화해서 컴포넌트간에 재사용할 수 있는 로직을 만드는데 도움
    - ex) useState, useEffect
  • 해당 폴더에 있는 함수들은 React 컴포넌트 내에서만 사용 가능

Utils & Hooks 구분하는 쉬운 방법

❗️❗️ import {useState, useEffect, useCallback} from 'react'; 유무

  • 해당 import 문이 있으면 hooks 폴더에
  • react 관련 import 문이 없으면 utils 폴더에

참고문헌

  1. Hooks & Utils 폴더

0개의 댓글