[React] React Hook "useEffect" is called in function 에러 해결
·
Frontend/React
문제 발생 원인youtube에 있는 react강의를 따라하다가 에러가 발생했다. 더보기상세한 에러 문구React Hook "useEffect" is called in function "index" that is neither a React function component nor a custom React Hook function. React component names must start with an uppercase letter. React Hook names must start with the word "use". (react-hooks/ rules-of-hooks)알고보니, `React` 의 컴포넌트는 대문자로 시작해야 `useEffect`, `useState` 같은 hook을 사용할 때 오류가..
[Vite] React + TypeScript 기반 프로젝트 생성하기
·
Frontend/React
Vite (비트) 란 간략하게 말하자면, '진짜 빠른 번들링 툴'실무 초반엔 Vue-CLI를 활용한 빌드를 진행했었다. (Vite의 필요성을 크게 느끼지 못했기 때문)그런데 프로젝트 규모가 커지면서, 빌드하는데 시간이 오래걸리기 시작했다.프론트엔드 개발은 코드를 계속 갱신하면서 테스트를 진행하기 때문에, 핫로딩/빌딩이 빠르게 이뤄져야 개발효율성이 높아진다. 그래서 Vue-CLI에서 Vite로 전환을 하게 되었고, 빠른 빌드 속도로 업무 효율성이 크게 증가했다.Vite는 비록, Vue.js의 창시자인 Evan You가 Vue3과 함께 개발한 번들링 툴이긴 하지만, Vue에만 국한되진 않는다.그래서 React 프로젝트에도 요즘 많이 사용된다고 들었다.💎 Vite 템플릿으로 프로젝트 생성하는 방법1. cre..
[React] React와 React Native의 차이 비교
·
Frontend/React
요즘 채용 시장을 쭉 훑어보니 Vue보다 React의 비중이 훨씬 높은 것 같다.기존에 Vue 기반 프로젝트를 찐하게 해오던 상황이라, React로도 경험을 쌓아봐야할 것 같아 제대로 공부해보기로 했다.이미 SPA 프레임워크에 대한 이해는 어느 정도 되어있는 상황이라, 빨리 적응할 수 있지 않을까?React와 React Native두개는 용도가 다르기 때문에, 프로젝트의 목적에 따라 어떤 것을 사용할지 결정해야 한다. 항목  React  React Native 플랫폼  웹 (PC/모바일 웹 브라우저) iOS, Android (모바일 앱) 언어  HTML, CSS (JSX), JavaScript/TS JavaScript/TS (네이티브 컴포넌트) 렌더링 방식 DOM (HTML) 렌더링 네..
[React] digital envelope routines::unsupported (error:0308010C) 오류 해결
·
Frontend/React
React 프로젝트를 생성해서 실행시키는 과정에서 이런 오류가 났다 Error: error:0308010C:digital envelope routines::unsupported 구글링해보니 node 버전이 너무 높아서 그렇다는 이야기가 있었다 그래서 다운그레이드도 해보고, 아예 node와 npm을 삭제도 해보고,, Program Files 들어가서 관련 폴더 삭제도 해봤는데 해결이 안됨 ㅠ 그러다 https://naraewool.tistory.com/350 https://www.freecodecamp.org/news/error-error-0308010c-digital-envelope-routines-unsupported-node-error-solved/ 이 두 글을 보고 해결했다! 에러 원인 react-..