react-redux ## 설치 라이브러리$ yarn add redux react-redux redux-actions ## 필수 셋팅redux를 사용할 최상위 컴포넌트에 Provider를 이용해 store를 주입해야 한다.import { Provider } from 'react-redux'; Redux App ## Actions 셋팅import { createAction } from 'redux-actions'export const addText = createAction(TYPE_ADD);위에 선언한 actions인 addText를 호출할 때 파라미터를 입력하게 되면 다음과 같은 데이터 구조로 reducer에 전달된다.addText({text: 'abc', color: '#fff'}); /* 결과: { type: 'TYPE.. 더보기 Router 관련 Component ## React Router 설치$ yarn add react-router-dom ## BrowserRouter ComponentRoute를 사용할 Component 상위에 랩핑해준다. 사용 예제import React from 'react' import { BrowserRouter } from 'react-router-dom'; import App from '../shared/App'; const Root = () => ( ); export default Root; ## Route Componentimport { Route } from 'react-router-dom';url 패턴에 맞는 Component를 맵핑해 준다. 사용 예제 콜론(:)으로 되어 있는 URL은 맵핑되어 있는 Component에서 p.. 더보기 yarn 빌드시 path 경로 변경 build 이휴 생성되는 html 파일에 설정되어 있는 경로를 보면 '/' 로 시작 하는 것으로 되어 있다.contextPath나 테스트를 위해 기본 URL이 변경이 필요할 땐 적용하도록 하자. package.json 파일에 homepage 속성을 추가한다. 예제{ "name": "phone-book", "version": "0.1.0", "homepage": "./", "private": true, "dependencies": { "react": "^16.4.2", "react-dom": "^16.4.2", "react-scripts": "1.1.5" }, "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test.. 더보기 이전 1 2 3 4 5 ··· 9 다음