분류 전체보기346 React(3) 리액트에서 javaScript 사용하기 이미 만들어진 샘플 웹에서 수정하는 식으로 React로 JavaScript내용을 변경해보자 1. Visual Studio에서 React-app폴더를 연다. 2. public-index.html 을 살펴보자. (id="root"인 태그 안에 내용이 들어갈거다.) 3. index.js의 내용을 살펴보자 render()라는 함수의 인자로 과 document.getElementById('root')가 온다. 4. App.js의 내용을 살펴보자 여기서 render()의 정의가 나온다. 실제로 html문서에 들어갈 core가 담겨있음 실행화면 App.js에서 적은 텍스트가 뜬다. 2020. 12. 29. React(2) Visual Studio로 테스트하기 VS로 리액트 앱 테스트 실행 1. VS화면 상단 메뉴에서 view-appearance-show panel 2. npm start run 치고 엔터치면 리액트가 실행된다. (이때 경로확인한다.) 3. 성공적으로 실행되면 웹브라우저가 자동으로 열린다. 리액트가 제대로 돌아가고 있다는 것을 보여준다. 끌 때는 ctrl + c를 누르면 꺼진다. 2020. 12. 29. React 실행오류 - npm ERR! code ENOENT(errno -4058) Updated 21/07/30 문제상황 " npm ERR! code ENOENT(errno -4058) " React를 실행하기 위해 visual studio 터미널창에 npm run start를 입력하니 4058로 시작하는 에러가 나왔다. path를 살펴보니 설치시 지정한 경로와 달랐다. package.json파일이 없다고 한다. 문제해결 1. 다시 install 과정을 되짚어봄 (지난 포스팅참조) 2. instal 로 잘못 입력했네 -_- 일단 install 자체가 잘못되었다. 다시 설치하기 - 원래 react-app 폴더에 프로젝트가 들어가야 한다. cd react-app 으로 현재 path를 react-app 으로 바꿔주자 C:\Users\Saebal ↓ C:\Users\Saebal\react-a.. 2020. 12. 29. React(1) 개발환경 설치하기(node.js) 리액트를 사용할 준비를 끝내보자. 1. 웹사이트에서 node.js 다운로드하기 nodejs.org/en/ 2. 다운로드 받은 Node.js 설치하기 3. window + r 를 눌러 cmd 창 소환 후 명령어 npm -v 를 입력해 설치된 버전 확인하기 (띄어쓰기 주의) 4. create-react-app 설치하기 cmd에 명령어를 입력한다. (띄어쓰기 신경쓰기) 잘설치되었나 확인해보자. 5. create-react-app을 이용해 디렉터리 설정하기 1) 바탕화면에 react-app이라는 폴더를 하나 만든다. 2) cmd를 켜고 cd 명령어를 사용하여 react-app 디렉토리를 만든다. 이 포스팅은 개발환경 세팅방법 중 직접 다운받아 사용하는 방법이다. 2020. 12. 29. 이전 1 ··· 36 37 38 39 다음 반응형
