IT_susu

BrowserRouter - 정의 : HTML5 history API를 사용하는 라우터. - props basename : 모든 위치의 기본 URL getUserConfirmation : 탐색할 때 쓴다는데.. forceRefresh : true인 경우 페이지 탐색 시 전체 페이지 새로고침. html5 history api 지원하지 않는 브라우저에서 사용. keyLength : location.key의 길이 HashRouter - 정의 : hash를 사용하여 ui와 url을 동기화하는 라우터. 라이브러리에서 비추. NativeRouter - 정의 : React Native에서 사용하는 app 개발용. MemoryRouter - 정의 : URL 기록을 메모리에 유지하는 라우터. 테스트 및 react nat..

react web app에서 router를 이용해 페이지를 이동해보자. 라우터를 사용하기 위해서는 3개의 컴포넌트가 필요합니다. 1. router 컴포넌트 2. route 매칭 컴포넌트 3. navigation 컴포넌트 1. Router 연결 컴포넌트 router란 다수의 네트워크를 연결하는 요소. BrowserRouter, HashRouter... import { BrowserRouter } from "react-router-dom"; ReactDOM.render( , holder ); 2. route 매칭 컴포넌트 경로와 해당 컴포넌트를 매칭 시켜주는 요소. route, switch... 3. navigation 이동 컴포넌트 다른 주소로 이동시켜주는 요소. Link, NavLink... 코드 스플리..

플러그인 : https://www.npmjs.com/package/eslint-plugin-react-hooks eslint-plugin-react-hooks ESLint rules for React Hooks www.npmjs.com 1. 무조건 최상위 레벨에서만 훅을 호출한다. 2. react 함수 내에서만 훅을 호출한다. https://ko.reactjs.org/docs/hooks-rules.html

블로그 이전 https://velog.io/@susu1991/%EC%9D%B4%EC%A0%84%EC%9E%90%EB%A3%8C%EB%B0%B1%EC%97%85-useEffect

ES6에서 도입된 제너레이터(Generator) 함수는 이터러블을 생성하는 함수입니다. 또한 제너레이터 함수는 비동기 처리에 유용하게 사용됩니다.

리덕스 미들웨어의 하나인 리덕스 사가. 리덕스 미들웨어는 dispatch()메소드를 통해 store로 가고 있는 액션을 가로채는 코드. action에 대한 listener이다.

redux를 사용하기 위해 설치할 것들 redux: 리덕스 모듈 react-redux: 리액트 컴포넌트에서 리덕스를 사용하기위한 유용한 도구들이 들어가있습니다. redux-actions: 이 라이브러리를 꼭 설치 할 필요는 없습니다. 단, 알아두면 굉장히 유용합니다. yarn add redux react-redux redux-actions 1. 모듈 만들기 모듈이란 액션, 액션생성함수, 미들웨어, 초깃값, 리듀서함수가 들어있는 파일 1.1 액션타입 정의 // modules/counter.js const INCREASE = 'counter/INCREASE'; 1.2 액션 생성 함수 만들기 // modules/todos.js export const changeInput = (input) => ({ type:..

1. 리덕스란? 리덕스는 상태(state) 관리 라이브러리입니다. 상태들을 전역적으로 만들어서 여기저기서 동일하게 사용가능하도록 해줍니다. 2. 전역 상태관리가 필요한 이유 1) 상태의 전역 관리 리액트는 무조건 부모에서 자식으로 흐르는 단방향으로 진행되며, 그러기 위해서 해당 컴포넌트에서 사용하지 않는 값이라도 자식에게 전달하기 위해 작성해야 하는 상황이 발생합니다. 이는 그 것의 이름이라도 하나 바꾸려면 그 값이 통과하는 모든 곳에서 바꾸어야 하는 매우 비생산적인 활동이 일어나고, 실수할 가능성도 매우 높아집니다. 2) 기능의 재사용성 화면에서 컴포넌트를 만들어서 ui를 재사용하는 것과 같이 state와 연관된 기능들을 재사용 가능하게 되어 활용도가 높아집니다. 3. 사전 개념 리덕스를 사용하기 위해..