1.경로를 설정해줌 Router
path란 뒤에 입력한 값을 이용해서 뒤에 element 값에 접근 할 수 있게해준다!
Path 뒤 변수 파라미터라고함 :id 를 두면 어떤 값이 오더라도 저 아이디로 가지고 있을수 있다
Element = 어디로 갈지
Redux 폴더
Modules= reducer 를 리턴하는 많은 모듈들이 들어간다 . 모듈들이 합쳐져서 스토어를 이루고 스토어를 이루는 많은 모듈들 안에는 스테이트를 관리할 수 있는 설정들이 들어가있다!
리듀서를 호출 할 떄는 디스패치 함수를 이용한다
스테이트를 이용할때는 유즈셀렉터 함수로 가져와서 사용한다
Config - configStore
Const rootReducer = combineReducer({
})
여러 리듀서들을 합쳐서 하나의 루트 리튜어로 만든다!
Const store = createStore( rootReducer )
루트 리듀서를 인자로 받는 스토어를 만들어준다!
만든 루트리듀서를 하나로 합쳐서 스토어를 만들어준다!
Export default store ; <- 만든 store 를 다른 파일에서 임포트 할 수 있도록 한다!
모듈스 안에 리듀스를 만들기
1.action items 를 만든다
휴먼 에러를 방지하기 위해 만드는 것이다 ! 에러를 찾기 힘들다!
2.action create 를 만든다
Export Const add todo = (payload) => {
Return {
Type: addTodo/
Payload:payload, //두가지 프로퍼티를 가진 객체를 리턴한다
}
}
컴포넌트에서 객체를 만들기 위해서 사용되는것이 액션 크리에터이다
dispatchEvent({
type: ADD_TODO,
payload,
})
요런식으로 컴포넌트에 사용하게 된다 리듀서를 호출한다 액션객체라고 한다!
3.initialState 를 만든다
- reducer를 만든다!
액션안에는 타입과 페이로드 객체가 있다!
어떤 타입에 액션이 들어오는지 액션안에있는 타입으로 스위치문을 이용하여
케이스로 나누어 준다! - 만든 reducer export default 해준다!
타입에 맞는 애들을 스위치 문에 맞는 케이스를 찾아서 타입에 맞는 액션들을 실행시켜준다
무조건 인덱스.html에서 아이다가 루트인 곳
루트인곳을 찾아서 크리에이트 루트를하여 루트를 렌더링 해준다
