Svelte, geleneksel frontend framework'lerine kıyasla çok farklı bir yaklaşım sergiliyor. Bu yazıda, Svelte'in ne olduğunu, nasıl kurulduğunu ve ilk basit uygulamanızı nasıl yazacağınızı adım adım keşfedeceğiz. Hazırsanız, bu keyifli yolculuğa başlayalım!
Svelte Nedir ve Neden Kullanmalı?
Svelte, temelde bir JavaScript framework'ü olsa da, en büyük farkı *run-time* yani çalışma zamanında değil, *build-time* yani derleme zamanında çalışmasıdır. Bu, Svelte uygulamalarının daha hızlı çalışmasını ve daha az kaynak tüketmesini sağlar. Geleneksel framework'ler, uygulamanın tarayıcıda çalışması sırasında büyük miktarda kod ve bileşen yüklerken, Svelte bu kodları derleme sırasında optimize eder ve yalnızca gerekeni kullanır. Bu nedenle Svelte ile yapılan projeler genellikle daha hızlıdır.
Svelte Nasıl Kurulur?
Şimdi, Svelte'i bilgisayarınıza nasıl kuracağınızı adım adım inceleyelim.
Adım 1: Node.js ve NPM'i Kurun
Svelte, Node.js ile çalışır. Bu nedenle, ilk olarak bilgisayarınızda Node.js'in kurulu olması gerekiyor. Node.js'i indirip kurmak için [Node.js'in resmi web sitesine](https://nodejs.org) gidin ve en son sürümü indirin.
Kurulum tamamlandığında, terminal veya komut istemcisini açarak şu komutla Node.js ve NPM'in doğru şekilde yüklendiğini kontrol edebilirsiniz:
node -v
npm -v
Adım 2: Svelte Projesi Oluşturun
Node.js ve NPM yüklendikten sonra, bir terminal penceresi açarak aşağıdaki komutla Svelte projesi oluşturabilirsiniz:
npx degit sveltejs/template my-svelte-app
cd my-svelte-app
npm install
Burada `npx degit sveltejs/template my-svelte-app` komutu, Svelte'in şablon dosyalarını indirerek yeni bir proje oluşturur. `cd my-svelte-app` komutuyla proje klasörüne geçer ve `npm install` komutuyla gerekli tüm bağımlılıkları yükler.
Adım 3: Geliştirme Sunucusunu Başlatın
Proje kurulumunu tamamladıktan sonra, yerel geliştirme sunucusunu başlatabilirsiniz. Şu komutla bunu yapabilirsiniz:
npm run dev
Bu komut, Svelte projenizi geliştirme ortamında çalıştıracaktır. Tarayıcınızda [http://localhost:5000](http://localhost:5000) adresine giderek, uygulamanızın nasıl göründüğünü görebilirsiniz.
İlk Svelte Uygulamanızı Yazalım
Artık Svelte'in temellerini öğrendiğimize göre, gelin ilk uygulamamızı yazmaya başlayalım! Bu uygulama, basit bir "Merhaba Dünya" uygulaması olacak.
Adım 1: Ana Bileşeni Düzenleyin
Svelte, her şeyi bileşenler halinde düzenler. Projenizdeki `src/App.svelte` dosyasını açın. Bu dosya, uygulamanızın ana bileşenidir. İçeriğini şu şekilde değiştirebilirsiniz:
Merhaba {name}!
Adım 2: Uygulamayı Çalıştırın
Yukarıdaki kodu yazdıktan sonra, terminalde hala `npm run dev` komutunu çalıştırarak geliştirme sunucusunu başlatabilirsiniz. Şimdi tarayıcınızda tekrar [http://localhost:5000](http://localhost:5000) adresine gidin ve "Merhaba Dünya" yazısını görebilirsiniz. "Svelte ile Tanış" butonuna tıkladığınızda ise isminiz "Svelte" olarak değişecektir. Ne kadar basit, değil mi?
Sonuç
Svelte, minimalizm ve hız arayan geliştiriciler için harika bir tercih. Kendi başına oldukça basit bir yapıya sahip olmasına rağmen, güçlü özellikleri sayesinde oldukça geniş ve kapsamlı uygulamalar geliştirebilirsiniz. Ayrıca, geliştirici deneyimini kolaylaştıran yapısı sayesinde, hızlıca öğrenebilir ve projelerinizi rahatça geliştirebilirsiniz.
Svelte ile ilk uygulamanızı yazmak gerçekten eğlenceliydi, değil mi? Şimdi, farklı özellikler ekleyerek uygulamanızı daha da geliştirebilir ve Svelte'in sunduğu olanaklardan faydalanabilirsiniz.
İpucu: Svelte, sadece frontend tarafında değil, aynı zamanda sunucu tarafında da kullanılabilir. Eğer Svelte ile daha derinlemesine çalışmak isterseniz, SvelteKit'i incelemenizi öneririm.