Ana içeriğe geç

ViraStack Start (CLI): Next.js ve TanStack Start Şablonları

Teknik2 dkMedium

Yeni bir React projesine başlarken ilk birkaç saati genellikle aynı araçları kurmakla harcarız: linter ayarları, durum yönetimi (state management), klasör mimarisi ve UI bileşenleri. Frontend ekosistemi inşa etmek yazımdaki temel amacım bu tekrarları önlemek ve disiplinli bir zemin kurmaktı.

Bu vizyonun ilk adımı olan ViraStack Start, tek komutla üretime hazır projeler iskeleti oluşturan bir CLI (komut satırı) aracıdır.

ViraStack Start
ViraStack Start

Ne Yapıyor?

Sıfırdan ayar yapmak yerine; kanıtlanmış bir mimari, Tailwind CSS 4 entegrasyonu ve özellik odaklı (feature-sliced) klasör yapısıyla projeye anında başlamanızı sağlar.

CLI size temel olarak iki güçlü şablon sunar: Next.js App Router ve TanStack Start. İster Next.js kullanın ister TanStack Start, her iki şablon da aynı mimari disiplini paylaşır. React 19, TanStack Query, Zustand ve nuqs varsayılan olarak entegre edilmiş şekilde gelir.

Kurulum ve Seçenekler

Yeni bir projeye başlamak için tek komut yeterli:

pnpm dlx virastack

Komutu çalıştırdığınızda ViraStack CLI size ihtiyacınız olan seçenekleri adım adım sorar:

What is your project named?
  virastack-app
 
Which template would you like to use?
  › Next.js App Router
    TanStack Start
 
Would you like multi-language (i18n) support?
  › Yes
    No
 
Which ViraStack tools would you like to include?
  [ ] @virastack/mask
  [ ] @virastack/password

Şablon ve dil seçiminin ardından, dilerseniz ViraStack Mask ve ViraStack Password gibi giriş bileşenlerini de en baştan projenize dahil edebilirsiniz.

Yapay Zekâya Hazır Temel

ViraStack Start'ın en önemli farkı, projelerin sadece koddan ibaret olmamasıdır. Daha önce bahsettiğim ViraStack AI kuralları, proje oluşturulduğu an .cursor/rules klasörü içine yerleşir.

Böylece Cursor, Claude Code veya Windsurf gibi bir yapay zekâ asistanıyla projeye başladığınızda, asistan klasör yapınızdan veri çekme pratiklerinize kadar her şeyi en başından bilir. Sizin mimari standartları her seferinde tekrar anlatmanıza gerek kalmaz.

Siz de doğrudan özellikleri geliştirmeye odaklanmak isterseniz, detaylı belgeleri virastack.com/start adresinden inceleyebilir, açık kaynak kodlarına github.com/virastack/start üzerinden ulaşabilirsiniz.

Arama paleti

Sayfa, yazı veya eylem ara