클론코딩3 책과 함께] State + button 생성해서 count값 알아보기 * 책의 모든 내용을 업로드할 수 없기 때문에 간단한 부분만 업로드한 후, 직접 클론 코딩한 내용은 비공개로 업로드 하겠습니다. state란 * 동적 데이터를 다룰 때 사용합니다. - props는 동적 데이터 다루지 못 합니다. * 사용하기 위해서는 앞의 function A( )형식이 아닌, 클래스형 컴포넌트에서 사용해야 합니다. * setState()로 새로운 데이터를 업로드하면, 리액트는 이전 state와 비교해 새로운 데이터만 업로드합니다. 1. state 사용을 위해 클래스형 컴포넌트 만들기 클래스형 컴포넌트의 기본 뼈대 : 상속 class App extends React.Component{ } 2. JSX 반환하기 -> render( )이용. 앞에서 실습한 App의 형식은 class가 아니라 f.. 2020. 7. 5. 책과 함께] 효율적으로 컴포넌트 만들기 * 책의 모든 내용을 업로드할 수 없기 때문에 간단한 부분만 업로드한 후, 직접 클론 코딩한 내용은 비공개로 업로드 하겠습니다. 효율적으로 컴포넌트 만들기 이번 챕터에서는 map( )함수로 컴포넌트를 만들어보았습니다. 설명도 깔쌈해서ㅎㅎㅎ 넘나 재미있게 배웠어요ㅎㅎㅎㅎ 실습한 코드도 올리고 싶지만, 다 넘나 책에 있는 내용이라;ㅎㅎ 실습 후 결과 화면만 띄우겠슴당~! 2020. 7. 2. 책과 함께] 리액트 동작 원리 및 기초 개념 * 책의 모든 내용을 업로드할 수 없기 때문에 간단한 부분만 업로드한 후, 직접 클론 코딩한 내용은 비공개로 업로드 하겠습니다. 동작 원리 복습 리액트는 개발자가 작성/수정한 프로젝트 폴더의 code를 JavaScript를 이용해 해석합니다. 기초 개념 1. App( ) 함수의 반환값이 많아지면? App.js Function App(){ return ( Hello ; } //------------------ // App() 함수의 반환값이 많아지면 소괄호로 감싸기 // Function App(){ return ( Hello ); } //------------------ 2. 컴포넌트 리액트는 같은 표시를 컴포넌트로 인식하고, 컴포넌트가 반환하는 값을 화면에 그립니다. -> 리액트는 컴포넌트와 함께 동작하.. 2020. 7. 1. 이전 1 다음