Etap 5 – planowanie struktury danych
Na tym etapie trzeba zastanowić się nad tym które funkcje będzie realizował JS, a które MySQL. Ważną funkcjonalnością tej aplikacji bazodanowej są filtry. W starej wersji wszystko było napisane w PHP czyli każda operacja wymagała przeładowania strony. Z użyciem Reacta da się tego uniknąć. Aby filtry działały szybko konieczne będzie pobieranie całej tabeli na początku i przechowywanie jej w przeglądarce. React udostępnia kilka metod przechowywania danych. W tym projekcie proponuję:
| Metoda | Zalety | Wady | Kiedy używać? |
|---|---|---|---|
| useState | proste, szybkie | nie jest współdzielony między komponentami | małe stany komponentu |
| useContext | globalny stan | może powodować re-render | globalne dane (np. user, motyw) |
| localStorage | dane nie znikają po odświeżeniu | muszą być ręcznie synchronizowane ze stanem React | przechowywanie ustawień użytkownika |
Etap 6 – implementacja LocalStorage
Zmodyfikuj kod z etapu 4 tak by dane były wyświetlane z localStorage. Oczywiście wcześniej trzeba pobrać dane z bazy MySQL przez API do localStorage.
cdn.
Twój komentarz