# redux-toolkit

86개의 포스트

[React] Redux-toolkit 설치 및 사용방법

Redux를 조금 더 쉽게 사용하기 위해 만든 Redux-toolkit에 대해 알아보려고 한다. 일단은 npm으로 Redux-toolkit을 다운로드 한다. 그리고 메인이 되는 파일(app.jsx 또는 app.tsx)로 가서 아래와 같이 코드를 추가해준다. store 내에 파일은 아래와 같이 구성하면 된다. 위 소스에 대해 설명을 하자면 아래와 같다...

3일 전
·
0개의 댓글
post-thumbnail

기타 설정 및 Redux-toolkit 세팅

Nextjs를 활용한 블로그 형식의 포트폴리오 제작을 진행하며 개인적인 관점에서 느낀점, 기술 기록용으로 작성될 예정입니다:). 흥미 위주로 서술한 만큼 오류가 있을 수 있습니다. 가벼운 마음으로 읽고 지적 해 주실 부분이 있으시다면 언제나 환영입니다! :) 오늘은

4일 전
·
0개의 댓글

redux-toolkit

1. yarn add @reduxjs/toolkit react-redux 2. store만들기 3. state를 가져다 쓸려면 스토어랑 컴포넌트랑 연결해주기 4. slice 생성 초기 상태, 리듀서 함수의,슬라이스 이름을 받아 리듀서 및 상태에 해당하는 액션 생성자와 액션 유형을 자동으로 생성하는 함수 5. 만든 슬라이스를 스토어에 추가해주기 6...

5일 전
·
0개의 댓글
post-thumbnail

💻 TIL 35 | Redux-Toolkit

⚠️ 정리한 내용은 오타나 잘못된 정보가 있을 수 있습니다. 댓글로 알려주시면 감사하겠습니다.

6일 전
·
0개의 댓글
post-thumbnail

reducers vs extraReducers, createAsyncThunk

Redux Toolkit 에서 사용되는 reducers 와 extraReducers 의 차이를 알아보자. stackoverflow 를 참고하였다.reducers 는 액션함수를 생성함과 동시에 해당 액션함수에 대응하는 역할을 한다. extraReducers 는 사용자가

2022년 6월 22일
·
0개의 댓글
post-thumbnail

Redux Toolkit CRUD

redux toolkit 을 이용하여 crud 를 구현해보면서 redux toolkit 에 대해 알아보았다. configureStore 을 이용하여 리듀서들을 간편하게 통합시킬 수 있다.기존과 거의 비슷한 index.js 세팅이 부분이 핵심이다. 기존의 redux 에서

2022년 6월 22일
·
0개의 댓글

[React] Redux-Toolkit 사용하기

Redux Toolkit을 아래 명령어를 입력해 설치한다.만약 기존에 redux가 설치되어 있다면 redux 패키지를 삭제한다.→ Redux Toolkit에 redux가 포함되어 있기 때문스토어 파일로 가서 createSlice 함수를 임포트한 뒤, 속성 객체를 매개변

2022년 6월 18일
·
0개의 댓글

[Redux-toolkit] configureStore, createSlice

redux를 사용하면서reducers 디렉토리에는 많은 파일을 생성해뒀었다..action만 있는 types.jsreducer가 있는 reducer.jsreducer를 combine할 index.js등등..

2022년 6월 6일
·
0개의 댓글

[React] Redux toolkit사용하기

state를 어디서든 사용할 수 있게 해주는 고마운 라이브러리다. 프로젝트 규모가 커질수록 state관리가 지저분해지는데(props -> props -> props...)redux를 사용하면 state를 비교적 깔끔하게 사용 가능하며, 일반 props방식과 다르게 자식

2022년 5월 27일
·
0개의 댓글
post-thumbnail

최고 리덕스야 고맙다! Redux & Redux Toolkit 알아보기

리덕스는 상태 관리 라이브러리 중 하나로, 현재까지 가장 많이 쓰이고 있다. 상태 관리란 UI와 UX에 맞게 데이터를 관리하거나, 서버와 주고 받는 데이터를 관리하는 것을 말한다.간단한 프로젝트라면 괜찮겠지만, 복잡하고 크기가 큰 대형 프로젝트라면 상태 관리의 난도는

2022년 5월 25일
·
0개의 댓글

Redux Toolkit 에서 createAsyncThunk 사용하여 비동기 처리하기

thunk 란? > Thunk 란? 특정 작업을 나중에 할 수 있도록 미루기 위해 함수 형태로 감싼 것 예를 들어 주어진 파라미터에 1을 더하는 작업이 있다면 addOne() 이라는 작업을 1초 뒤에 실행할 수 있도록 addOneThunk 라는 함수로 감쌌는데 이

2022년 5월 24일
·
0개의 댓글
post-thumbnail

Redux-Toolkit을 이용한 dark-mode

리덕스 툴킷을 이용한 다크모드 만들기 스토어 설정 store/store.ts store/themeSlice.ts inititalState 를 localstorage로 불러온다. 스토리지가 비었을 경우 false 할당 액션에 changeMode를 추가하여 tog

2022년 5월 19일
·
0개의 댓글
post-thumbnail

[5/18 TIL] Redux, Rdux Toolkit

새로운 프로젝트에서 리덕스와 리덕스 툴킷을 사용하기 위해서 리덕스에 대해 학습해보았다. 1. Reducx 란? 자바스크립트 앱을 위한 예측 가능한 상태 컨테이너 이다. 2. Redux Toolkit 리덕스 툴킷은 Redux 로직을 작성하기 위해 리덕스에서 공식적으

2022년 5월 18일
·
0개의 댓글
post-thumbnail

Redux-Toolkit을 이용한 TodoList 만들기

redux-toolkit을 이용한 todolist 만들기 configureStore() createStore를 더 좋은 개발 경험을 위해 기본 설정들을 자동화 시켰다. 기본 미들웨어로 redux-thunk를 추가하고 개발 환경에서 리덕스 개발자 도구(Redux Dev

2022년 5월 17일
·
0개의 댓글

👐 TS with Redux(RTK) 👐

타입스크립트 , 리액트 , 리덕스를 같이 사용하는 방법을 알아보자. 탬플릿 사용하기 일일히 타입스크립트 , 리액트 , 리덕스 셋팅을 할 필요없이 Create a React Redux App 템플릿을 사용하면 셋팅이 완료된 템플릿 상태로 프로젝트를 시작할 수 있다.

2022년 5월 14일
·
0개의 댓글

React에 Redux Toolkit 사용하기

Redux Toolkit이란? Redux Toolkit은 redux에서 지원하는 개발 도구이다. 스토어 설정, 리듀서, 데이터 가져오기 등 Redux 로직을 작성하기 위해 권장되는 접근 방식이다. Redux Toolkit의 configureStore는 설정을 단순화하

2022년 5월 12일
·
0개의 댓글
post-thumbnail

[React]Redux-toolkit 사용법

store middleware등의 환경을 건들지 안고 바로 적용할 수 있는 방식redux-actions에서 제공하고 있던 createAction()과 같은 방식으로 작동한다.기존의 Action creator를 세부적으로 만들 필요 없이 actionCreator를 통해서

2022년 5월 9일
·
0개의 댓글
post-thumbnail

redux와 Redux Toolkit (rtk)

Redux Toolkit을 사용하여 redux를 쓰는 방법을 간단하게 알아보았다.

2022년 5월 7일
·
0개의 댓글
post-thumbnail

[실전프로젝트] get과 post

카드를 누르면 디테일정보를 가져와서 뿌려주는 기능구현중에 get과 post에 대해 헷갈려서 정리한다.GET은 서버로부터 정보를 조회하기 위해 설계된 메서드요청을 전송할 때 필요한 데이터를 Body에 담지 않고 쿼리스트링을 통해 전송. 만약 요청 파라미터가 여러개면 &

2022년 5월 6일
·
0개의 댓글

redux, react에 대한 생각

react 는 결국 한 페이지 태그안에 태그안에 태그로 구성되어있는데 프롭이 상위컴포넌트에서 하위컴포넌트로 내려올 수 밖에 이유는 Scope 변수의 영역 때문인데하위컴포넌트 변수의 값이 하위 컴포넌트 밖에 상위컴포넌트에는 존재할 수 없기 때문에, 범위가 닿지 않기 때문

2022년 5월 2일
·
0개의 댓글