- Yaklaşık 5 yıl önce Engineering Manager rolünü üstlenmeye başladıktan sonra, ana işinde doğrudan kod yazma fırsatı azaldı
- İş dışında da kişisel projeleri düzenli olarak sürdürerek programlama hissini korudu ve teknik becerilerini keskin tuttu
- Geçmişte zaman kısıtları nedeniyle projeler yavaş ilerliyor ve çoğu zaman tamamlanmadan bırakılıyordu
- Ancak 2024’te ihtiyaç duyduğu araçları görece hızlı biçimde geliştirip yayına alarak ilk sürümü gerçekten “tamamlama” alışkanlığı kazandı
Son dönemde tamamlanan yan proje örnekleri
- jsonplayground.com : Bir JSON formatter olmasının yanında, tarayıcı içinde çalışan JQ işlevi de sunuyor (WebAssembly kullanıyor) ve verileri dışarı göndermiyor
- webtomarkdown.com : Dosyaları Markdown’a dönüştürüyor veya bir web sitesinin bir bölümünü Markdown olarak çıkarıp LLM’e bağlam olarak aktarılabilir hale getiriyor
- Uçuş kulübü sayfası Evergreen Soaring için tasarım iyileştirme taslağı
- Uçuş kulübüne gelen mesajlara yanıtı otomatikleştirmek için bir Chrome uzantısı geliştirdi
- fitinterval.com : Egzersiz sırasında aralıklı zamanlayıcı işlevi sunuyor
LLM ve Cursor IDE kullanımının arka planı
- LLM’ler yan proje üretkenliğini büyük ölçüde artırıyor
- Özellikle Cursor IDE ile LLM’leri kodlama işlerinde kullanma süreci oldukça pratik
- Bu yazıda, yeni bir proje oluşturmanın genel akışını paylaşarak okurların bunu kendi işlerinde uygulamasına yardımcı olmayı amaçlıyor
- LLM’ler her alanda faydalı olmadığından, bunları doğrudan deneyip nerede kullanacağınıza karar vermek gerekiyor
Örnek proje: alışkanlık takip web sitesi
- Hâlihazırda kullandığı alışkanlık takip uygulamasını bir web sitesi olarak yeniden oluşturmak istiyor
- Tüm veriler kullanıcı gizliliği gözetilerek yerel cihazda saklanıyor
Spesifikasyonu tasarlamaya başlamak
- Önce ChatGPT’ye kısa bir açıklama verip, gelen ek soruları yanıtlayarak uygulama spesifikasyonunu netleştiriyor
- Belirli bir netliğe ulaştığında, “başka biri yalnızca bu spesifikasyona bakarak tüm uygulamayı geliştirebilsin” düzeyinde düzenlemesini istiyor
- TypeScript, React ve Tailwind CSS kullanma niyetini açıkça belirterek bu teknolojilere dayalı bir spesifikasyon oluşturuyor
- Nihai spesifikasyonu sonraki geliştirme sürecinde başvurmak üzere
SPEC.md içinde saklıyor
Projeyi bootstrap etmek
- Vite kullanarak proje iskeletini hızlıca kuruyor
npm create vite@latest . komutuyla ilk kurulumu yapıyor ve SPEC.md dosyasını proje klasörüne yerleştiriyor- Cursor IDE’deki Composer içinde ajan özelliğini kullanarak Tailwind ayarları, temel dosya düzenlemeleri gibi işleri otomatikleştiriyor
- Bu sayede öngörülen UX yerleşimi, localStorage kullanımı, Markdown dışa aktarma işlevi gibi ilk özellikler kısa sürede hayata geçiriliyor
Küçük parçalara bölerek yinelemeli çalışma
- Tek seferde çok fazla özellik istemek yerine, gerekli iyileştirmeleri bölüp LLM’den sırayla güncellemeler istiyor
- Örneğin UX değişiklikleri veya hata düzeltmelerini küçük görevlere ayırıp Chat ya da Composer modunda talimat veriyor
- İstediği tasarımı anlatmak için Chat’e görseller ekliyor ve LLM’den bunu koda dökmesini istiyor
Sürekli dağıtım ayarı
- GitHub Actions örneklerini referans alarak, main branch’e commit geldiğinde otomatik build alıp GitHub Pages’e dağıtacak şekilde yapılandırıyor
- Cursor’da başka bir repodaki örnek
.yml dosyasının bağlantısını verip LLM’in bunu referans almasını sağlayarak dağıtım hattını kuruyor
Genel ipuçları
- Projenin genel çerçevesini ve ayrıntılarını önce LLM ile düzenleyip daha sonra bağlam amacıyla saklayın
- Araçlar veya açık kaynak şablonlar kullanarak proje bootstrap’ini ve yapı kurulumunu yapın
- Gerekli geliştirme araçlarını ve dizin yapısını tek seferde hazırlayıp yönetilebilir proje kalıplarını izleyin
- Cursor Composer (ajan modu) gibi araçlarla projeye hızlı başlayın
- Claude-3.5-Sonnet ile o1 modelini birlikte kullanın
- Geniş kapsamlı ilk taslak çalışmalarında o1’den yararlanın
- Yaklaşık %80 oranında ayrıntılı düzeltme ve iyileştirmeler için Claude-3.5-Sonnet kullanın
- Uygun modu seçin (Chat, normal Composer, Composer ajanı)
- Chat: Belirli bir noktada değişiklik gerektiğinde ve her düzenleme sonucunu tek tek kontrol etmek istediğinizde
- Composer (normal): Birden fazla dosyaya yayılan özellik eklemeleri veya çok dosyalı değişiklikler gerektiğinde
- Composer (ajan): Henüz çok kullanılmasa da komut çalıştırma, lint, yinelemeli düzeltme gibi otomatik işler gerektiğinde (yine de bunları küçük parçalara bölerek yönetmek daha iyi)
- Bağlam sağlarken belirli dosya, belge ve bağlantıları birlikte verin
- Gerekirse Chat modunda tüm kod tabanını incelemesine izin vererek, LLM’in bağlama uygun kodu bulup önermesini sağlayın
- Projeyle ilgili belgeleri Markdown formatında (
SPEC.md vb.) saklayın ve bağlama dahil edin
- Proje klasöründe
.cursorrules dosyasından yararlanın
- Belirli kütüphanelerin kullanılmamasını söyleyebilir veya Tailwind ile shadcn bileşen kütüphanesinin zorunlu kullanılmasını belirtebilirsiniz
- Böylece prompt’lara yansıtmak istediğiniz kuralları önceden tanımlayarak, çoğu istekte sonucu istediğiniz yöne çekebilirsiniz
- Kodun genel yapısını anlayarak çalışın
- LLM’in hata ayıklayamadığı durumlar oluşmaması için kod kalitesini ve yapısını koruyun
- İşleri küçük parçalara bölmeye devam edin; gerekirse refactoring veya modüllere ayırma için de LLM’den yararlanın
Kapanış
- Bu yöntemle projeyi hızlıca tamamlayıp dağıtıma hazır bir sürüm oluşturursanız, kısa bir ara verseniz bile yeniden başlamak çok daha kolay olur
- Küçük ama tamamlanmış işler üretme alışkanlığı ivmeyi korur; küçük başarıları hızla görüp motivasyonu canlı tutabilirsiniz
3 yorum
İyi bilgi için teşekkürler!
Deneme şekilleri birbirine çok benziyor.
Ben de yakın zamanda yukarıdakine benzer bir yöntemle Cursor ve LLM kullanarak küçük bir proje yaptım ve üretkenliğin gerçekten çok yüksek olduğunu gördüm.
LLM ile bir SPEC ya da PRD hazırlayıp bunu Cursor'a bağlam olarak ekledikten,
cursorrulesile kullanılacak teknolojilere ilişkin kuralları tanımladıktan sonra Composer üzerinden görevleri tek tek verdiğimde, kodun tutarlı bir şekilde gayet iyi üretildiğini gördüm.