Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision		Révision précédente
front:stockage_de_donnees [2025/09/29 15:12] – [Monter son Redux store] paolofront:stockage_de_donnees [2025/09/29 16:42] (Version actuelle) – [Utiliser les actions] paolo
Ligne 11: Ligne 11:
   * ''localStorage'' qui conserve les données même après la fermeture du navigateur   * ''localStorage'' qui conserve les données même après la fermeture du navigateur
   * ''IndexedDB'' qui constitue une base de données côté client sans limite de temps   * ''IndexedDB'' qui constitue une base de données côté client sans limite de temps
 +
  
 ### Monter son Redux store ### Monter son Redux store
Ligne 108: Ligne 109:
 ### Utiliser l'état global ### Utiliser l'état global
  
-Pour récupérer l'état global, **React-redux** met à disposition ''useSelector''.+Pour récupérer l'état global, **react-redux** met à disposition ''useSelector''.
  
-Maintenant qu'on a les moyens de savoir si une session est ouverte, reprenons nos composants ''PublicRoutes'' et ''PrivateRoutes'' et remplaçons cette condition "test".+Maintenant que nous avons les moyens de savoir si une session est ouverte, reprenons nos composants ''PublicRoutes'' et ''PrivateRoutes'' et remplaçons cette condition "test".
  
 ``` ```
 +// src/components/app/Router/PublicRoutes/index.jsx
 +
 import { Outlet, Navigate } from "react-router-dom"; import { Outlet, Navigate } from "react-router-dom";
 import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
Ligne 123: Ligne 126:
 ``` ```
 ``` ```
 +// src/components/app/Routes/PrivateRoutes/index.jsx
 +
 import { Outlet, Navigate } from "react-router-dom"; import { Outlet, Navigate } from "react-router-dom";
 import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
Ligne 133: Ligne 138:
 ``` ```
  
-Vous êtes maintenant bloqué sur la page **Login**. Mais tout va bien ! Nous allons essayer de nous connecter.+Nous sommes maintenant bloqués sur la page **Login** car aucune session n'est stockée (personne n'est authentifiée). 
 +.
 ### Utiliser les actions ### Utiliser les actions
  
Ligne 139: Ligne 145:
  
 ``` ```
 +// src/components/pages/Login/index.jsx
 +
 import { Input } from "../form/Input"; import { Input } from "../form/Input";
 import { useDispatch } from "react-redux"; import { useDispatch } from "react-redux";
 import { setSession } from "../../../redux"; import { setSession } from "../../../redux";
 +import { API_URL } from "../../../utils/constants/vite";
  
 export const Login = () => { export const Login = () => {