ChatGPT ile vibe coding: Canvas, Codex ve ChatGPT'den uygulama yapmak

ChatGPT ile üç şekilde vibe coding yapabilirsiniz. Sohbette küçük bir uygulama isteyip canvas içinde önizleyebilirsiniz; gerçek bir kod tabanındaki görevleri OpenAI'ın kodlama ajanı Codex'e verebilirsiniz; ya da ChatGPT'nin veritabanlı tam bir uygulamayı inşa edip yayınlayabilmesi için Mythex gibi bir yapay zeka uygulama oluşturucusunu bağlayabilirsiniz. İlki tek sayfalık bir araç için en hızlısıdır, ikincisi geliştiricilere uygundur, üçüncüsü ise ChatGPT'den ayrılmadan girişleri ve verileri olan canlı bir uygulama verir.

Her birinin nasıl çalıştığını, her biri için bir promptu ve nerede durduğunu aşağıda bulabilirsiniz. Terim hakkında arka plan istiyorsanız vibe coding nedir sayfasını okuyun.

Seçenek 1: ChatGPT sohbeti ve canvas

Hızlı bir araç için sadece isteyin. ChatGPT kodu yazar ve canvas içinde basit HTML ve React sayfaları göstererek etrafında tıklayıp değişiklik isteyebilmenizi sağlar.

Hesap tutarı, bahşiş yüzdesi (10, 15, 20 için düğmeler ve özel bir alan) ve kişi sayısı girdileri olan tek sayfalık bir bahşiş hesaplayıcı yaz. Yazdıkça bahşişi ve kişi başı tutarı güncelleyerek göster. Telefonda temiz görünsün.

Uygun olduğu durumlar: hesaplayıcılar, basit oyunlar, açılış sayfası taslakları ve öğrenme. "Bunu kodlamaya yeni başlamış biri gibi açıkla" diye sorarsanız hızlı öğrenirsiniz.

Nerede durduğu: bir arka uç yoktur. Girdiğiniz hiçbir şey diğer kullanıcılar için kaydedilmez, giriş yoktur ve paylaşmak için kodu bir yere kopyalayıp kendiniz barındırmanız gerekir. "Ve ekibim görsün diye kaydet" dediğiniz an sohbetin ötesine geçmişsinizdir.

Kopyala-yapıştır vibe coding

Birçok kişi ChatGPT'den kod isteyip bilgisayarındaki dosyalara ya da bir barındırma hizmetine yapıştırarak başlar. Küçük statik siteler için işe yarar, ama hızla bozulur. Her değişiklik doğru dosyayı bulmak, doğru parçayı yapıştırmak ve değiştirdiğiniz şeye bağlı başka bir şeyin olmadığını ummak demektir. Bunu birkaç defadan fazla yaptığınızı fark ederseniz, sonraki iki seçeneklerden birine geçin.

Seçenek 2: Gerçek bir kod tabanı için Codex

Codex, OpenAI'ın yazılım işi için ajanıdır. Ona sade bir dille bir görev verirsiniz; bir depo üzerinde çalışır: kodu okur, dosyalar arasında değişiklik yapar, komutları ve testleri çalıştırır ve sonucu incelemeniz için verir. OpenAI onu ChatGPT içinde, bir komut satırı aracı olarak ve bir editör eklentisi olarak sunar; hangi planlara dahil olduğunu ve güncel limitleri OpenAI'ın sitesinden kontrol edin.

En iyi uyan prompt, bir görev gibi yazılmış olandır:

Bu repoda Siparişler sayfasına bir CSV dışa aktarma düğmesi ekle. Mevcut olarak filtrelenmiş siparişleri tarih, müşteri, toplam ve durum sütunlarıyla dışa aktarsın. Dışa aktarma fonksiyonu için bir test ekle ve test paketini çalıştır.

Uygun olduğu durumlar: mevcut bir projesi olan ve bir ajanın görev listesinden bütün işleri almasını isteyen geliştiriciler ve teknik kurucular. Kendi yığınınız ve kurallarınızla çalışır.

Hâlâ sizin ilgilendiğiniz şeyler: uygulamanın nerede çalıştığı, veritabanı, gizli bilgiler, yayınlama ve alan adları. Codex kodu değiştirir; bir barındırma hizmeti değildir.

Codex ve Mythex birlikte

Codex, Mythex'inkiler dahil MCP sunucularına da bağlanabilir. Codex'te https://mcp.mythex.ai/mcp adresini özel bir MCP sunucusu olarak ekleyin, Mythex'te erişimi onaylayın; Codex bulut korumalı alanında bir Mythex projesi üzerinde çalışabilir, önizleme, veritabanı ve yayınlama ise Mythex tarafından yönetilir. Mythex uygulamalarını Claude, Cursor ya da Codex'ten yapmak yazımız bunu adım adım anlatır.

Seçenek 3: ChatGPT'den Mythex ile tam bir uygulama yapmak

Bir ChatGPT sohbetinde kalıp gerçek, barındırılan bir uygulamayla bitirmek istiyorsanız Mythex'i bağlayın. Mythex, ChatGPT içinde bir uygulama olarak çalışır: ChatGPT, asistanların başka yerlerde barındırılan araçları kullanmasını sağlayan açık protokol MCP üzerinden Mythex'in araçlarıyla konuşur (MCP nedir).

Bağlandıktan sonra ChatGPT bir Mythex projesi oluşturabilir, kodu özel bir bulut korumalı alanında yazabilir, canlı bir önizleme başlatabilir, bir veritabanı ve dosya depolama ekleyebilir ve uygulamayı herkese açık bir URL'ye yayınlayabilir. Sonuçlar, projeyi Mythex'te açıp önizlemeyi izleyebileceğiniz bir bağlantıyla gelir.

Nasıl bağlanılır

1. Mythex'te Hesap ayarlarını açın ve MCP adresini kopyalayın.
2. ChatGPT'de, uygulamalar ya da bağlayıcılar ayarlarından bu adresi kullanarak Mythex'i ekleyin. ChatGPT'nin menüleri zaman zaman değişir; adlar farklıysa uygulama eklemeyle ilgili OpenAI yardım sayfasını izleyin.
3. Bir Mythex sayfası açılır: oturum açın ve Erişime izin ver'i seçin. Yapıştıracak bir anahtar yoktur.
4. Bir sohbet başlatın ve isteğinizde Mythex'ten bahsedin.

Bağlanma herhangi bir Mythex planında çalışır. İnşa etme, önizleme ve yayınlama gibi korumalı alan araçları Mythex Pro (ayda 25 dolar) gerektirir; korumalı alan süresi ve barındırma Mythex kredilerinizden gelir. ChatGPT kullanımınız OpenAI planınızda kalır.

Denemek için ilk prompt

Mythex kullanarak benim için bir iş başvuru takipçisi yap. Şirket, pozisyon, bağlantı, başvuru tarihi, durum (başvurdum, mülakat, teklif, reddedildi) ve notlarla başvurular ekleyeyim. Duruma göre bir pano göster; kartları sürükleyebileyim ve haftalık başvuru sayısını gösteren basit bir grafik olsun. Her şeyi bir veritabanına kaydet ve bir girişle koru. Önizlemeyi başlat ve bana bağlantıyı ver.

Sonra her mesajda bir değişiklik:

Mythex projesinde her başvuruya bir hatırlatma tarihi ekle ve hatırlatması bugün ya da geçmişte olan kartları vurgula.

Yayınla ve bana canlı URL'yi gönder.

Uygun olduğu durumlar: planlarını ve düşüncelerini ChatGPT'de yapan ve hosting öğrenmeden sonucu, kalıcı verilerle canlı istemeyen kişiler. Sıradan bir Mythex projesi olduğu için istediğiniz zaman Mythex sohbetinde devam edebilirsiniz.

Hangi seçenek ne inşa ettiğinize uyar

ChatGPT'de işe yarayan prompt alışkanlıkları

• İstediğinizde aracı adlandırın. "Mythex kullanarak…" ifadesi, isteğin genel bir cevap değil projeniz için olduğunu netleştirir.
• Her mesajda bir değişiklik. Uzun düzenleme listeleri uzun yan etki listeleri üretir.
• Büyük adımlardan önce bir plan isteyin. "Bir şeyi değiştirmeden önce neyi değiştireceğini listele ve benim onayımı bekle."
• Tam hataları yapıştırın. Tam hata metni, her açıklamadan daha değerlidir.
• Neyin değiştiğini sorun. "Son üç değişikliğini sade sözlerle özetle" kodu okumadığınızda sizi yönlendirir.

Daha fazlası vibe coding prompt kopya kâğıdımızda.

Güvende kalın

• Bir ChatGPT sohbetine asla gerçek parolaları ya da API anahtarlarını yapıştırmayın. Uygulamanız bir anahtara ihtiyaç duyuyorsa onu projenin gizli bilgilerinde saklayın. Mythex'in araçları yalnızca gizli bilgi adlarını bildirir, asla değerlerini bildirmez.
• Yayınlamadan önce kullanıcıların birbirinin verilerini göremediğini ve hiçbir anahtarın tarayıcıda çalışan koda girmediğini kontrol edin. Vibe coding güvenli mi rehberimiz, yapıştırabileceğiniz promptlarla kontrolleri listeler.

Claude de kullanıyorsanız, yardımcı rehberimiz Claude ve Claude Code ile vibe coding konusunu anlatır. Model bazında bir görünüm için uygulama yapmak için ChatGPT, Claude ve Gemini sayfasına bakın.

Sorular