https://github.com/danretegan/task-manager-redux
Redux
https://github.com/danretegan/task-manager-redux
createstore react redux
Last synced: about 1 month ago
JSON representation
Redux
- Host: GitHub
- URL: https://github.com/danretegan/task-manager-redux
- Owner: danretegan
- Created: 2024-03-24T11:00:05.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-03-26T07:01:17.000Z (about 2 years ago)
- Last Synced: 2025-01-03T00:34:12.845Z (over 1 year ago)
- Topics: createstore, react, redux
- Language: JavaScript
- Homepage: https://danretegan.github.io/task-manager-redux/
- Size: 207 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# React Redux:
## 1. Definirea acțiunilor:
Se definesc acțiunile pe care dorim să le facă aplicația: `addTask`, `deleteTask`, `toggleCompleted`, `setStatusFilter`. Aceste acțiuni sunt obiecte JavaScript care descriu evenimentele care au loc în aplicație și sunt definite ca constante pentru a le face ușor de referit și gestionat. Aceste acțiuni comunică schimbările de stare și evenimentele către reduceri sau alte părți ale aplicației. Vezi fișierul `actions.js`.
## 2. Crearea reducerilor:
Se creează reducerii, care sunt funcții pure. Reducerii preiau starea curentă și o acțiune și returnează o nouă stare în funcție de acțiunea primită. Aceste funcții reducer sunt responsabile pentru actualizarea stării aplicației în funcție de acțiunile care au loc. Vezi fișierul `reducers.js`.
## 3. Crearea selectorilor:
Se definesc selectorii pentru a extrage și deriva date din starea globală a aplicației Redux. Selectorii sunt funcții pure care preiau starea Redux și returnează date specifice necesare componentelor React pentru afișare sau alte scopuri. Aceștia pot ajuta la gestionarea formei și structurii stării, la optimizarea performanței și la abstractizarea detaliilor de implementare. Vezi fișierul `selectors.js`.
## 4. Crearea store-ului Redux:
Se creează un magazin Redux (store) care combină reducerii și definește starea inițială a aplicației. Acesta este responsabil pentru gestionarea întregii stări a aplicației și distribuirea acțiunilor către reduceri pentru a actualiza starea. Vezi fișierul `store.js`.
## 5. Conectarea componentelor React la store:
Componentele React sunt conectate la magazinul Redux (store) pentru a accesa starea aplicației și pentru a trimite (dispatch) acțiuni către store atunci când este necesar. Vezi fișierul `App.jsx`.
## Concluzie:
În această schemă, `acțiunile` sunt trimise la `store` folosind funcția `dispatch`, iar `starea` aplicației este accesată folosind hook-ul `useSelector`. Aceasta este o modalitate simplificată de a descrie modul în care `Redux` poate fi utilizat într-o aplicație `React` pentru a gestiona starea și funcționalitatea aplicației.