목록전체 글 (202)
hmk run dev
일단 리덕스모듈과 그것을 담아줄 스토어를 만들어야한다 schedule.js //Action 액션의 변수는 전부 대문자 약속~ //모듈명 소문자 액션명 대문자 //우리가 만든기낭 스케줄 띄워주는거 = load/ 스케줄 만드는것 create const LOAD = "schedule/LOAD"; const CREATE = "schedule/CREATE"; const initialState = { list: ["영화관 가기", "매일 책읽기", "수영 배우기"], //맨처음 state 초기값 }; //Action Creator //액션 생성 함수는 액션을 반환해줘야 하는 함수다 //액션 생성 함수는 컴포넌트들에게서 불러와야한다 export //export는 export default와 다르게 import시 중괄..
history 리액트에서 페이지를 이동할 수 있는 이유는 react-router-dom을 이용하여 페이지의 기록을 알 수 있기 때문이다. 아래 샘플 코드의 App.js에서와 같이 Router로 컴포넌트의 Path와 라우팅할 컴포넌트를 정해줄 수 있는데, 해당하는 라우터는 props를 통해 history 객체를 전달받게 된다. history 객체를 콘솔로 찍어보면 아래와 같이 goBack(), goForward() 등 앞/뒤로 이동할 수 있는 메소드 뿐만 아니라 다양한 메소드와 관련 객체들이 존재한다. 이 중 라우팅 변경을 위해 가장 빈번히 사용되는 메소드가 push()인데, history.push('이동하고자 하는 path') 를 통해 원하는 컴포넌트로 이동이 가능하다. >> history 객체를 pro..
1. 파이어 스토어 데이터를 리덕스 스토어에 넣려면 "미들웨어"를 설치해야 함 yarn add redux-thunk로 미들웨어 설치 미들웨어는 뭘까? 리덕스는 데이터를 수정할 때 디스패치라는 것을 사용해 액션을 감시했다. > 액션이 디스패치가 됐다면 리듀서가 처리를 했다. > 액션이 디스패치 처리 > 리듀서에서 처리 파이어 스토어에 데이터 요청 > 파이어 베이스는 데이터를 준다 > 기다려야 함 (여기서 미들웨어 작동) 미들웨어는 리듀서에서 처리하기 전에 사전작업을 할 수 있게 도와주는 중간다리 역할 redux-thunk는 객체 대신 하수를 생성하는 액션 생성 함수를 작성할 수 있게 해 줍니다! >> 액션 생성 하수 액션 크리에이터를 작성할 수 있게 도와준다. >> 왜 필요하지? 리덕스는 기본적으로 액션 ..