Terminal UI oluşturmak artık daha kolay

 (hatchet.run)
22 puan yazan GN⁺ 2026-02-15 | 1 yorum | WhatsApp'ta paylaş
  • Hatchet ekibinin Claude Code kullanarak terminal tabanlı UI (TUI) uygulamasını nasıl hızla geliştirdiği anlatılıyor
  • Charm stack'i (Bubble Tea, Lip Gloss, Huh) ile React düzeyinde bileşen tabanlı geliştirme ve tutarlı stillendirme sağlandı
  • Mevcut web UI ile aynı API kullanılırken metin odaklı, bilgi yoğun arayüz sayesinde geliştirici verimliliği artırıldı
  • Claude Code, tmux oturumlarını çalıştırıp testleri otomatikleştirerek yinelemeli geliştirme ve kararlılığın sağlanmasında büyük rol oynadı
  • Sadece 2 günde tamamlanan Hatchet TUI, LLM tabanlı geliştirmenin gerçek üretkenlik artışı sağlayabildiğini gösteren bir örnek olarak değerlendiriliyor

TUI geliştirmenin motivasyonu

  • Hatchet ekibi, k9s benzeri bir TUI istiyordu ve kullanıcılar bunun web UI'den daha hızlı ve daha sezgisel olduğunu değerlendirdi
    • Kullanıcı geri bildirimleri arasında “CLI ve TUI çok daha iyi performans gösteriyor” görüşü yer aldı
  • TUI, kodla aynı ortamda iş akışlarını görselleştirip çalıştırmayı mümkün kıldığı için sekmeler arasında geçiş gerektirmiyor
  • Hatchet'in ana kullanıcı kitlesi IDE içinde çalışan geliştiriciler olduğundan, hedef terminal içinde iş akışı yönetimi deneyimi sunmaktı

Teknoloji stack'i

  • React, Tailwind vb. tipik frontend stack'ine karşılık gelen Charm stack'i kullanıldı
    • Başlıca kütüphaneler: Bubble Tea, Lip Gloss, Huh
    • Bu araçlar Charm ekibi tarafından sürdürülüyor; dokümantasyon ve örnekler bakımından zengin
  • Lip Gloss ve Huh teması kullanılarak TUI genelinde tutarlı bir stil uygulandı
    • Aynı tema Hatchet CLI komutlarında da yeniden kullanılarak bütünleşik bir kullanıcı deneyimi sunuldu
  • Bubble Tea dışındaki özel özelleştirmeler biraz zor olsa da, React tabanlı bir render motorunu sıfırdan kurmaktan çok daha basit

Test yaklaşımı

  • Claude Code, terminal tabanlı araçları doğrudan çalıştırarak testleri yürüttü
    • tmux capture-pane ile render edilen görünüm yakalanıp çıktının doğru olup olmadığı doğrulandı
  • Bu yöntem, ilk test geçişini otomatikleştirmede oldukça etkili oldu ve görünüm sayısı artsa bile render doğrulamasını kararlı biçimde yapabildi
  • Sonrasında manuel testler ve birim testleri birlikte kullanılarak kararlı bir yinelemeli geliştirme döngüsü oluşturuldu
  • Claude Code, ASCII ortamında tekrarlı işler için optimize olduğundan test geri bildirim döngüsü hızla yakınsadı

Verimli geliştirme ortamının kurulumu

  • Claude Code, mevcut Hatchet frontend implementasyonunu referans alarak geliştirme verimliliğini artırdı
    • React tabanlı sade bileşen yapısı ve OpenAPI spesifikasyonu kullanılarak net sınırlar belirlendi
    • Otomatik üretilmiş REST API istemcisi sayesinde spesifikasyon tabanlı geliştirme mümkün oldu
  • DAG tabanlı renderer implementasyonu en zor kısımdı, ancak
    • mermaid-ascii referans alınarak ASCII grafik renderer'ı başarıyla geliştirildi
    • Kusursuz olmasa da çalışan bir DAG görselleştirme özelliği elde edildi

Sonuçlar ve çıkarımlar

  • Toplam geliştirme süresi yaklaşık 2 gün oldu; bu, önceki frontend refaktöründen çok daha hızlı ve kararlıydı
  • Claude Code ile geliştirmenin rastlantısal olmayan, somut bir üretkenlik artışı gösterdiği ilk örnek olarak değerlendirildi
  • Hatchet ekibi, bundan sonra da çekirdek olmayan yol özelliklerinde LLM tabanlı geliştirmeyi kademeli olarak genişletmeyi planlıyor
  • Temel dersler; kısa geri bildirim döngüsü, modülerlik, spesifikasyon tabanlı tasarım ve sürekli test yaklaşımının önemi oldu
  • Tamamlanan Hatchet TUI, https://tui.hatchet.run adresinde yayımlandı ve kullanıcı geri bildirimleri toplanıyor

İlgili okumalar

1 yorum

 
GN⁺ 2026-02-15
Hacker News yorumları

  • Web sayfası terminal UI performansını ele alıyor ama ironik şekilde, CSS mask compositing veya cubic gradient gibi karmaşık efektler yüzünden yüksek performanslı Dell XPS dizüstümde bile kaydırma takılıyor.
    Gemini’ye göre buna “Scrim veya Easing Gradient” deniyor; 16 renk durağı kullanarak yumuşak bir solma efekti oluşturuyor ama bunun bedeli, kaydırma sırasında milyonlarca pikselin rengini her seferinde yeniden hesaplamak oluyor.
    Çoğu sayfa Firefox’ta akıcı kaydığı için, Mac olmayan iGPU tabanlı hiDPI dizüstülerde de test edilmesini öneririm.
    Bu arada, gradient devre dışıyken alınmış bir görsel de var — bağlantı

    • Doğru. Önce o efekti kaldırıp performansı iyileştirmeyi ya da tamamen çıkarmayı değerlendireceğim. Geri bildirim için teşekkürler.
    • “Commodore 64 seviyesinde” demek haksızlık. C64 aslında akıcı kaydırma yapabiliyordu.
    • Firefox’ta ya da başka bir tarayıcıda CSS veya JS olmadan nasıl okunacağını paylaşıyor. busybox ssl_client ve grep kullanarak HTML’i çıkarıp Firefox’ta açan basit bir script veriyor.
    • Blog yazısında Claude Code’dan ne kadar sık bahsedildiği dikkat çekiciydi.
    • Benim Commodore 64’ümü suçlamayın. Program yüklendikten sonra 50~60Hz’de gayet akıcı çalışır.

  • TUI’nin GUI gibi görünmeye çalışması bana biraz üzücü geliyor. Erişilebilirliği zayıf, yapı düzleşiyor ve kullanıcıyı belirlenmiş yolların dışına çıkamayacak hale getiriyor. Buna karşılık modern GUI’ler işletim sistemiyle yapısal olarak bağlantılı olduğu için çok daha özgür.

    • Katılmıyorum. Bazı problem alanlarında TUI çok daha uygun. Örneğin Debian paket yapılandırma diyalogları düz metinden çok daha kullanışlı ve SSH ya da seri konsolda da iyi çalışıyor. CPU grafiği gösteren araçlar gibi görsel bilgi gereken durumlarda da faydalı.
    • Ben TUI kullanıyorum çünkü bir Electron uygulaması daha kurmak zorunda kalmıyorum. Hafif, gömülü tarayıcı taşımıyor ve kaynak israfı daha az.
    • TUI’nin kısıtları bence UI tasarımcısının odağını artırıyor. Günümüz uygulamalarında menüler gizleniyor ve kullanım zorlaşıyor; TUI ise daha net.
    • Her şeyin terminal içinde çalışması hoşuma gidiyor. İş akışım tmux gibi multiplexer’lar etrafında dönüyor; ayrı pencere açılınca akış bozuluyor. Bu kısıtlar aslında sadelik ve tutarlılık sağlıyor.
    • Emacs, Vim, mc, htop, mutt gibi örneklere bakınca TUI’nin yeterince güçlü olduğu açık. Her arayüzün gösterişli olması gerekmiyor.

  • Eskisine göre TUI geliştirmek çok daha kolaylaştı. Bunda BubbleTea, Textualize ve Ratatui gibi framework’lerin payı büyük.
    LLM’ler sayesinde bu tür araçları hızla geliştirmek mümkün oldu; ben de NTCharts adlı bir TUI grafik kütüphanesinin bakımını yapıyorum.
    Gemini’nin mekânsal kavrayışı sayesinde hataları çözdüm ve şu anda BubbleTea ile yerel bir LLM sohbet görüntüleyicisi yapıyorum.
    İlgili bağlantılar: NTCharts issue, thinkt projesi

  • LLM uygulamalarındaki TUI takıntısını anlayamıyorum. VS2026’daki Copilot’a bakınca, GUI çok daha fazla bilgiyi çok daha hızlı gösterebiliyor. Diff’lere gerçek zamanlı tıklayıp incelemek verimlilik sağlıyor.

    • Ben VSCode kullanıyorum; AI agent kenar çubuğunu ayrı bir pencereye alabilmek Claude Code’dan çok daha kullanışlı hale geldi. Görsel bilgi yoğunluğu ve hassasiyet TUI’ye göre çok daha yüksek.
    • Sebep basitlik. TUI, dosya sistemi üzerine hızla arayüz koymanın en basit yolu. Bunu web teknolojileriyle yaparsanız tarayıcı ve sunucu gerekir.
    • Claude Code’un işlevleri güzel ama VSCode’daki AI diff önizleme arayüzü bana çok daha iyi geliyor. Yine de yeni entegre sürüm hâlâ epey hatalı.
    • Aslında bu biraz LARP(rol yapma) gibi. “Gerçek hacker” gibi görünmeye yönelik sembolik bir hareket sadece; pratikte ise React/CSS ile yapılmış bir web uygulaması.

  • LLM’lerin bilgi işlem kaynaklarını sömürdüğü bu çağda, tersine hafif yığınlarla araç geliştirme için bir fırsat doğdu.
    C ile yazarak CPU performansını binlerce kat artırdım ve RAM kullanımını yarıya indirdim. TUI bu verimliliğe iyi bir örnek.

    • Yine de native GUI ya da Flutter gibi framework’ler performans açısından TUI’den daha iyi olabilir.
    • LLM eğitimi için harcanan enerjinin optimizasyonlarla ne kadar telafi edilebileceği şüpheli.
    • TUI, bağımlılıkları azaltmak için de iyi. Eskiden 100 npm paketi gerekirken şimdi 200 satırlık JS yetiyor.

  • Midnight Commander(mc) hâlâ en iyi TUI’lerden biri bence. GUI sürümü (Double Commander) ile neredeyse aynı işlevleri sunarken uzaktan da çalıştırılabiliyor.
    Şu anda yeni skin üzerinde çalışıyorum; umarım bir sonraki sürüme girer.

    • Ben şahsen Far Manager veya Dos Navigator’ı daha kararlı buluyorum.
    • mc geliştiricilerine teşekkürler.

  • Gemini, DHT scraper projem için bir TUI oluşturdu — görsel
    İlk sürümde CJK karakter sorunları yüzünden düzeltme gerekti ama genel olarak etkileyiciydi. Bu sayede algoritmaya odaklanabildim.

    • Hangi kütüphaneyi kullandığını merak ediyorum.
    • DHT ile ilgili projelere ilgim var. Arama motorlarında vb. nasıl kullanıldığını öğrenmek isterim.
    • Buradaki “DHT”nin Distributed Hash Table anlamına gelip gelmediğini soruyor. TUI’yi de çok beğenmiş.

  • TUI’nin web formu ya da GUI’den daha iyi olduğu tarafı pek göremiyorum. Buna karşılık CLI pipeline birleştirme çok güçlü bence.

    • Bazı kurumlar (NSA, CSE, GCHQ vb.) güvenlik nedeniyle web tabanlı yönetim arayüzlerini yasaklıyor. Bu yüzden ürünümüzü yerel konsol veya SSH tabanlı TUI ile yönetiyoruz. Çok kısıtlı SELinux MAC ayarları kullanıyoruz.
    • CLI ile yan yana çalışabilen uygulamalarda TUI kullanışlı. tmux/zellij ile pencereleri bölmek kolay, ayrıca işletim sistemleri arasında arayüz farkı daha az.
    • TUI özellikle SSH ortamlarında çok faydalı. Telefonda SSH istemcisiyle bile iyi çalışıyor.
    • Gemini, C# projem için bir TUI yapmıştı ama sonra Kestrel web sunucusunu gömmenin daha iyi olacağını önerdi. Haklıydı.
    • TUI, iyi keybinding’ler sunuyor ve komut çalıştırılan yerden doğrudan erişilebildiği için hızlı işler için uygun.

  • Claude Code’u seviyorum ama React tabanlı TUI mimarisi bana gerçekten verimsiz geliyor.

    • Özellikle uzun metinlerde kaydırırken performans düşüşü çok belirgin. Sanki en baştan beri bu yapı böyleydi; neden düzeltmesinin zor olduğunu merak ediyorum.
    • Eğer render zaten JS ile yapılıyorsa, React’i reconciliation engine olarak kullanmak mantıklı olabilir.

  • Cursor CLI tabanlı kendi prompt frontend’imi yaptım — görsel
    git, diff ve sohbet geçmişini entegre ettim; ayrıca Tailscale üzerinden telefondan da kolayca erişilebiliyor.
    Kendi kurallarımı tanıyabiliyor ve projede grep yapabiliyor; bu da kullanılabilirliği çok artırıyor.