7 umiejętności Claude Code, które podnoszą jakość kodu tworzonego z AI #EN357
Adam Michalski
24 grudnia 2025
TL;DR
- Modele językowe domyślnie generują kod „prawdopodobny”, oparty na statystyce zamiast na zasadach poprawnej architektury. Przekłada się to na błędy, słabe doświadczenie użytkownika i problemy ze skalowaniem.
- Skills wstrzykują ekspertyzę do głównego okna kontekstowego, co odróżnia je od custom commands i sub-agentów.
- Frontend Design Skill (oficjalny plugin Anthropic) eliminuje typowy problem estetyki w aplikacjach tworzonych z AI.
- Biblioteka Obra Superpowers oferuje sekwencyjny przepływ brainstorming → plan, wymuszający przemyślenie projektu przed kodowaniem.
- Prompt Engineering Skill analizuje wywołania modeli i generuje raport z rekomendacjami optymalizacji.
- Skills do projektowania API i tabel Postgres zapobiegają błędom architektonicznym ujawniającym się przy skalowaniu.
- Eksperci tworzący skills pozostaną niezbędni nawet wtedy, gdy AI przejmie pisanie kodu.
Pułapka vibe codingu
Największy problem vibe codingu dla osób bez doświadczenia inżynierskiego polega na braku wiedzy o tym, co sprawia, że kod jest dobry. Wielu początkujących zakłada, że Claude Code sam wystarczy do budowania świetnych aplikacji. To jednak pułapka.
Modele językowe domyślnie nie piszą dobrego kodu. Generują kod „prawdopodobny” (plausible) oparty na statystyce tego, co przeczytały, a nie na zasadach poprawnej architektury. W rezultacie taki kod zamienia się w błędy, fatalny interfejs i produkty, których nikt nie chce używać.
Skills pozwalają obejść ten problem, ponieważ wstrzykują specjalistyczną wiedzę ekspertów bezpośrednio do agenta.
Trzy narzędzia, trzy zastosowania
Autor wyjaśnia fundamentalne rozróżnienie między trzema mechanizmami Claude Code:
| Mechanizm | Zastosowanie |
|---|---|
| Custom command | Wielokrotnie używany prompt, sekwencja kroków |
| Sub-agent | Izolowany problem wymagający osobnego kontekstu |
| Skill | Ekspertyza potrzebna w głównym oknie roboczym |
Wybór między sub-agentem a skillem zależy od charakteru zadania. Autor udostępnia prompt pomagający podjąć tę decyzję.
Warto przy tym pamiętać, że skills można również wywoływać wewnątrz sub-agentów. Otwiera to możliwości kompozycji: sub-agent z izolowanym kontekstem, ale wyposażony w specjalistyczną ekspertyzę.
Frontend Design Skill: koniec z brzydkimi interfejsami
Najczęstsza skarga subskrybentów dotyczy walki z estetyką i doświadczeniem użytkownika aplikacji. Poza klonowaniem istniejących designów (np. z Mobin) trudno zbudować coś, co faktycznie dobrze wygląda.
Frontend Design Skill to oficjalny plugin Anthropic. Instalacja przebiega przez /plugin → Claude plugins → browse → frontend design.
W demonstracji autor użył prostego promptu do przebudowy narzędzia do tworzenia miniaturek (zbudowanego z Nano Banana Pro). Określił kierunek stylistyczny: nowoczesny, ale spartański, jak wnętrze Tesli, z akcentami kolorystycznymi i łagodny dla oczu jak interfejs Claude.
Efekt obejmował zmieniony widok galerii, animacje przy najechaniu kursorem, przeprojektowany edytor z czystymi elementami UI oraz przebudowaną stronę ustawień. Wszystko powstało z podstawowego promptu, który można dalej dopracowywać.
Skill do tworzenia skills
Naturalne pytanie po odkryciu mocy skills brzmi: czy można tworzyć własne, oparte na swoich procesach?
Autor biblioteki Superpowers przygotował skill specjalnie do tego celu. Co ciekawe, podejście opiera się na analogii do test-driven development. Tworzenie skills przypomina tworzenie testów.
Praktyczny przykład to skill do generowania changelogów. Założenie: przy każdej znaczącej zmianie system automatycznie tworzy changelog (w wersji dla deweloperów lub klientów). Proces obejmuje wywołanie narzędzia do tworzenia skills, wygenerowanie nowego skilla i gotowy changelog generator do użycia przy commitach.
Obra Superpowers: brainstorming i planowanie
Biblioteka Obra Superpowers to zbiór skills specyficznych dla Claude Code. Autor przyznaje wprost: całkowicie zmieniła jego sposób pracy z narzędziem.
Biblioteka zawiera wiele wartościowych skills, m.in. systematic debugging skill wymieniany jako jeden z ulubionych. Dwa kluczowe skills działają jednak sekwencyjnie i tworzą spójny przepływ pracy.
Brainstorming Skill
Uruchamia się przy każdej nowej funkcji lub modyfikacji. Rozbija proces na etapy: zrozumienie idei, wypracowanie podejść, prezentacja dokumentacji z rekomendacją.
Skill zadaje pytania wyjaśniające:
- Skąd będą pochodzić dane?
- Jak trafią do systemu?
- Jak wpłyną na przyszłe generacje?
- Jakie kryteria określają sukces?
- Jakie są kompromisy każdej opcji?
Przy każdym pytaniu prezentuje zależności. Więcej obrazów oznacza więcej tokenów, a to przekłada się na wyższe koszty. Takie podejście wymusza świadome decyzje przed pisaniem kodu.
W demonstracji autor budował funkcję trenowania generacji miniaturek na podstawie danych o wydajności (współczynnik klikalności, wyświetlenia). Skill od razu zapytał o źródło danych. Odpowiedź: ręczne wprowadzanie, bo YouTube nie udostępnia tych danych przez API. Zamiast ryzykownego scrapingu autor wybrał prostsze rozwiązanie. To przykład dojrzałości inżynierskiej: celowa rezygnacja z automatyzacji na rzecz stabilności.
Writing Plan Skill
Po zatwierdzeniu designu automatycznie przechodzi do planowania. Tworzy szczegółowy plan implementacji: endpointy, modele danych, integracje API, zmiany UI, obsługa przypadków brzegowych. Plan zawiera wszystko potrzebne do wdrożenia, włącznie z testami.
Autor podkreśla, że plan jest obszerny i pokrywa kompletny zakres prac.
Prompt Engineering Skill
Dla wszystkich, którzy twierdzą, że prompt engineering umarł: autor odpowiada, że najwyraźniej nie budują aplikacji wymagających dobrego promptowania.
Skill analizuje wywołania modeli w aplikacji i generuje raport z rekomendacjami. W demonstracji przeanalizował wywołania Gemini odpowiedzialne za generowanie miniaturek.
Raport zawiera:
- Listę problemów z priorytetami
- Konkretne rekomendacje naprawy
- Porównanie obecnego promptu z zalecaną strukturą
Obecny prompt opierał się na przekazywaniu user promptu bez zmian. Rekomendacja wskazywała na bardziej ustrukturyzowaną formę dającą spójniejsze wyniki. Autor komentuje: wszystkie te zmiany naprawdę znacząco ulepszyłyby aplikację.
API Design Skill
Skill służy do projektowania backendowych API w sposób zgodny z najlepszymi praktykami.
Demonstracja obejmowała migrację aplikacji bez REST API do pełnego REST API. Skill automatycznie eksploruje całą bazę kodu, decyduje o zmianach i planuje migrację.
Efektem jest szczegółowy plan migracji zawierający wszystkie endpointy, modele użytkowników, modele danych, a nawet architekturę kolejki zadań (job queue). Autor podkreśla wysoki poziom szczegółowości dokumentu.
Kluczowa zaleta polega na możliwości skonfigurowania automatycznego wywołania skilla przy każdej pracy z backendem. Agent dostaje najlepsze praktyki wstrzyknięte w momencie startu.
Przy okazji autor komentuje dyskusje o zastępowaniu programistów przez AI: zawsze będą potrzebni ludzie budujący tego typu ekspertyzę, którą inni mogą wykorzystać.
Postgres Table Design Skill
Ten skill ugruntował przekonanie autora o wartości całego podejścia. Problem polega na tym, że osoby praktykujące vibe coding robią rzeczy przy Supabase, które zemszczą się przy skalowaniu i napływie użytkowników.
Praktyczne zastosowanie obejmuje wzięcie planu migracji REST API i przepuszczenie przez Postgres skill. System analizuje plan i aktualizuje go pod kątem najlepszych praktyk projektowania tabel.
Efektem są nowe sekcje w planie ze szczegółowymi zmianami w designie bazy danych. Projekt przeszedł z poziomu podstawowego do gotowości na rzeczywiste użycie.
Autor podsumowuje: rezygnacja z tego skilla przy vibe codingu byłaby głupotą.
Error Handling Skill
Ostatni, ale równie ważny. Lepsze błędy pomagają nie tylko programiście. Gdy błędy są bardziej kontekstowe i sensowne, model naprawia problemy znacznie szybciej. W rezultacie cały przepływ pracy staje się płynniejszy.
Skill oferuje:
- Filozofie obsługi błędów
- Kategoryzację typów błędów
- Porady specyficzne dla języka (Python, JavaScript)
- Wzorce architektoniczne: circuit breakers, logika ponawiania, łagodna degradacja
Demonstracja obejmowała analizę hooków frontendowych odpowiedzialnych za generowanie postaci, edycję i przechowywanie danych. Skill stworzył współdzielony moduł obsługi błędów i poprawił wzorce logowania we wszystkich plikach.
Checklista: przed kodowaniem nowej funkcji
Na podstawie pytań z Brainstorming Skill:
- Skąd będą pochodzić dane? (API, ręczne wprowadzanie, scraping)
- Jak dane trafią do systemu?
- Jak wpłyną na przyszłe działanie aplikacji?
- Jakie kryteria określają sukces funkcji?
- Jakie są kompromisy każdego podejścia? (koszty, tokeny, złożoność)
- Jakie zmiany w modelu danych będą potrzebne?
- Jak UI będzie wspierać tę funkcję?
- Jak obsłużyć przypadki brzegowe i błędy?
Checklista: vibe coding według standardów inżynierskich
Podsumowanie całego procesu:
- Czy przeprowadziłeś fazę brainstorming i rozstrzygnąłeś dylematy dotyczące źródeł danych?
- Czy posiadasz zatwierdzony, szczegółowy plan implementacji?
- Czy schemat bazy danych został zweryfikowany pod kątem skalowalności?
- Czy wdrożyłeś profesjonalne wzorce obsługi błędów (np. circuit breakers)?
- Czy nadałeś aplikacji konkretny kierunek wizualny i estetyczny?
Biblioteka promptów z materiału
| Komenda / Prompt | Kiedy stosować | Cel |
|---|---|---|
/plugin |
Na starcie nowego projektu | Instalacja niezbędnych skills i narzędzi eksperckich |
Use this front end design skill. Help me revamp the front end. The general feel should be like [KIERUNEK], yet kind of [DRUGI ELEMENT]. |
Gdy wygląd aplikacji jest mało atrakcyjny | Wymusza zastosowanie nowoczesnej estetyki i zaawansowanych bibliotek |
I want to build this new feature that [OPIS]. And it uses that to [CEL] so that we can get [REZULTAT]. |
Przed rozpoczęciem kodowania nowej funkcji | Aktywuje proces analizy architektury i potencjalnych problemów z danymi |
Look through the last [LICZBA] commits from this project and generate me a changelog entry. |
Po zakończeniu sprintu lub przed releasem | Automatyczne generowanie wykazu zmian |
Use the prompt engineering pattern skill to analyze my [PROVIDER] calls and provide recommendations. |
Gdy AI wewnątrz aplikacji daje niespójne wyniki | Audyt i poprawa jakości promptów przesyłanych do modeli |
Use the postgres table design skill and update our [NAZWA PLANU] based on the postgres skills. |
Po stworzeniu planu architektury, przed implementacją | Weryfikacja schematu bazy pod kątem skalowalności |
Look at our [ŚCIEŻKA], and then use the error handling skill to improve error handling in those files. |
Gdy aplikacja wymaga większej stabilności | Wdrożenie profesjonalnych zabezpieczeń i poprawa diagnostyki błędów |
Dlaczego eksperci pozostaną niezbędni
Przewijający się motyw w materiale wskazuje, że skills nie eliminują potrzeby ekspertów. Wręcz przeciwnie.
Ktoś musi tworzyć te skills. Ktoś musi wiedzieć, jak projektować API, które się skaluje. Jak strukturyzować tabele w Postgres. Jak pisać prompty dające spójne wyniki.
Skills demokratyzują dostęp do tej wiedzy. Osoba praktykująca vibe coding bez doświadczenia backendowego może budować aplikacje zgodne z najlepszymi praktykami. Te praktyki musiał jednak ktoś najpierw zdefiniować.
Autor podsumowuje: nawet te siedem skills znacząco poprawi jakość tego, co budujesz. To dopiero początek tego, co jest dostępne.
Gdzie znaleźć opisane skills
- Frontend Design Skill: oficjalne pluginy Anthropic (
/plugin→ Claude plugins) - Pozostałe skills: Obra Superpowers Marketplace (
/plugin→ marketplaces → Obra Superpowers) - Prompty, szablony, przepływy pracy: darmowa społeczność vibe coding autora (link w opisie oryginalnego wideo)
Kluczowy insight
Błędy piszesz dla AI, nie dla siebie
Standardowo myślimy: Obsługa błędów służy programiście. Komunikaty piszemy, żeby wiedzieć, co poszło nie tak podczas debugowania.
W praktyce okazuje się, że: Gdy błędy są bardziej kontekstowe i sensowne, model językowy naprawia problemy znacznie szybciej. Obsługa błędów stanowi pętlę zwrotną dla AI, nie tylko dla człowieka.
Dlaczego to jest istotne: Zmienia to całkowicie podejście do pisania obsługi błędów. Zamiast generycznego komunikatu „Error: something went wrong” warto pisać komunikaty, które AI może zinterpretować i użyć do naprawy. To inwestycja zwracająca się przy każdym kolejnym debugowaniu z pomocą modelu.
Test na jutro: Następnym razem gdy piszesz obsługę błędu, zamiast generycznego komunikatu dodaj kontekst: co funkcja próbowała zrobić, jakie dane otrzymała, dlaczego mogło się nie udać. Potem poproś Claude Code o naprawę i porównaj, ile iteracji zajmie naprawa w porównaniu do standardowych błędów.
Ten wpis jest częścią mojej kolekcji notatek z ciekawych podcastów, webinarów i innych treści, które uważam za wartościowe i do których sam chcę wracać. Jeśli chcesz sprawdzić oryginalne źródło, znajdziesz je tutaj: 7 CLAUDE CODE Skills Every Beginner NEEDS To Master
