S
senior-frontend
Comprehensive frontend development skill for building modern, performant web applications using ReactJS, NextJS, TypeScript, Tailwind CSS. Includes component scaffolding, performance optimization, bundle analysis, and UI best practices. Use when developing frontend features,
Installation
Pick a client and clone the repository into its skills directory.
Installation
About this skill
Comprehensive frontend development skill for building modern, performant web applications using ReactJS, NextJS, TypeScript, Tailwind CSS. Includes component scaffolding, performance optimization, bundle analysis, and UI best practices. Use when developing frontend features, optimizing performance, implementing UI/UX designs, managing state, or reviewing frontend code.
How to use
- Zainstaluj umiejętność w swoim projekcie, klonując repozytorium z GitHub i umieszczając folder w katalogu skills swojego agenta Claude'a. 2. Przejdź do głównego katalogu projektu frontendowego, w którym chcesz pracować. 3. Aby wygenerować nowy komponent, uruchom generator komponentów z ścieżką do projektu — narzędzie automatycznie utworzy strukturę komponentu zgodnie z najlepszymi praktykami React i TypeScript, z wbudowanymi kontrolami jakości. 4. Aby przeanalizować rozmiar bundla i uzyskać rekomendacje optymalizacyjne, użyj analizatora bundli wskazując ścieżkę do docelowego pliku — otrzymasz metryki wydajności i sugestie automatycznych poprawek. 5. Dla nowych projektów lub pełnej reorganizacji struktury użyj scaffoldera frontendowego, który przygotuje gotową do produkcji konfigurację z integracją narzędzi i best practices. 6. Zapoznaj się z dokumentacją referencyjną w folderze references, gdzie znajdziesz wzorce React, przewodniki optymalizacji Next.js oraz przykłady kodu dla rzeczywistych scenariuszy.