GOAT'un kurduğu uygulamayı Claude Code ile geliştir ve yayınla
GOAT tek cümleden uygulamanı kurar. Sonra kodu bilgisayarına çek, Claude Code'a istediğin değişikliği yaptır, tek komutla canlıya al.
GOAT ekibi@goat · Tarifler
5 adım
6 dk
GOAT'un kurduğu uygulama ilk gün çalışır, ama her işin kendine özel ihtiyaçları vardır: bir form alanı, farklı bir renk, yeni bir sayfa. Bunları sohbetten istemek bazen yetmez.
Bu tarifte uygulamanın kodunu bilgisayarına çekip Claude Code'la düzenliyoruz. Değişiklik bitince aynı uygulama aynı adreste güncellenir. Kod bilmen gerekmez; Claude Code ne yaptığını anlatır, sen onaylarsın.
Örnek: bir kuaför salonu için GOAT'un kurduğu randevu sayfasına telefon alanı ekleyip mobil görünümü düzeltiyoruz.
Başlamadan önce
İhtiyacın olanlar
- Claude Code ve bilgisayarında Node.js (uygulamayı yerelde denemek için).
- GOAT hesabında kurulmuş bir uygulama. Yoksa önce sohbetten bir tane kur.
- Yayınlamak kredi kullanır; kalan kredini
goatbot creditsile görürsün.
GOAT'u Claude'a bağla
- Terminalde:
curl -fsSL https://www.thegoat.bot/cli/install.sh | bash - Sonra
goatbot login. Tarayıcıda onaylarsın; GOAT, Claude Code'a kendiliğinden eklenir. - Kontrol:
goatbot doctorher satırda yeşil göstermeli.
Adım 1. Uygulamanı bul ve kodunu çek
Ne yapar
- GOAT hesabındaki uygulamaları listeler.
- Seçtiğin uygulamanın kodunu yeni bir klasöre indirir ve klasörü GOAT'a bağlar.
GOAT hesabımdaki uygulamaları listele (goatbot apps). Kuaför randevu uygulamasını bul, kodunu goatbot app pull ile ~/goat-apps/ altına çek, sonra npm install çalıştır. Bitince bana klasörün yerini, uygulamanın hangi çatıyla yazıldığını ve sayfaların listesini kısaca anlat.
$ goatbot apps randevum Kuaför randevu sayfası canlı defterim Müşteri defteri canlı $ goatbot app pull randevum ~/goat-apps/randevum ✓ 48 dosya → ~/goat-apps/randevum cd ~/goat-apps/randevum && npm install && npm run build
Adım 2. Değişikliği iste
Ne yapar
- Claude Code kodu okur, değişikliği yapar ve hangi dosyalara dokunduğunu söyler.
- Mevcut tasarımı ve metin dilini korur.
Ne istediğini işletmenin diliyle anlat; dosya adı bilmen gerekmez. Ekran görüntüsü varsa ekle, en hızlı anlatım odur.
Bu uygulamada şu değişiklikleri yap: 1. Randevu formuna zorunlu bir telefon alanı ekle (Türkiye formatı, 0 ile ya da +90 ile başlayabilir). Kayıtlarda da saklansın. 2. Telefonda (390 px genişlik) hizmet kartları yan yana sıkışıyor; tek sütuna düşsün. 3. Alt kısma salonun Google Haritalar linkini ekle: https://maps.app.goo.gl/ornek Mevcut tasarıma ve renklere dokunma, metinler Türkçe kalsın. Bitince hangi dosyaları değiştirdiğini ve nedenini 3-4 satırda anlat.
● Randevu formuna telefon alanı eklendi (zorunlu, 0 / +90 doğrulaması) app/randevu/form.tsx · lib/booking.ts ● Hizmet kartları 640 px altında tek sütun app/globals.css ● Alt bilgiye Google Haritalar linki components/footer.tsx 3 dosya değişti · tasarım ve renkler aynı
Adım 3. Yerelde dene
Ne yapar
- Uygulamayı bilgisayarında çalıştırır.
- Formu ve mobil görünümü kontrol eder; bir şey bozuksa düzeltir.
npm run build ile uygulamayı derle, hata varsa düzelt. Sonra npm run dev ile çalıştır ve bana adresini ver. Randevu formunu telefon alanı boşken ve doluyken dene, sonucu söyle. Ben de tarayıcıda telefon görünümünde bakacağım.
localhost:3000
Örnek görünüm
Randevunu 30 saniyede al
Tarayıcının geliştirici araçlarında telefon görünümünü açıp kendin de bak. Beğenmediğin yeri ekran görüntüsüyle Claude'a göster.
Adım 4. Canlıya al
Ne yapar
- Değişen kodu GOAT'a yükler; GOAT derler ve aynı adreste yayınlar.
- Derleme biterse canlı adresi, hata olursa hata kaydının sonunu gösterir.
Uygulama klasöründe goatbot app deploy çalıştır ve derlemenin bitmesini bekle. Canlıya çıkınca adresi bana ver. Derleme hata verirse kaydı oku, sorunu düzelt ve yeniden dene; iki denemede olmazsa dur ve bana hatayı anlat.
$ goatbot app deploy 48 dosya (312 KB) GOAT'a yükleniyor… Build başladı · dpl_7f3a… ✓ Canlıda: https://randevum.thegoat.bot
Adım 5. Yaptığını GOAT'a not düş
Ne yapar
- Değişikliğin özetini GOAT Notlar'a ekler.
- GOAT'un ajanları sonraki işlerde uygulamanın güncel halini bilir.
GOAT'a bir not ekle: bugün randevu uygulamasında yaptığımız değişikliklerin özeti (telefon alanı, mobilde tek sütun, Haritalar linki), canlı adres ve tarih. Kısa tut.
GOAT · Notlar
Örnek görünüm
- Telefon alanı, mobilde tek sütun, Haritalar linki
- Canlı: randevum.thegoat.bot
- 10 Kasım 2026
Sonuç
Uygulaman aynı adreste güncellendi: telefon alanı kayıtlara giriyor, telefonda düzgün görünüyor, salonun konumu bir tık uzakta. Değişikliğin özeti de GOAT Notlar'da.
Aynı döngüyü her değişiklikte tekrarlayabilirsin: çek, iste, dene, yayınla.