1. 설치 npm install react-unity-webgl 2. 빌드 파일 옮기기 public 폴더에 index.html 제외하고 붙여넣기 3. 코드 적용 import logo from './logo.svg'; import './App.css'; import { Unity, useUnityContext } from 'react-unity-webgl'; import React from 'react'; function App() { const { unityProvider } = new useUnityContext({ loaderUrl: 'Build/webgl2.loader.js', dataUrl: 'Build/webgl2.data', frameworkUrl: 'Build/webgl2.framework...

Failed prop type: Invalid prop 'component' supplied to 'Route': the prop is not a valid React component - 라우팅을 하고 화면구성을 하다보면 위와같은 오류를 마주칠때가 있는데 이 경우에 한가지 의심해봐야할 것은 미리 화면들을 구성해 놓고 저장을 하지 않고 실행하지 않으면 미리 만들었던 화면이 저장되지 않아서 다음과 같은 오류가 생길 수 있으니 조심.... // App.js function App() { return ( ); } - Home.js ... 등등 미리 화면을 만들어놨는데 저장을 하지 않으면 react가 component가 없는것으로 판단하기 때문에 화면 뼈대를 미리 만들었다면 꼭 저장을 하고 실행하기

- redux란? JavaScript(자바스트립트) 상태관리 라이브러리이다. - 설치 https://react-redux.js.org/introduction/getting-started Getting Started with React Redux | React Redux Introduction > Getting Started: First steps with React Redux react-redux.js.org npm install react-redux - 사용 예제 1. store 만들기 // store.js // 액션 export const increase = (username) => ({type:"INCREMENT", payload: username}); export const decrease = (..

- 설치 https://react-bootstrap.github.io/getting-started/introduction React-Bootstrap The most popular front-end framework, rebuilt for React. react-bootstrap.github.io npm install react-bootstrap bootstrap - App.js 나 index.js에 전역적으로 import 작업 // index.js import 'bootstrap/dist/css/bootstrap.min.css'; - 컴포넌트 적용시 react-bootstrap으로 import해서 사용 (button 예시) // Home.js import { Button } from 'react-boo..

- react를 공부하던중 react-router-dom Link를 사용하면 url은 바뀌는데 컴포넌트가 업데이트가 되지않는다. - 코드 // App.js function App() { return ( ); }; // Header.js const Header = () => { return ( 홈 로그인 ); }; - 문제의 코드 // index.js const root = ReactDOM.createRoot(document.getElementById('root')); root.render( ); - index.js에서 React.StrictMode 태그를 삭제해주면 동작이 잘된다. - 이유? : 단순히 리액트 StrictMode이기 때문 (문서확인) https://ko.reactjs.org/docs/st..