React_Test

생성누르면 메인사진이 바뀌게 하라생성버튼 함수이름 - handleFormSubmit생성을 눌렀을때 메인사진을 바꿔야한다메인사진을 바꾸기위해서 메인캣이라는 상태(React.useState) 를 만든다const mainCat, setMainCat = React.useSta

javascript + XMLjavaScript에 HTML태그를 끼얹은 문법HTML 태그 안에선 중괄호 ({})를 사용해서 JS를 쓸 수 있다.ex) const count = 1;위 title변수에 담은 h1태그는 리액트 엘리먼트 라고 부른다.최신 문법을 브라우저가 이

상태컴포넌트 안에서 자유롭게 변경할 값이 필요할때useState함수로 상태를 추가할 수 있다.const 상태명, 상태변경함수명 = React.useState(초기값)\-컴포넌트 안에서 만들 수 있다.ex) const count, setCounter = React.us

// 노드 버전 확인node -v// 파일 확인ls// 리액트 앱의 파일 이름지정npx create-react-app cat-jjal-maker-cra\--- 파일설치// 리액트 파일 찾기 cd cat-jjal-maker-cra// 리액트 실행npm start

리액트 컴포넌트index.html 에 작성한 코드들을 npx creat-react-app 리액트파일이름 을 만들어서 그 안에 src를 열어컴포넌트로 나누어 정리한다정리할 코드를 복사한다src 안에 components폴더를 만든다폴더안에 만들고 싶은 컴포넌트이름을 파일로

babel 추가https://ko.reactjs.org/docs/add-react-to-a-website.htmlJSX 빠르게 시도해보기소스코드를 넣고내가 적을 script안에

자바스크립트 문법을 리액트안에 쓸때에는 {}를 사용하여 작성한다ex) const CatItem = (const Favorites = (

스타일링벨류값을 스트링으로 넣어줘

onClick={}onMouseOver={}

문제()번째 순서()안에 들어가는 숫자를 + 1 이 되게 만들어라App컴포넌트를 만들어줍니다그 안에 카운터 상태를 만들어줍니다생성을 했을때에 부르는 함수 -> handleFormSubmit();함수내용 ↓함수내용을 보면 안에 counter 와 setCounter의 내용

리액트에서 prop으로 넘길때에는handleItemClick을 onItemClick으로 바꿔준다브라우저 데이터 저장\*로컬스토리지에서는 벨류를 저장할때 스트링값으로 저장한다.number값으로 저장하고 싶을때

onSubmit은 새로고침하는 효과가 있다그렇기 때문에onSubmit 호출 시새로고침이 되지 않도록event.preventDefault();를 추가해준다

리액트 오류시 실행해볼 소스코드🙊\*\* 버전관련 문제일시👻리액트 앱 제거npm uninstall -g create-react-app리액트 앱 재설치npm install -g create-react-app리액트 앱 실행npx create-react-app 앱이름