모카 스터디 썸네일형 리스트형 github 커밋한 push 원격에서 삭제하기 1. git log 에서 커밋할 commit 확인 2. git reset을 통해 commit 삭제하기 example git reset HEAD^ 3. git push -f origin main // 깃허브에 삭제한 커밋알려주기 더보기 Redux Toolkit Persist [John Ahn] Redux-Persist 리덕스 스토어에 있는 State들은 페이지를 새로고침하면 초기화되는 것을 볼 수 있다. 하지만 Redux Persist를 이용하면 페이지 새로고침 후에도 상태를 유지할 수 있게 된다. npm i redux-persist . 더보기 Redux Toolkit [John Ahn] Redux Toolkit npm install @reduxjs/toolkit react-redux React에 Redux 스토어 제공 저장소가 생성되면 src/index.js에서 애플리케이션 주위에 React-redux를 배치하여 React 구성요소에서 사용할 수 있도록 할 수 있다. 방금 만든 Redux 저장소를 가져오고 주위에 를 배치하고 저장소를 props로 전달한다. Redux State Slice 생성 src/fetures/counter/counterSlice.js라는 새파일을 추가하고 createSlice API 를 가져온다. 스토어에 Slice Reducer 추가 이미 스토어와 리두서를 생성해줬기 떄문에 스토어에 리듀서 함수를 추가해 준다. 리듀서 매개변수 내부에 필드를 정의함으로써 스토어에.. 더보기 Redux Toolkit [생활코딩] 리덕스 툴킷의 등장 이유 및 배경 1. 리덕스를 사용하려면 설정할것이 너무 많다. 2. 미들웨어의 설정과 설치가 어렵다. 3. 반복되는 코드가 너무 많다. 4. 불변성 유지의 어려움 Redux Toolkit Thunk 동기적인 처리는 reducers를 사용하고 비동기적인 처리는 extraReducers를 사용 더보기 리덕스 로깅 미들웨어 및 비동기 Redux Thunk 액션을 전달하고 (dispatch) 리듀서에 도달하는 순간 사이에 사전에 지정된 작업을 실행할 수 있게 해주는 중간자. 로깅, 충돌보고, 비동기 API 와 통신, 라우팅 등등 비동기 API를 위한 미들웨어 Thunk '일부 지연된 작업을 수행하는 코드 조각' 지금 당장 논리를 실행하는 대신 나중에 작업을 수행하는데 사용할 수 있는 함수 thunk 없이 사용해도 괜찮지만 미들웨어는 중앙 집중식 접근 방식이므로 구성요소를 더 간단하고 일반화하고 한곳에서 데이터 흐름을 제어 할 수 있어 큰 앱에서 리덕스를 사용하기 더 편해진다. 비동기 작업 관리: Thunk는 Redux에서 비동기 작업을 관리하기에 좋은 방법이다. Redux는 동기 작업을 다루는 데는 효과적이지만 비동기 작업은 Thunk를 사용하여 쉽게 처리.. 더보기 리덕스 최종 개념 정리 왜 쓰는가? 1.pros 문법 귀찮을 떄 모든 컴포넌트가 props 없이 state를 stroe에서 직접 꺼낼 수 있다. 2. 상태 관리 위해서 리듀서 : state 수정 방법에 대한 요청(action)을 가지고 있다. 초 간단 redux (애플코딩) ----------------------------------------------------------- 컴포넌트들은 요청만할 수 있게 코드를 작성 ----------------------------------------------------------- 컴포넌트에 state 수정 요청을 하려면? dispatch를 사용(인자로 action을 줌) state의 수정 방법 : reducer ACTION ==> 수행하는 작업의 유형을 지정하는 type 속성,.. 더보기 slug,Routin src가 없는 pages가 먼저 우선순위를 가진다. 오른쪽위와 같이 베이스 url을 설정하여 import시 ..을 줄이수 있다. 페이지 안에서 구현한 slug가 우선시 된다. 그래서 뒤에있는 slug는 무시가 된다. 쿼리는 둘다 넘어 온다. [Shallow Routing ] [API Routes] 더보기 Data Fectching, Layouts, Pages, Image ssg는 빌드시에 미리 파일을 생성해서 그걸 웹브라우저에서 보여준다. => 서버에 부하 없이 제공 가능하다. 더보기 이전 1 2 3 4 ··· 16 다음
