본문 바로가기
728x90
반응형

IT/React36

React 소스 수정 진입점 프로젝트를 만들었다면.... (예를들어...create-react-app hello) 해당 디렉토리로 들어가서..index.html 은 손대지 말고, 아래 2 파일을 수정하면 된다.index.jsApp.js 수정해보기App.js 의 App()를 다음과 같이 다 지워보자. function App() { return ( ); } 그리고, src 디렉토리에 component 라는 하위 디렉토리를 만든다. -> counter.js 파일 생성 -> 생성파일에서 'rsf' 라고 치고 엔터 function 이름의 첫글자는 대문자로 바꿔라. 실행은 yarn start 2022. 9. 22.
샘플 코드 03 - 부모->자식으로 데이터 전달 예제(props 사용) App() 을 컴포넌트처럼 사용한 예제 이때, 자식에게 msg라는 변수를 통해 값을 전달 App() 내부에서는 props 를 사용해 값을 받음. DOCTYPE html> Document ReactDOM.render( , document.getElementById('root') ); function App(props) { return( Event Processing {alert(props.msg)}}>클릭 ) } 2022. 9. 22.
샘플 코드 01 실행은 VSC에서 F5... DOCTYPE html> Document ReactDOM.render( // 반드시 태그 2개가 연달아 나오려면 로 감싸야 함. Hello, world! Heeee , document.getElementById('root') ); 2022. 9. 22.
React 개발 환경 설정하기 0. chrome 에 'react developer tools' 확장 프로그램 추가해라. 'redux devtools' 도 추가해라. - Hook을 실시간으로 볼수 있다. 1. nodejs 설치하기 https://nodejs.org/en/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2. 설치 진행 - 아래 글 참조 https://offbyone.tistory.com/441 Node.js 설치하기 Node.js는 Javascript로 작성된 프로그램을 운영체제상에서 일반 애플리케이션 프로그램처럼 실행시켜주는 런타임입니다. 특히, 서버 프로그램을 작성하는데 많이 사용되고 있는것 같습니다... 2022. 9. 16.
728x90
반응형