이롭게 현명하게

목차오류 내용원인해결방법 [오류 내용]Route 관련 컴포넌트를 생성하던 중 발생한 경고이다. React Hook useEffect has a missing dependency: 'requireAuth'. Either include it or remove the dependency array.eslintreact-hooks/exhaustive-deps[번역]React Hook useEffect에 종속성이 누락되었습니다: 'requireAuth'. 이를 포함하거나 종속성 배열 .eslintreact-Hooks/everse-deps를 제거하세요 [원인]"use client";import { useAuth } from "@/shared/hooks/useAuth";import React, { useEffect..

목차on과 handle의 차이실제 코드 예시로 이해하기패턴 요약 및 정리마무리 - 팀 컨벤션으로 정착시키기 리액트를 사용하면서 onClick과 handleClick의 이름의 함수나 props를 사용하게 된다.처음에는 '줄 다 클릭 이벤트니까 이 코드에서 뭔지만 알면 되겠지?' 정도로만 생각했다.코드 리뷰를 받으면서 handle과 on의 코드 컨벤션이 있다는 것을 알게 되어 기록을 하게 되었다. [on과 handle의 차이]리액트에서 이벤트 핸들러를 사용할 때 두 가지 경우로 사용한다.on + EventName = 외부로부터 전달받는 이벤트handle + EventName = 내부에서 정의된 구현 함수 props 이름이나 JSX/TSX이벤트 속성을 표현할 때 사용버튼이 클릭되었을 때 실행할 동작을 외부에서..

목차리액트 기본 폴더 및 파일src 내부 폴더 구조[번외] package.json [리액트 기본 폴더 및 파일]프로젝트를 진행하다 보면 관리해야 할 파일들이 늘어난다.파일들을 효율적으로 관리해야 하기 때문에 폴더의 구조를 잘 잡아야 한다. 24년 가지는 CRA를 사용하여 프로젝트를 구성했다.하지만 2025년 2월 14일 리액트 공식 블로그에 CRA 사용을 중단한다는 글이 올라왔다.그래서 vite를 사용하여 리액트 환경을 구성한다. 이 글에서는 타입스크립트를 기준으로 설명하겠습니다.https://devyihyun.tistory.com/230 [React] vite로 리액트 설치하기목차 create-react-app 지원 종료vite를 사용하는 이유vite 시작하기 https://devyihyun.tist..

목차경고 내용원인해결방법 [오류 내용]회원가입 폼 기능을 만들면서 warning이 발생했다. [DOM] Input elements should have autocomplete attributes (suggested: "new-password"): (More info: https://goo.gl/9p2vKq) flex [원인] 이 경고는 HTML 접근성 및 보안 관련 경고이다.비밀번호 입력 태그에 속성이 명시되지 않았다. [해결 방법]new-password새 비밀번호 입력 시 브라우저가 자동완성하지 않도록 함회원가입/ 비밀번호 변경current-password브라우저가 저장된 계정 비밀번호를 자동완성하도록 유도로그인현재 회원가입을 구현중이므로 new-password가 적합하다. 또는 잘못된 정보..

목차 vite 다운그레이드 시 생긴 오류 [Vite 다운그레이드 시 생긴 오류]Create-React-App 지원을 종료한다는 소식을 듣고 CRA를 사용하던 입장에서 어떤 방식으로 React 개발 환경을 구성해야 할지 막막했다.그러던 중 여러 문서를 찾아보며 vite라는 빌드 도구를 알게 되어 간단하게 사용해 봤었다.그 당시에는 vite 6.3.5 버전으로 환경 구성을 하고 실행까지 잘 되는 것까지 확인하였다. 프로젝트 진행을 하기 위해 vite를 사용해 react 환경을 구축하는 과정에서 오류가 발생했다.최신 버전인 vite 7.0.0에서 node의 버전이 맞지 않아 설치가 불가능했다.node를 업그레이드하기보다는 안정성을 위해 vite를 조금 낮은 버전이 6.5.0로 설치해 보자는 결론을 내렸다.이..

목차vite 환결설정 오류vite 환경설정 오류 원인vite 환경설정 오류 해결다운그레이드 시 생긴 오류 [vite 환경설정 오류]vite를 사용해 react 개발 환경을 세팅하고 있었다.npm create vite@latest 설정이 잘 되었는지 확인하기 위해 서버를 실행했다.npm run dev 다음과 같은 오류가 발생했다.error when starting dev server:TypeError: crypto.hash is not a functionat getHash (file:///C:(생략)/workspace/vite-project/node_modules/vite/dist/node/chunks/dep-Bsx9IwL8.js:2834:21) 글을 쓰면서 다시 보니 이미 npm install에서 경고..