Terminalde çalıştırma

text run aynı uygulamayı terminalde çalıştırır. Layout, bileşenler, tuş haritaları ve rota işleyicileri ortaktır; çıktı ise %c CSS span’leri yerine truecolor ANSI biçimindedir.

#text run

Bir betik ekleyin ve çalıştırın:

bun run tui                        # render ./app at /bun run tui -- --path /deployments # start on another route

text run, app/ dizinindeki her dosyayı içe aktarır, App Router’ı bellekte tutulan bir geçmişle bağlar ve tam ekran çizer. <Link>, useRouter(), notFound() ve redirect() değişmeden çalışır; aynı kökene yapılan fetch("/api/…") çağrıları ise rota işleyicilerinizi aynı süreçte çalıştırır. Ctrl+C çıkış yapar ve kaydırma geçmişinizi geri yükler. Bun gerektirir.

#q ile çıkış

Terminal kullanıcıları q tuşunu bekler. useApp().exit() uygulamanın bağlantısını kaldırır ve terminali eski haline getirir; tarayıcıda ise konsol uygulamasının bağlantısını kaldırır.

#Kendi CLI’ınız

Tek bir bileşen için renderToTerminal kullanın. App Router olmadan tek bir öğeyi bağlar ve fetch("/api/…") rota işleyicilerinize yalnızca text run altında ulaşır; bu nedenle bileşene verilerini iletin:

import { renderToTerminal } from "@textjs/app/terminal";import { Table } from "@textjs/app";import { DEPLOYMENTS } from "./lib/deployments";const columns = [{ key: "commit", header: "Commit" }, { key: "project", header: "Project", width: 10 }];const app = await renderToTerminal(<Table columns={columns} rows={DEPLOYMENTS} autoFocus />);await app.waitUntilExit();

bun cli.tsx komutuyla çalıştırın. DeploymentsPage satırlarını getirir, bu nedenle text run gerektirir.

#Farklar

Terminaller daha hızlı yeniden çizer (yaklaşık 15 yerine saniyede 60 kareye kadar) ve ızgarayı sabitlenmiş konsol yerine pencereye göre boyutlandırır. Görseller URL yerine piksel verisi gerektirir. Bu gösterge paneli de dahil olmak üzere geri kalan her şey aynı koddur.