react-modernization
Modernizuj aplikacje React: aktualizuj wersje, migruj komponenty klasowe na hooki i włącz funkcje współbieżne.
Instalacja
Wybierz klienta i sklonuj repozytorium do odpowiedniego katalogu skilli.
Instalacja
O skillu
Umiejętność do automatycznego ulepszania kodu React. Przeprowadź aplikację przez kolejne wersje (16 → 17 → 18), zamień komponenty klasowe na funkcyjne z hookami, a następnie włącz współbieżne renderowanie i Suspense. Narzędzie obsługuje codemody do refaktoryzacji, modernizuje zarządzanie stanem i wspiera migrację na TypeScript. Idealne dla zespołów utrzymujących starsze bazy kodu React.
Jak używać
Zidentyfikuj bieżącą wersję React w swoim projekcie i określ docelową wersję (17, 18 lub najnowszą). Umiejętność wspiera ścieżkę uaktualnień React 16 → 17 → 18 z uwzględnieniem zmian łamiących zgodność w każdej wersji.
Przygotuj listę komponentów klasowych, które chcesz migrować na komponenty funkcyjne. Umiejętność pokaże ci, jak zamienić state zarządzany przez konstruktor i setState na hooki useState, oraz jak przenieść logikę z metod cyklu życia na useEffect.
Zastosuj codemody do automatycznej transformacji kodu. Umiejętność dostarcza gotowe wzorce refaktoryzacji — na przykład konwersji event delegation po zmianach w React 17, usunięcia event pooling, czy dostosowania czasu czyszczenia efektów.
Zaktualizuj konfigurację JSX, jeśli przechodzisz na React 17+. Nowa transformacja JSX nie wymaga importu React w każdym pliku — umiejętność wskaże, gdzie można usunąć zbędne importy.
Włącz funkcje współbieżne dostępne w React 18+: automatic batching, Suspense na serwerze i nowe API root. Umiejętność wyjaśni, jak te zmiany wpływają na Strict Mode i renderowanie.
Przetestuj aplikację pod kątem zmian zachowania, szczególnie w zakresie podwójnego wywoływania efektów w Strict Mode i nowego API renderowania. Umiejętność wspiera też modernizację wzorców zarządzania stanem i migrację na TypeScript.