react4 [React 리액트] react-loading 라이브러리 - 로딩 스피너 만들기 react-loading 라이브러리를 이용하면 별도의 css코드를 입력하지 않아도 쉽게 로딩 애니메이션을 만들 수 있다. 📌 설치 npm 또는 yarn을 통해 라이브러리를 설치하여 사용한다. ✔ npm npm i react-loading ✔ yarn yarn add react-loading 📌 다양한 로딩 타입들 blank balls bars bubbles cubes cylon spin spinningBubbles spokes 📌 데모 확인하기 📌 예시 코드 import React from 'react'; import ReactLoading from 'react-loading'; const Example = ({ type, color }) => ( ); export default Example; 🔗 출처.. 2023. 2. 2. [React 리액트] react-new-window 라이브러리 - 새로운 window창 띄우는 방법 📌 설치 npm i react-new-window --save 📌 예시 코드 import React from 'react' import NewWindow from 'react-new-window' const Demo = () => ( Hi 👋 ) 📌 내 코드 onOpen} > NewWindow를 클릭하면 컴포넌트를 띄우도록 구현했다. 🔗 참고 react-popout 이라는 라이브러리도 있다. ❗ 데모 확인하기 http://jake.ginnivan.net/react-popout/ Document jake.ginnivan.net 🔗 출처 https://www.npmjs.com/package/react-new-window react-new-window Pop a new window in React, using.. 2022. 12. 28. [React 리액트] Module not found: Can't resolve 'web-vitals' 오류 해결 yarn을 통해 react를 실행했더니 오류가 발생했다. Module not found: Can't resolve 'web-vitals' 아주 간단한 해결 방법 - 터미널에 아래와 같이 입력한 뒤 다시 yarn start를 입력하면 compiled successfully를 확인 할 수 있다 :) npm i web-vitals --save-dev 참고: https://stackoverflow.com/questions/65396568/react-js-npm-start-shows-failed-to-compile-web-vitals React JS npm start shows failed to compile web-vitals I'm getting the error: failed to compile -/src/.. 2022. 9. 26. [React 리액트] 리액트 만들고 실행하기 react 리액트를 해보기 전에 준비를 해봅시다. 저는 VS Code를 사용하겠습니다. 준비1. Node.js 설치하기Node.js가 설치되어 있는지 확인하기윈도우-명령 프롬프트 / 맥os-터미널에서 아래와 같이 입력하기(버전이 나오면 설치된 것 / 'node은(는) 내부 또는...' 이렇게 나오면 설치가 안 되어있으니 설치 ㄱㄱnode -vNode.js가 설치 되어 있지 않다면? 설치하기!https://nodejs.org/en/2. npm 설치 확인하기npm -v3. npx 설치하기npm을 통해 npx를 설치하고 버전까지 확인 해주기npm install npx -gnpx -v 4. VS Code 설치하기https://code.visualstudio.com/5. 깃 설치하기https://git-scm... 2022. 6. 10. 이전 1 다음
