Tworzenie bloków Gutenberg z użyciem ChatGPT.

Zobacz kurs

Podstawy AWS.

Automatyzacja procesów z Make.com

WordPress z AI i Model Context Protocol

WordPress z AI i Model Context Protocol

Nowy plugin Secure Custom Fields i konflikt na horyzoncie

Nowy plugin Secure Custom Fields i konflikt na horyzoncie

Przyszłość projektowania w WordPressie: Blokowe rewolucje i wizje Franka Kleina

Przyszłość projektowania w WordPressie: Blokowe rewolucje i wizje Franka Kleina

Optymalizacja obrazów w WordPress: jak przyspieszyć witrynę i poprawić jakość?

Optymalizacja obrazów w WordPress: jak przyspieszyć witrynę i poprawić jakość?

Najlepsze wtyczki do sprzedaży biletów na WordPressie

Najlepsze wtyczki do sprzedaży biletów na WordPressie

Zobacz więcej
Jak działa serwer MCP? Jak Zrobić własny Serwer MCP z Vibe Coding w Cursor AI!

Jak działa serwer MCP? Jak Zrobić własny Serwer MCP z Vibe Coding w Cursor AI!

Szybki kurs Cursor AI + Vibe Coding: fullstack’owa aplikacja w 4 krokach!

Szybki kurs Cursor AI + Vibe Coding: fullstack’owa aplikacja w 4 krokach!

Jakie pytania zadają benchmarki AI?

Jakie pytania zadają benchmarki AI?

Jak działa RAG? Proste wytłumaczenie systemu niezbędnego we współczesnej firmie

Jak działa RAG? Proste wytłumaczenie systemu niezbędnego we współczesnej firmie

Bielik – Polski Model AI: Wszystko, Co Musisz Wiedzieć

Bielik – Polski Model AI: Wszystko, Co Musisz Wiedzieć

Zobacz więcej

Jak dobrze korzystać z Claude Code? Tutorial: Fullstack’owa aplikacja do booking’u

Przeskocz do treści

Awatar Mike Tomala

Claude Code od Anthropic to narzędzie, które wprowadza inną filozofię pracy z AI w programowaniu niż popularne edytory z wbudowanym wsparciem sztucznej inteligencji. Wcześniej pracowałem głównie z Cursor AI (zobacz: Szybki kurs Cursor AI + Vibe Coding: fullstack’owa aplikacja w 4 krokach!), dlatego zdziwiło mnie, że Claude Code działa wyłącznie w terminalu. Może wydawać się krokiem wstecz w erze graficznych interfejsów, ale ta pozorna wada okazuje się mieć konkretne zalety praktyczne.

Architektura i sposób działania

Claude Code funkcjonuje jako agent konwersacyjny w terminalu, który może wykonywać operacje na plikach, uruchamiać komendy systemowe i zarządzać całym cyklem życia projektu. Narzędzie przejmuje pełną kontrolę nad procesem generowania kodu, działając autonomicznie w ramach zadanych parametrów.

Narzędzie wykorzystuje system pamięci projektowej poprzez plik CLAUDE.md, który zawiera kontekst i reguły specyficzne dla danego projektu. Ten mechanizm pozwala na zachowanie spójności w podejściu do architektury i standardów kodowania w trakcie całej sesji pracy.

Modele rozliczeniowe Claude Code

Claude oferuje dwa modele rozliczeniowe:

  1. Subskrypcja Claude Pro (około 20 USD/miesiąc) – z limitami odnawiającymi się co 5 godzin
  2. API Anthropic – płatność za wykorzystane tokeny (pay-per-use)

Pierwsza opcja może być ekonomiczniejsza, ponieważ limity czasowe są bardziej elastyczne. Jednak rzeczywiste koszty zależą silnie od stylu pracy i złożoności projektów.

Proces tworzenia aplikacji w Claude Code w praktyce

Podczas testowania na projekcie systemu rezerwacji dla barbershopa, Claude Code wykazał się w kilku kluczowych obszarach:

Generowanie architektury

Narzędzie skutecznie wygenerowało kompletną architekturę z Docker Compose, obejmującą:

  • Frontend dla klientów (React)
  • Panel administracyjny
  • API backend
  • Bazę danych MySQL

Do wygenerowania architektury został wykorzystany prompt:

Act as IT Architect, DevOps and Developer.

Zadanie: Stwórz szkielet aplikacji na podstawie poniżej architektury usług mikroserwisowych.

Nazwa aplikacji: Barber Booking

Wymagania Docker:
Do uruchomienia lokalnie wykorzystaj docker-compose.
Nie twórz docker-compose dla produkcji.
Zadbaj o konfigurację lokalnych wolumenów.
Pliki Dockerfile mają być przygotowane zarówno do lokalnego developmentu, jak i produkcyjnego deploymentu (użyj Multi Stage Builds).
Zastosuj kompatybilność obrazów Docker --platform=linux/amd64 dla Proxy, Backend i Frontend.
Nie umieszczaj serwera proxy (Nginx ani Apache) w żadnej usłudze poza PROXY.
Ma istnieć tylko jeden serwer.
Ustal stałe nazwy kontenerów.

Wymagania aplikacji:
Wykorzystaj znane skrypty do generowania szkieletów aplikacji.
Nie twórz żadnych funkcjonalności - otrzymasz je w następnym kroku.

Rules:
Zacznij od szkieletu aplikacji, następnie utwórz konfigurację Dockera.
Najpierw opracuj plan - napisz, co, jak i dlaczego chcesz zrobić.
Utrzymuj jak najprostszą strukturę katalogów, nie twórz katalogu pośredniego.
Wykorzystuj komendę: `pwd`, aby upewnić się czy wykonujesz operacje w odpowiednim katalogu.
Stwórz dokumentację w pliku readme.md

-

Client Frontend:
Środowisko: Node.js 22+
Język: TypeScript
Framework: React, React Router, Redux
Port: 3000
UI: Shadcn/ui + Tailwind CSS
Serwer Proxy: NIE
Dir: client-frontend/

Admin Frontend:
Środowisko: Node.js 22+
Język: TypeScript
Framework: Next.js
Port: 3001
UI: Shadcn/ui + Tailwind CSS
Serwer Proxy: NIE
Dir: admin-frontend/

Backend API:
Środowisko: Node.js 22+
Język: TypeScript
Framework: NestJS
Port: 4000
Dir: backend-api/

Baza danych:
Silnik: MySQL
Port: 3306
Dir: mysql/

Zarządzanie kontekstem

Funkcje takie jak /compact pozwalają na kompresję historii konwersacji, co jest kluczowe dla utrzymania wydajności przy długich sesjach programistycznych. Komenda /init automatycznie analizuje istniejący kod i generuje odpowiedni kontekst projektowy.

Tryb planowania

Możliwość przełączenia w tryb planowania (Shift+Tab) umożliwia wypracowanie strategii implementacji bez natychmiastowego wykonywania zmian w kodzie. To podejście redukuje ryzyko niespójnych implementacji.

Ograniczenia i wyzwania w praktyce

Testowanie wykazało kilka istotnych ograniczeń:

Problem kompletności zadań

Claude Code ma tendencję do informowania o ukończeniu zadań, gdy faktycznie zostały zrealizowane tylko częściowo. W projekcie testowym wielokrotnie pojawiały się komunikaty o „gotowości systemu”, podczas gdy brakowało kluczowych funkcjonalności.

Zarządzanie złożonymi projektami

Im większy projekt, tym trudniej narzędziu utrzymać spójność między komponentami. Wymagane są częste iteracje i weryfikacja wygenerowanego kodu przez programistę.

Zależność od jakości promptów

Skuteczność Claude Code silnie zależy od precyzji wymagań. Brak specyfikacji języka czy waluty skutkował wygenerowaniem aplikacji po angielsku z cenami w dolarach, mimo polskiego kontekstu projektu.

Praktyczne zastosowania

Claude Code sprawdza się najbardziej w scenariuszach:

  • Prototypowania – szybkie tworzenie szkieletów aplikacji
  • Analizy kodu – generowanie README, komentarzy, specyfikacji
  • Refaktoringu – systematyczne, częściowe poprawianie jakości kodu

Mniej odpowiedni jest do:

  • Precyzyjnej pracy na poziomie pojedynczych funkcji
  • Projektów wymagających częstej interakcji z interfejsem graficznym
  • Zadań wymagających głębokiej znajomości specyficznych bibliotek

Wnioski dla praktyki programistycznej

Claude Code reprezentuje podejście „AI-first” do programowania, gdzie sztuczna inteligencja nie tylko wspiera programistę, ale przejmuje inicjatywę w procesie tworzenia kodu. To zmiana paradygmatu, która wymaga od programisty nowych umiejętności – głównie precyzyjnego definiowania wymagań i efektywnego zarządzania kontekstem konwersacji.

Narzędzie może znacząco przyspieszyć tworzenie prototypów i szkieletów aplikacji, ale nie eliminuje potrzeby rozumienia programowania. Programista pozostaje architektem rozwiązania i weryfikatorem jakości wygenerowanego kodu.

Dla zespołów rozważających adopcję CC, kluczowe jest wypracowanie standardów pracy z AI – od struktury promptów, przez zarządzanie pamięcią projektową, po procesy weryfikacji wygenerowanego kodu. Bez tych procesów narzędzie może prowadzić do powstawania niespójnego i trudnego w utrzymaniu kodu.

Claude Code to narzędzie o dużym potencjale, ale wymagające świadomego podejścia do jego ograniczeń i specyfiki pracy.

Newsletter. I wszystko jasne.

Nieominie Cię żadna ważna informacja.

Obiecuje nigdy nie wysyłać spamu, ani scamu! Sprawdź Politykę Prywatności.

Zamknij