[React] "React component names must start with an uppercase letter ~ " 오류 해결

리액트 프로젝트 중 const navigate = useNavigate();를 사용하려고 하는데 React component names must start with an uppercase letter ~ 오류가 발생했다

 

원인과 해결 방안은 아주 간단한데 매번 깜빡하고 리액트 프로젝트할 때마다 발생했던 오류라서 정리해야겠다 싶었음

 

🚨 리액트 컴포넌트가 소문자로 시작해서 생긴 오류

리액트는 대문자로 시작하는 태그를 리액트 컴포넌트로 인식하고 소문자로 시작하는 태그는 HTML 태그로 인식한다. 따라서 소문자로 시작하는 컴포넌트에서 useNavigate()를 선언해서 발생한 오류이다.

---

🔎 해결 방안

그냥 컴포넌트를 대문자로 시작하도록 변경해주면 된다!