import / export / state 데이터 바인딩 export / import 문법 다른 파일에 있는 것을 가지고 올 수 있음 그럴려면 export/ import 문법이 필요함. 변수를 export하고 import하면 끝 export 하려면 → export default 변수명 let a = 10; export default 변수명 export 여러개 하려면 → export {변수1, 변수2} let a = 10; let b = 100; export { a, b } import 하려면 → import 작명 from ‘파일경로’ import 작명 from './data.js' import 여러개 하려면 → import{ 변수1, 변수2 } from ‘경로’ import {a, b} from './d..

일반 HTML에서 DOM요소에 이름을 달 때는 id를 사용한다.

변수 함수를 굳이 밖에 안빼도 된다. state를 자식에 만들면 부모 → 자식 전송할 필요가 없다. 근데 state가 Modal, App에서 필요하면 가장 최상위 컴포넌트에 보관하는 게 좋음 App에 보관 태그 에 뭔가 입력시 코드 실행하고 싶으면 onChange / onInput onMouserOver → 마우스를 올릴 때 이 코드 실행 onScroll → 스크롤 조작할 때 실행 input 태그에 입력한 값 가져오는 법 {console.log(e.target)}}> e를 넣어주면 이벤트객체라고 불리는거다. input 태그에서 발생하는 이벤트과 관련된 기능(변수)라고 보면 된다. e.target 이 이벤트가 발생하는 곳 e.target.value 이벤트가 입력한 값 input에 입력한 값 저장하려면 아래..

5강 버튼에 기능개발을 해보자 & 리액트 state 변경하는 법 1개의 state안에 여러가지 자료를 넣고싶다면 array형식으로 만들어서 사용 아래와 같이 만들어서 사용함 let post = '강남 우동 맛집' let [글제목, b] = useState(['남자 코트 추천', '강남 우동맛집', '파이썬 독학']); 이 자료를 뽑고 싶을 때는 아래와 같이 인덱스 입력하여 사용 return ( ReactBlog { 글제목[0] } 2월 17일 발행 { 글제목[1] } 2월 17일 발행 { 글제목[2] } 2월 17일 발행 터미널을 실행해보면 빨간색 error랑 warning 이렇게 두가지가 나오는데 빨간색의 경우는 중요한 거라서 해결해야함 노란색의 경우는 무시해도 됨. 노란색이 좀 지우고싶다. /* es..

2강. 리액트 설치와 개발환경 셋팅 리액트 파일 만들 때는 폴더를 하나 만든 후 폴더 우클릭 후 터미널로 열기(맥북기준) npx create-react-app blog(blog에 파일명 입력) 리액트 처음 시작할 때 (미리보기) → npm start 왜 설치를 했는가 ? html에도 직접 리액트 설치할 수 있는데 create react app 라이브러리를 사용해서 도움을 받음 사용하려면 npm이 필요해서 node.js 설치해야함 폴더 생성 후 폴더 열기하면 파일 안에 node_modules 폴더 : 라이브러리 보관함 public 폴더 : static 파일(html, 이미지파일 등 보관할 때) src 폴더 : 코드 짜는 곳 - 소스 코드보관함 app.js가 메인페이지 app.js → html app.js ..