React/기타6 [React]새로운 탭 띄우는 방법 새로운 탭 띄우는 방법 이번 포스팅은 React에서 외부 링크를 띄우는 방법을 소개합니다. a 태그를 활용하여 새로운 탭 띄우기 첫 번째 방법으로 HTML의 기본 요소인 태그를 사용할 수 있습니다. 태그의 href 속성에 외부 링크를 설정하고 target 속성에는 "_brank"를 설정합니다. 마지막으로 rel 속성에는 "noopener noreferrer"를 설정합니다. export default function App() { return ( Naver 이동 ); } target 속성을 "_blank"로 설정하면 외부 링크가 새로운 탭에서 활성화됩니다. rel 속성의 noopener는 현재 활성화된 페이지와 새로운 탭에서 활성화되는 페이지를 별개의 프로세스로 취급합니다. noreferrer는 현재 활성.. React/기타 2022. 12. 5. [React]Warning: A component is changing an uncontrolled input to be controlled. 경고 『 A component is changing an uncontrolled input to be controlled. This is likely caused by the value changing from undefined to a defined value, which should not happen. Decide between using a controlled or uncontrolled input element for the lifetime of the component. 』 해석 '컴포넌트는 제어할수없는 input을 제어하기 위해 변경하고 있습니다. 해당 경고는 undefined에서 정의된 값으로 변경할려고 해서 발생하였으며, 이러한 경우는 발생해서는 안됩니다. 컴포넌트의 일생동안 input .. React/기타 2021. 7. 22. [React]CORS 에러 해결 사전 지식 Client-Server 구조에 대한 이해가 필요합니다. request와 response에 대한 이해가 필요합니다. url에 구조에 대한 이해가 필요합니다. proxy에 대한 이해가 필요합니다. Client에서 Server로 API 통신을 했는데, 아래 사진처럼 에러가 발생하는 경우가 있습니다. (REST, SOAP, GraphQL 등 다양한 API 통신 방법이 많으므로 API 통신이라고 지칭하겠습니다.) Access to fetch at 'http://localhost:3001/test' from orgin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is pres.. React/기타 2021. 6. 25. [React]Error : Typo in static class property declaration react/no-typos 컴파일 에러 『 Typo in static class property declaration react/no-typos 』 에러 원인 PropTypes의 맨앞의 P를 대문자로 입력해서 발생한 에러입니다. 에러 해결 PropTypes를 propTypes로 수정합니다. /* 수정 전 */ Login.PropTypes = { setToken : PropTypes.func.isRequired } /* 수정 후 */ Login.propTypes = { setToken : PropTypes.func.isRequired } React/기타 2021. 6. 22. [React]VSCode Git 연동 VSCode와 GitHub 연동 방법에 대해 설명합니다. 1. git version 확인 git --version 2. git init git init 3. git 레퍼지토리 생성 좌측 상단의 New 또는 우측 상단의 + 버튼을 클릭 후 New Repository를 클릭합니다. 레퍼지토리 이름과 보안정책 초기 세팅을 설정 후 Create repository 버튼을 클릭합니다. 저는 코드 공유 목적이 없으므로 Private로 선택하였습니다. 생성된 레퍼지토리 주소를 복사해줍니다. 4. git remote add origin git remote add origin '복사한 주소' 작업 중인 프로젝트와 git 레퍼지토리와 연동합니다. git remote add origin 뒤에 복사한 주소를 붙여 넣기 해줍니.. React/기타 2021. 6. 16. [React]Window10에서 React 개발 환경 세팅 Windows 10에 React를 설치하는 단계에 대해 설명합니다. 1. Visual Studio Code 설치 VS Code 다운로드 링크에서 다운로드 받습니다. 2. Node.js 설치 Node.js 다운로드 링크에 접속해서 node.js를 다운받습니다. ※ 유의사항 create-react-app로 react 프로젝트를 만들 경우에는 Node.js Version은 10 이상으로 설치를 하셔야합니다. 최신 버전은 안정성 측면에서 100% 검증이 되지 않았기 때문에 굳이 최신 버전을 다운로드 받으실 필요가 없습니다. node 설치후 cmd에서 아래 명령어로 node와 npm이 설치가 되었는지 확인합니다. node -v npm -v 저는 node의 Version 6.10.2라서 Node.js의 버전을 업그.. React/기타 2021. 5. 13. 이전 1 다음