Sveltejs Academy · Ders

Geliştirme Sunucusu ve Sıcak Modül Değiştirme

Geliştirme sunucusunu çalıştırın ve HMR'ın tarayıcınızı nasıl eşzamanlı tuttuğunu öğrenin.

4. ders / 413 adım

Geliştirme Sunucusu ve Sıcak Modül Değiştirme, CoddyKit'te ücretsiz bir Sveltejs Academy dersidir. Bu, 4 dersinin 4. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Sveltejs Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Sveltejs Academy kursu toplamda 4 dersten oluşur.

HMR Nedir

HMR, tam sayfa yenilemesi olmadan yalnızca değişen modülleri günceller. Uygulamanızın durumu genellikle korunur.

Sunucuyu Başlatma

dev betiği, HMR etkinleştirilmiş olarak kodunuzu sunan Vite'ı başlatır.

npm run dev

Terminali İzleme

Vite, yerel URL'yi (varsayılan olarak http://localhost:5173) ve --host seçeneğini iletirseniz ağ URL'sini yazdırır.

Kaydederek Güncelleme

Herhangi bir .svelte veya JS dosyasını düzenleyip kaydedin. Tarayıcı anında, çoğu zaman milisaniyeler içinde güncellenir.

Durumun Korunması

Svelte, mümkün olduğunda HMR güncellemeleri sırasında bileşen durumunu korur. İşaretlemede yapılan küçük bir değişiklikten sonra 5 değerindeki sayaç yine 5 olarak kalır.

Tam Yenilemeyi Tetikleyen Durumlar

Bazı değişiklikler tam yenilemeyi zorunlu kılar: yapılandırma dosyaları, sunucu kancaları veya içe aktarma hataları. Vite bunu konsolda bildirir.

Ağ Erişimi

Geliştirme sunucusunu LAN'ınızda erişilebilir kılmak ve telefonda test edebilmek için --host seçeneğini iletin.

npm run dev -- --host

Bağlantı Noktası Çakışmaları

5173 numaralı bağlantı noktası kullanılıyorsa Vite, sonraki boş bağlantı noktasını seçer. Ayrıca --port 4000 ile bir bağlantı noktasını zorunlu kılabilirsiniz.

Tarayıcı DevTools'u

Doğru yığın izleri için kaynak eşlemelerinin özgün .svelte dosyalarınıza geri işaret ettiğini görmek üzere tarayıcı DevTools'unu açın.

Hata Katmanı

Söz dizimi veya çalışma zamanı hataları tarayıcıda bir katman olarak görünür. Kodu düzeltin; kaydettiğinizde katman kaybolur.

Sunucuyu Durdurma

Geliştirme sunucusunu durdurmak için terminalde Ctrl+C tuşlarına basın. Yeniden başlatmak için npm run dev komutunu tekrar çalıştırın.

Hızlı Kontrol

HMR ne yapar?

Özet

Artık geliştirme sunucusunu başlatabilir, HMR'den yararlanabilir, sunucuyu ağınızda erişilebilir kılabilir ve katman aracılığıyla hatalardan kurtulabilirsiniz.

Başlamak ücretsiz

Yapay zeka eğitmeniyle HTML öğren — ücretsiz

Tarayıcında gerçek kod yaz ve çalıştır, 7/24 yapay zeka eğitmeninden anında yardım al; web'de ya da uygulamada kaldığın yerden devam et.

Kurslar
41
Dersler
163

Sıkça Sorulan Sorular

“Geliştirme Sunucusu ve Sıcak Modül Değiştirme” dersi ücretsiz mi?

Evet — “Geliştirme Sunucusu ve Sıcak Modül Değiştirme” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Sveltejs Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Sveltejs Academy kursu toplamda 4 dersten oluşur.

“Geliştirme Sunucusu ve Sıcak Modül Değiştirme” dersinde ne öğreneceğim?

Geliştirme sunucusunu çalıştırın ve HMR'ın tarayıcınızı nasıl eşzamanlı tuttuğunu öğrenin. Sveltejs Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

Sveltejs Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te Sveltejs Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 4. dersidir.

“Geliştirme Sunucusu ve Sıcak Modül Değiştirme” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu Sveltejs Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her Sveltejs Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

  1. Svelte Nedir ve Neden Derleme Yapar
  2. npm create svelte ile Proje Oluşturma
  3. Proje Yapısı: src routes static
  4. Geliştirme Sunucusu ve Sıcak Modül Değiştirme
← Sveltejs Academy Sayfasına Dön