Projekty demonstracyjne · zastąp fikcyjne treści własnymi.
01 / Logowanie
Jakiej konfiguracji konta potrzebuję?
Dla większości użytkowników indywidualnych Google zaleca logowanie do Gemini CLI osobistym kontem Google. Dostępne są też klucz API i Vertex AI; konta organizacji mogą wymagać innej konfiguracji. Wybierz sposób dla swojego konta i sprawdź limity oraz rozliczenia osobno od szablonu.
Twoje środowisko Google
Konta osobiste i organizacyjne mogą mieć różne wymagania.
Oddzielne korzystanie
Szablon nie zawiera dostępu do Google AI ani nieograniczonego darmowego użycia.
Przeczytaj index.html, RECREATE.md i zasoby w tym folderze. Zanim edytujesz, pokaż, gdzie są nagłówek, zdjęcia i linki kontaktowe.
AI · przykładowa odpowiedź
Sprawdzę pliki i wypiszę sekcje, ścieżki zdjęć oraz linki. Wskażę też formularze, które tylko demonstrują działanie.
Ty
Pracuj na istniejącym HTML. Teksty mojej firmy i zdjęcia są w folderze materials.
AI · przykładowa odpowiedź
Przypiszę materiały do istniejących sekcji i zapytam o brakujące treści, zamiast je wymyślać.
Kroki do wykonania
Otwórz folder
Rozpakuj projekt i udostępnij go agentowi.
Poznaj stronę
Przeczytaj HTML i instrukcję przed wymianą treści.
Dodaj własne materiały
Przekaż własne teksty, zdjęcia i prawdziwy kontakt.
Efekt: agent pracuje na rzeczywistych plikach Twojej strony.
Przykładowy przebieg pracy. Bez połączenia z AI na żywo.
02 / Widoczność plików
Jak przekazać właściwy kontekst?
Otwórz Gemini CLI w rozpakowanym folderze strony. Wskaż index.html i RECREATE.md i poproś o opis plików, które może odczytać. Dodaj teksty firmy i ścieżki zdjęć, żeby zmieniało rzeczywisty projekt, a nie pracowało na ogólnym opisie.
Pliki strony + instrukcje projektu
@index.html
Poproś o poznanie rzeczywistego frontendu przed edycją.
@RECREATE.md
Przekaż specyfikację oryginału i osobny zatwierdzony brief firmy.
Zobacz pliki źródłowe i szczegóły techniczne
Rzeczywiste pliki projektu
14-clearstead · Aktualnie sprawdzony ZIP
Aktualna paczka produktu sprawdzona 2 października 2026. Pliki i zewnętrzne zasoby dotyczą tego projektu; inne szablony się różnią.
Instrukcja opisuje oryginalną fikcyjną stronę. Oddziel jej rolę od zmian potrzebnych Twojej firmie.
Produce one `index.html`, containing all page markup, an inline stylesheet and one inline vanilla-JavaScript IIFE placed after the dialog. Use English. No framework, package manager, build step, bundler, external JavaScript, backend or persisted state. The runtime is **network**: four external SVG images and the Google Fonts stylesheet/font files are required. Opening the HTML directly or serving it over a local HTTP server must support the same local interactions. Target current desktop and mobile Chromium with native `<dialog>`, `<details>`, CSS Grid, `min()`, `100svh` and `matchMedia().addEventListener()` support. Preserve every text, image URL, selector, dimension and behavior below. Keep the literal curly punctuation, en dashes and arrow glyphs.
03 / Pierwsza edycja
Jak zlecić konkretną zmianę?
Powiedz Gemini, jaki wynik chcesz uzyskać na obecnej stronie: nazwę firmy, wskazany nagłówek, teksty usług i prawdziwe linki przycisków. Wymień elementy do zachowania i zleć zapis HTML. Potem otwórz podgląd i poproś o potrzebne poprawki.
›_ Przykład edycji z AIFormwell
Ty
Dopasuj Formwell do fikcyjnego studia marki Alder. Zmień nazwę, nagłówek hero i wprowadzenie. Zachowaj układ i przykładowe grafiki projektów.
AI · przykładowa odpowiedź
Przygotowany podgląd wymienia nazwę firmy, nagłówek hero i wprowadzenie. Porównaj zakładki Treść i Oryginał, żeby zobaczyć te zmiany; pozostałe zdjęcia projektów są przykładowe.
Przygotowana rozmowa i wersje projektu. Bez połączenia z AI na żywo.
Przygotuj polecenie z konkretnymi plikami dla Gemini
Twój własny plan pracy
AI ChatPrzykładowy proces
Gemini CLI · Sprawdzenie zmienionej strony
Ty
Porównaj zmienioną stronę z moim poleceniem. Sprawdź nagłówek, ścieżki zdjęć, menu i kontakt na komputerze i telefonie.
AI · przykładowa odpowiedź
Wypiszę różnice i sprawdzę to, co rzeczywiście wyświetla przeglądarka. Sam zapis pliku nie potwierdza efektu wizualnego.
Ty
Na telefonie nagłówek jest ucięty. Popraw to bez zmiany tekstu.
AI · przykładowa odpowiedź
Poprawię układ mobilny i ponownie sprawdzę tę samą szerokość telefonu. Potem możesz zaakceptować wynik.
Kroki do wykonania
Porównaj zmiany
Sprawdź swoje teksty, zdjęcia i zakres polecenia.
Otwórz podgląd
Sprawdź komputer i telefon; kliknij menu i kontakt.
Opisz problem
Powiedz agentowi, co jest źle, i zleć ponowne sprawdzenie poprawionego widoku.
Efekt: sprawdzona wersja gotowa do dalszej edycji lub publikacji.
Przykładowy przebieg pracy. Bez połączenia z AI na żywo.
04 / Pliki i przeglądarka
Co potwierdza zmianę strony?
Sprawdź zapisane różnice i rzeczywistą stronę. Skontroluj teksty, linki, zasoby i telefon. Przechowuj oryginał oraz sprawdzone wersje osobno.
01
Sprawdź zmienione ścieżki
Szukaj nieoczekiwanych zmian i plików bez zleconej edycji.
02
Sprawdź widoczny wynik
Sprawdź nagłówki, menu, klawiaturę i cel głównego działania.
Zobacz pliki źródłowe i szczegóły techniczne
Mała zmiana, którą możesz sprawdzić
14-clearstead/index.html · L46
Wyciągi pochodzą ze sprawdzonego angielskiego oryginału. Kolejne przykłady to przygotowane zmiany plików, a nie sesja AI na żywo. Firmy i prace pozostają fikcyjne.
Przed
<h1 id="hero-title">Give your money a little more direction.</h1>
Pierwsza przygotowana zmiana
<h1 id="hero-title">Give each plan a clear next step.</h1>
Przygotowana kolejna zmiana
<h1 id="hero-title">Plan the month.<br>Choose the next step.</h1>
Oryginalny projekt · Clearstead 14
Wyciągi pochodzą ze sprawdzonego angielskiego oryginału. Kolejne przykłady to przygotowane zmiany plików, a nie sesja AI na żywo. Firmy i prace pozostają fikcyjne.Otwórz pełny podgląd ↗
Przygotowana zmiana pliku
Przygotowana wersja zmienia wybrane teksty lub obrazy w tym samym projekcie. Zachowuje strukturę i przykładowe treści. Porównaj pliki przed podobną zmianą dla swojej firmy.Otwórz pełny podgląd ↗
AI ChatPrzykładowy proces
Gemini CLI · Odnalezienie brakującego pliku
Ty
W podglądzie brakuje tego zdjęcia. Sprawdź adres obrazu i lokalną ścieżkę w index.html.
AI · przykładowa odpowiedź
Porównam odwołanie w HTML z plikami i sprawdzę, czy używa zewnętrznego adresu. Jeśli pliku nie ma, poproszę o niego zamiast wstawiać przypadkowe zdjęcie.
Ty
Właściwe zdjęcie jest w assets. Popraw odwołanie, zachowaj nazwę pliku i sprawdź kadr na telefonie.
Kroki do wykonania
Sprawdź odwołanie
Odczytaj ścieżkę obrazu w rzeczywistym HTML.
Odnajdź zasób
Porównaj lokalne pliki albo potwierdź ładowanie zewnętrznego adresu.
Otwórz ponownie podgląd
Sprawdź poprawione zdjęcie i kadr w przeglądarce.
Efekt: właściwe zdjęcie ładuje się z poprawnej ścieżki.
Przykładowy przebieg pracy. Bez połączenia z AI na żywo.
05 / Poprawki i dostęp
Co jeśli wynik lub kontekst plików jest błędny?
Jeśli Gemini nie czyta pliku, sprawdź właściwy folder projektu, istnienie ścieżki i dozwolony dostęp. Jeśli strona wygląda źle, wskaż sekcję albo prześlij zrzut i zleć poprawkę konkretnego problemu. Zachowaj zapisaną wersję do wycofania odrzuconych zmian.
Czy ignorowane pliki zawsze są niedostępne?⌃
Ścieżka w .geminiignore jest wykluczana przez narzędzia obsługujące ten plik, także przy przekazywaniu przez @. To nie jest uniwersalna blokada dla każdej usługi. Jeśli plik strony jest omyłkowo wykluczony, sprawdź wzorzec i uruchom ponownie Gemini CLI po zmianie.
Jak wycofać odrzuconą zmianę?⌃
Zachowaj oryginalny ZIP i zaakceptowany folder lub wersję Git. Powiedz agentowi, którą wersję lub zmianę przywrócić, a potem otwórz stronę i sprawdź treści oraz linki.
Clearstead prezentuje koncepcję cash flow, nie gotowy software finansowy. Porównaj struktury i dostarcz wyłącznie prawdziwe twierdzenia oraz przykłady.
Clearstead
Frontend fikcyjnego narzędzia do przepływów finansowych z lokalnym formularzem; bez połączonego konta finansowego lub usługi zapytań.
Aktualny pakiet sprawdzony 2 października 2026. Sprawdź wybrane pliki na stronie produktu.
index.html
RECREATE.md
assets/paper-detail.webp
assets/print-project.webp
assets/studio-review.webp
Część zasobów może być pobierana z zewnętrznych adresów. Sprawdź wybrany projekt przed publikacją.
Projekty demonstracyjne · zastąp fikcyjne treści własnymi.
AI ChatPrzykładowy proces
Gemini CLI · Cloudflare Pages · od folderu do strony online
Ty
Moja strona jest gotowa. Opublikuj ten folder na Cloudflare Pages przez Wrangler. Najpierw powiedz, jakiego dostępu do konta i zgody potrzebujesz.
AI · przykładowa odpowiedź
Sprawdzę pliki i ścieżki zdjęć. Zaloguj się do swojego Cloudflare i zatwierdź utworzenie lub aktualizację projektu Pages, zanim wyślę pliki.
Ty
Zgadzam się na publikację w nowym projekcie Pages. Nie zmieniaj obecnej domeny, dopóki nie sprawdzę podglądu.
AI · przykładowa odpowiedź
Po zatwierdzonym wysłaniu podam adres zwrócony przez Cloudflare i sprawdzę zdjęcia oraz linki. Domenę możemy podłączyć po akceptacji podglądu.
Kroki do wykonania
Przekaż projekt agentowi
Użyj agenta AI z dostępem do plików i terminala; trzymaj index.html oraz zasoby razem.
Zatwierdź wysłanie
Zaloguj się do hostingu i zatwierdź konkretny projekt. Agent może użyć obsługiwanego CLI lub API.
Sprawdź rzeczywisty adres
Otwórz zwrócony adres; własną domenę podłącz po sprawdzeniu strony.
Efekt: Twoja strona pod publicznym adresem, a następnie pod własną domeną.
Przykładowy przebieg pracy. Bez połączenia z AI na żywo.
07 / Pozostałe zadania
Co pozostaje poza pracą z plikami?
Po edycji podłącz potrzebny formularz lub rezerwacje i zleć agentowi AI publikację folderu na odpowiednim hostingu. Zatwierdź dostęp do konta i wysłanie, sprawdź zwrócony adres online, a potem podłącz domenę. Hosting i dostęp do AI są osobne od szablonu.
OneDollarStock is implementing a project to prepare the platform for entry into the German market under the “Go Global” acceleration track of the “Unicorn Hub Startup Booster” programme, project no. FENG.02.28-IP.02-0013/23. The project is co-financed by the European Funds for Smart Economy 2021–2027 under the priority “Innovation-friendly environment”, Measure FENG.2.28 Startup Booster Poland.
Learn more about the project →
