Przygotowanie

Wykonaj te kroki przed 16 września, na komputerze, który przyniesiesz na warsztat. Zajmie to około 30 minut.

Ostatni krok to prompt: agent sprawdza konfigurację i wypisuje, czego brakuje.

Wymagania

• Laptop z macOS, Windows albo Linuksem, na którym możesz instalować oprogramowanie. Jeśli nie możesz, użyj GitHub Codespace. Opis znajdziesz na końcu strony.
• Płatna subskrypcja Claude Pro lub Max albo ChatGPT Plus. Darmowe plany nie obejmują agentów w terminalu.
• Umiejętność programowania nie jest potrzebna.

Czego dotyczy warsztat

Agent buduje stronę na podstawie projektu z Figmy. Osobny program, który agent też pisze, porównuje stronę z projektem i zgłasza każdą różnicę. Agent poprawia zgłoszone błędy i uruchamia program ponownie, aż wszystkie testy przejdą. Na końcu strona trafia na Netlify.

Konta

System operacyjny

Otwórz terminal

Terminal to okno, w którym uruchamiasz programy, wpisując komendy. Każda komenda na tej stronie ma przycisk Kopiuj: kopiujesz ją, wklejasz do terminala i naciskasz Enter, a następną uruchamiasz dopiero wtedy, gdy wróci znak zachęty.

Jak działa terminal

Zainstaluj narzędzia

brew install node gh

winget install --id OpenJS.NodeJS.LTS

winget install --id Git.Git

winget install --id GitHub.cli

Set-ExecutionPolicy -Scope CurrentUser RemoteSigned

sudo apt install -y curl git gh

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.7/install.sh | bash

nvm install --lts

Agent do kodu (jeden z dwóch)

Zainstaluj agenta, który pasuje do twojej subskrypcji.

npm install -g @anthropic-ai/claude-code

npm install -g @openai/codex

Netlify CLI

Publikuje stronę na końcu warsztatu.

npm install -g netlify-cli

Przeglądarka dla checkera

Checker, który zbudujesz na warsztacie, otwiera stronę w Chromium przez Playwright. Pobranie go teraz oszczędza około 150 MB na konferencyjnym wifi. Na Linuksie, jeśli zgłosi brak bibliotek, uruchom zamiast tego npx playwright install --with-deps chromium; zapyta o hasło.

npx playwright install chromium

Jeśli komenda zaraz po instalacji zwraca command not found, zamknij terminal i otwórz nowy.

Zaloguj się

Każda komenda logowania otwiera przeglądarkę. Tam zatwierdzasz dostęp i wracasz do terminala. Komenda statusu potwierdza wynik.

GitHub

gh auth login

Odpowiadaj strzałkami i klawiszem Enter: GitHub.com → HTTPS → Yes (logowanie Gita) → Login with a web browser. Skopiuj jednorazowy kod i naciśnij Enter. W przeglądarce wklej kod i kliknij Authorize.

Sprawdź:

gh auth status

Agent do kodu

claude auth login

claude auth status

codex login

codex login status

Netlify

netlify login

Kliknij Authorize w przeglądarce i wróć do terminala.

Sprawdź:

netlify status

Załóż repozytorium

Ta komenda zakłada na twoim koncie GitHub prywatne repozytorium turbine. Klonuje je też do folderu turbine w bieżącym katalogu.

gh repo create turbine --private --clone

cd turbine

Warsztat zaczyna się w tym folderze: cd turbine, potem uruchom agenta. Nie dodawaj do niego plików.

Sprawdź:

git remote -v

Jeśli masz już repozytorium o nazwie turbine, wybierz inną nazwę. Używaj jej wszędzie tam, gdzie ta strona pisze turbine.

Sprawdź konfigurację

Agent sprawdza wszystko z poprzednich kroków i wypisuje, czego brakuje. Niczego nie zmienia.

1. Przejdź do folderu projektu:

   cd turbine

   Kopiuj
2. Uruchom agenta: claude albo codex. Jeśli zapyta, czy ufasz temu folderowi, odpowiedz tak.
3. Wklej prompt poniżej i naciśnij Enter.

Sprawdź, czy ten komputer jest gotowy do warsztatu. Niczego nie instaluj, nie loguj się
i niczego nie zmieniaj: tylko sprawdzaj i uruchamiaj takie komendy, jakich do tego potrzebujesz.

Sprawdź każdy punkt i podaj wynik w tabeli z trzema kolumnami: co sprawdziłeś, co znalazłeś,
OK albo NIE OK.

1. Node jest zainstalowany, w wersji 22.15 lub nowszej, i npm działa.
2. Git jest zainstalowany i ma ustawione imię oraz adres e-mail.
3. GitHub CLI (gh) jest zainstalowane i zalogowane.
4. Netlify CLI jest zainstalowane i zalogowane.
5. Ty, agent, który robi to sprawdzenie, jesteś zainstalowany i zalogowany. Napisz, którym
   agentem jesteś.
6. Ten folder jest repozytorium git z remote na GitHubie, a to repozytorium istnieje na
   koncie, na które zalogowane jest gh.
7. W tym folderze nie ma nic poza plikami samego gita.
8. Przeglądarka Chromium dla Playwright jest już pobrana (sprawdź w katalogu przeglądarek
   Playwright; nie pobieraj jej sam).

Dla każdego punktu NIE OK podaj poprawkę w jednym lub dwóch prostych zdaniach, z dokładną
komendą, jeśli taka jest. Zakończ jedną linijką: GOTOWE albo NIEGOTOWE i liczba punktów
do poprawienia.

Przed każdą komendą agent pyta o zgodę. Zgódź się. Popraw każdy punkt NIE OK i uruchom ten sam prompt jeszcze raz, aż wynik będzie GOTOWE. Jeśli agent się nie uruchamia, powtórz krok Zaloguj się.

Bez instalacji: GitHub Codespaces

Jeśli nie możesz instalować oprogramowania, użyj GitHub Codespace. To komputer w chmurze, dostępny w przeglądarce. Ma zainstalowane Node, Gita i GitHub CLI, zalogowane do GitHuba.

1. Na github.com kliknij + → New repository. Nazwa: turbine. Widoczność: Private. Zaznacz Add a README file, bo dla pustego repozytorium nie da się utworzyć Codespace. Kliknij Create repository.
2. Na stronie repozytorium kliknij Code → Codespaces → Create codespace on main. Terminal to panel na dole, otwarty w folderze repozytorium.
3. Usuń README, żeby folder był pusty:

   rm README.md

   Kopiuj
4. Zainstaluj agenta i Netlify CLI komendami z sekcji Zainstaluj narzędzia. Przeglądarkę zainstaluj przez npx playwright install --with-deps chromium. Node, Git i GitHub CLI są już zainstalowane.
5. Zaloguj się do agenta i do Netlify zgodnie z sekcją Zaloguj się. Zamiast otwierać przeglądarkę, terminal wypisze link. Przytrzymaj Ctrl albo Cmd i kliknij go. W Codeksie użyj logowania kodem urządzenia:

   codex login --device-auth

   Kopiuj

   Jeśli Codex zgłosi, że logowanie kodem urządzenia jest wyłączone, włącz je w ChatGPT → Settings → Security i uruchom komendę ponownie.

6. Wykonaj krok Sprawdź konfigurację w terminalu Codespace. Pomiń cd turbine, bo terminal jest już w folderze projektu.

Darmowy plan GitHuba obejmuje 120 rdzeniogodzin Codespaces miesięcznie. Warsztat zużywa około 3. W dniu warsztatu otwórz ten sam Codespace z github.com/codespaces.

Pytania

W dniu warsztatu

• Weź laptop i ładowarkę.
• Jeśli sprawdzenie nie zakończyło się wynikiem GOTOWE, przyjdź 15 minut przed startem.