Access to XMLHttpRequest at 'http://localhost:8080/api/hello' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 이와 같은 오류가 발생하는 경우 해결책을 찾는 게시글이다. HelloWorldController.java package com.dotori.daram.Controller; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bin..
App.js import React, {useEffect, useState} from 'react'; import axios from 'axios'; import {Route, Router, Switch} from "react-router-dom"; import LandingPage from "./Components/LandingPage"; export default function App() { return ( ); } 실행했더니 다음과 같은 오류가 발생한다. Cannot read properties of undefined (reading 'location') TypeError: Cannot read properties of undefined (reading 'location') at new Route..
App.js import React, {useEffect, useState} from 'react'; import axios from 'axios'; import {Route, Router, Switch} from "react-router-dom"; import LandingPage from "./Components/LandingPage"; function App() { return ( ); } export default App; 해당 코드를 작성하여 실행하니 export 'Switch' (imported as 'Switch') was not found in 'react-router-dom' 오류가 발생했다. 이는 Switch를 찾을 수 없다는 오류이다. 왜냐하면 버전6 이상에서 Switch가 삭제되었기..
https://react.vlpt.us/basic/10-useRef.html 10. useRef 로 특정 DOM 선택하기 · GitBook 10. useRef 로 특정 DOM 선택하기 JavaScript 를 사용 할 때에는, 우리가 특정 DOM 을 선택해야 하는 상황에 getElementById, querySelector 같은 DOM Selector 함수를 사용해서 DOM 을 선택합니다. 리액트를 사용하는 react.vlpt.us useRef로 특정 DOM 선택하기 리액트에서 DOM을 선택할 때 ref 라는 것을 사용한다. React에서 state로만 해결할 수 없고, DOM을 반드시 직접 건드려야 할 때 사용하게 된다. ex ) 특정 input에 focus 주기, 스크롤 박스 조작, Canvas 요소에..
https://react.vlpt.us/basic/07-useState.html 7. useState 를 통해 컴포넌트에서 바뀌는 값 관리하기 · GitBook 7. useState 를 통해 컴포넌트에서 바뀌는 값 관리하기 지금까지 우리가 리액트 컴포넌트를 만들 때는, 동적인 부분이 하나도 없었습니다. 값이 바뀌는 일이 없었죠. 이번에는 컴포넌트에서 보여줘 react.vlpt.us useState 를 통해 컴포넌트에서 바뀌는 값 관리하기 리액트 16.8 에서 Hooks 라는 기능이 도입되면서 함수형 컴포넌트에서도 상태를 관리할 수 있게 되었다. useState 라는 함수는 리액트의 Hooks 중 하나이다. https://learnjs.vlpt.us/basics/05-function.html#%ED%99%..
학습 자료 : https://react.vlpt.us/basic/05-props.html 5. props 를 통해 컴포넌트에게 값 전달하기 · GitBook 5. props 를 통해 컴포넌트에게 값 전달하기 이번에는 컴포넌트의 props 라는 개념에 대해서 알아보겠습니다. props 는 properties 의 줄임말입니다. 우리가 어떠한 값을 컴포넌트에게 전달해줘야 할 때, react.vlpt.us props 를 통해 컴포넌트에게 값 전달하기 props.children App.js import React from "react"; import Hello from "./Hello"; import Wrapper from "./Wrapper"; function App() { return ( ); } export..
