https://github.com/shopot/todo-app-redux

Todo App for step-by-step migrating from base Redux to RTK Query
https://github.com/shopot/todo-app-redux

Last synced: 8 days ago
JSON representation

Todo App for step-by-step migrating from base Redux to RTK Query

• Host: GitHub
• URL: https://github.com/shopot/todo-app-redux
• Owner: shopot
• Created: 2023-12-01T20:29:40.000Z (12 months ago)
• Default Branch: main
• Last Pushed: 2023-12-24T11:45:14.000Z (11 months ago)
• Last Synced: 2023-12-25T11:25:30.483Z (11 months ago)
• Language: TypeScript
• Homepage:
• Size: 542 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Todo App Redux

Todo App for step-by-step migrating from base Redux to RTK Query

* [1. Модуль Redux Base](#1-модуль-redux-base)

* [2. Модуль Redux Thunk](#2-модуль-redux-thunk)

* [3. Модуль Redux Toolkit and Thunks](#3-модуль-redux-toolkit-and-thunks)

## 1. Модуль Redux Base

`Уровень: Junior`

### В данном модуле необходимо изучить:

* Redux base

* Principles of Redux

* Core Concepts

  * State

  * Actions

  * Reducer

  * Store

* Action Creators

* Developer Tools

* Redux & TypeScript

### Теория

* [Знакомство с Redux](https://github.com/shopot/react-101/tree/redux-base)

  Доп. ссылки на теорию

* [Redux Base](https://handsonreact.com/docs/redux)

* [Redux Tutorial: An Overview and Walkthrough](https://www.taniarascia.com/redux-react-guide/)

* [Простое соглашение об именах для Action Creators](https://decembersoft.com/posts/a-simple-naming-convention-for-action-creators-in-redux-js/)

* [Flux Standard Action](https://github.com/redux-utilities/flux-standard-action)

* [Redux & TypeScript](https://handsonreact.com/docs/redux-typescript)

* [Типизация Root State и Dispatch](https://redux.js.org/usage/usage-with-typescript#define-root-state-and-dispatch-types)

* [Типизация useDispatch и useSelector](https://redux.js.org/usage/usage-with-typescript#define-typed-hooks)

* [Использование типизированных хуков в компонентах](https://redux.js.org/usage/usage-with-typescript#use-typed-hooks-in-components)

* [Redux DevTools Extension](https://github.com/reduxjs/redux-devtools/tree/main/extension#installation)

* [Getting Redux DevTools to Work with TypeScript](https://www.mydatahack.com/getting-redux-devtools-to-work-with-typescript/)

### Задание

Необходимо выполнить задание [Redux Base](./redux-base.md)

## 2. Модуль Redux Thunk

`Уровень: Junior`

### В данном модуле необходимо изучить:

* Redux Middleware

* Redux Thunk

* Thunk functions

* Thunk action creators

* Redux Thunk & TypeScript

### Теория

* [Знакомство с Redux](https://github.com/shopot/react-101/tree/redux-base)

  Доп. ссылки на теорию

* [Redux Thunk (handsonreact.com)](https://handsonreact.com/docs/redux-thunk)

* [React Redux Thunk (handsonreact.com)](https://handsonreact.com/docs/react-redux-thunk)

* [Thunk middleware for Redux (redux-thunk)](https://github.com/reduxjs/redux-thunk)

* [Redux Thunk Explained with Examples (freecodecamp.org)](https://www.freecodecamp.org/news/redux-thunk-explained-with-examples/)

* [Redux: Writing Logic with Thunks (redux.js.org)](https://redux.js.org/usage/writing-logic-thunks)

### Задание

Необходимо выполнить задание [Redux Thunk](./redux-thunk.md)

## 3. Модуль Redux Toolkit and Thunks

`Уровень: Junior`

### В данном модуле необходимо изучить:

* Basics Redux Toolkit

* Redux State Slice

* Redux State and Actions

* Async request lifecycles

* Basics usage createAsyncThunk

* Redux Toolkit & TypeScript

### Теория

* [Знакомство с Redux (react-101)](https://github.com/shopot/react-101/tree/redux-base)

* [Знакомство с Redux Toolkit (react-101)](https://github.com/shopot/react-101/tree/redux-toolkit-quick)

  Доп. ссылки на теорию

* [Redux Toolkit Quick Start (redux.js.org)](https://redux-toolkit.js.org/tutorials/quick-start)

* [createSlice (redux.js.org)](https://redux-toolkit.js.org/api/createSlice)

* [createAsyncThunk (redux.js.org)](https://redux-toolkit.js.org/api/createAsyncThunk)

* [📺 Асинхронная работа с Redux Toolkit и createAsyncThunk (youtube.com)](https://www.youtube.com/watch?v=6RTbC8Acj1M)

* [Mastering Async Actions within createAsyncThunk in Redux Toolkit](https://blog.stackademic.com/mastering-async-actions-within-createasyncthunk-in-redux-toolkit-382af0eaae57)

### Задание

Необходимо выполнить задание [Redux Toolkit and Thunks](./redux-toolkit-thunks.md)