Tech Stack

🛠 기술 스택 및 라이브러리

사용 기술 및 라이브러리	버전	적용 사항	선정 이유
axios	0.27.2	Promise 기반 HTTP 클라이언트	* Promise 기반으로 만들어졌기 때문에 데이터 처리가 용이 * 크로스 브라우징 최적화로 높은 브라우저 호환성
react-intersection-observer	9.4.0	무한 스크롤	* 다양한 레퍼런스 참고 가능
react-query	3	서버 페칭 상태 관리	* 서버 상태 업데이트 용이 * 동기적으로 서버 상태 관리가 가능 * 로딩 성능 최적화
reduxjs/toolkit	1.8.6	전역 상태 관리	* 전역으로 관리해야 할 데이터가 많아 안정적인 dev-tool이 필요 * 디버깅이 용이
react-router-dom	1.8.6	라우팅	* 리액트 환경에서 동작할 수 있는 여러 종류의 라우터 컴포넌트 사용 가능
react-slick	0.29.0	carousel	* 커스터마이징이 용이 * 프로젝트 스코프를 고려해 빠른 시간 내에 구현할 수 있는 라이브러리 선정
react-spinners	0.13.4	전역 로딩 처리기	* 쿼리 로딩과 페칭 상태일 때, 유저에게 알맞은 UI를 제공하기 위함
styled-components	5.3.5	스타일 라이브러리	* 전역으로 관리하는 elements와 components가 많아 props 별 조건부 스타일링을 하기 위함
typescript	4.4.2	정적 타입 명시	* 코드에 목적을 명시하고 목적에 맞지 않는 타입의 변수나 함수들에서 에러를 발생시켜 버그를 사전에 제거
mui	5.10.2	아이콘 / pagination UI / tooltip	* 디자이너 부재 * 전역으로 통일된 디자인 UI가 필요
react-hook-form	7.37.0	동적 폼 구성	* 비제어 컴포넌트 방식 구현으로 렌더링 이슈 해결 * form의 데이터와 상태를 provider 하위 모든 컴포넌트가 props drilling 없이 사용 가능
yup validation	0.32.11	유효성 검사	* 짧은 코드로도 정확하게 유효성 검사가 가능하며, react-hook-form과 함께 사용하여 검증 코드 간소화
react-aws-s3-typescript	1.1.4	aws-s3 버킷 연결	* 이미지 업로드로 사용하는 버킷 연결을 위해 'aws-sdk'를 설치하기엔 설치 파일이 너무 무거워 대체
redux-persist	6.0.0	전역 상태 관리	* 새로고침 시 initial state가 초기화되는 부분 해결
qs	6.11.0	query-string 처리	* 언어 간 호환성 및 표준을 맞춰 query-string으로 변환