create-react-app 생성한뒤 src의 바깥 폴더에 .env 파일 생성본 이유는 나중에,, 항상 이렇게 프로젝트를 셋업한뒤 시작한다고 한다.Prop type 설치npm startcomponents 폴더를 생성해서 App.js 파일을 components폴더로 옮
설치사용방법원하는 태그의 스타일을 변수와 함께 선언해주고스타일을 선언해준 변수로 태그를 지정해준다.Link태그를 이용하면 자바스크립트 방식으로 이동하게 해준다.styled-components를 지정할때 a태그가 아닌 Link태그로 지정하고 싶다면 아래와 같이 해주도록
Axios 설치사용자가 검색어를 입력할때 오타 혹은 특수문자를 입력했을 경우에 처리해주는 부분이 필요하다.만약에 @를 입력했을때 URL에서 인코딩을 해줘야한다. string만 인식하기 때문에어떠한 값을 이 함수에 넘기든지 값을 인코딩하고 문자열로 검색하게 해준다.
container-presenter 패턴데이터처리와 데이터출력을 분리하는 패턴Container에서는 API Request, Exception Error, redux, dispatch...Presenter에서는 Props, UI...를 관리하는 것이다.Container에
array: 배열 arrayOf: 특정 propType으로 이루어진 배열 bool: true or false 값 func: 함수 number: 숫자 object: 객체 string: 문자열 symbol: ES6의 Symbol node: 렌더링할 수 있는
age?: number에 optional value 값을 준 것.age는 number이거나 undefined이다.cra와 typescript 설치typescript로 설치하면 jsx, js파일 확장자는 tsx, ts로 선언된다.🧨 but 타입스크립트 확장자가 아닌 기
리액트에서 일반적인 값을 자손에게 전달하는 방법은 하향식으로 전달해야한다.전달 받은 값을 자손에서 부모에게 변경하고 싶다고 알려주려면, 하향식으로 전달받은 함수를 이용해야 한다.Level이 깊어질수록 불편함을 야기한다.이를 해결하기 위한 방법으로 flux, reflux