GELİŞMİŞ VUE.JS EĞİTİMİ

Vue 3'te usta düzeyi derinlik

Composable, ileri bileşen desenleri, Pinia, Vue Router, TypeScript ve test ile ileri Vue

Gelişmiş Vue.js Eğitimi, Vue 3 bilen geliştiricileri usta düzeyine taşır. Program reaktivite sisteminin içleri, shallowRef ve customRef ile optimizasyon ve composable tasarımı ile başlar; provide/inject, Teleport, Suspense ve render fonksiyonu gibi ileri bile…

4 gün İleri Seviye Online / Yüz Yüze / Hibrit Sertifikalı

Eğitim Hakkında

Reaktivite içleri, ileri bileşen desenleri, Pinia, Router ve TypeScript ile derinlemesine Vue 3

Gelişmiş Vue.js Eğitimi, Vue temellerini bilen geliştiricileri usta düzeyine taşır. Katılımcılar reaktivite sisteminin içlerini, ref ve reactive farklarını, shallowRef ve customRef ile ince ayarı öğrenir; composable yazar. Eğitim provide/inject, Teleport, Suspense, async bileşen ve render fonksiyonu gibi ileri bileşen desenlerini, Pinia ile durum yönetimini, Vue Router koruyucularını, TypeScript entegrasyonunu ve Vitest ile test ile performansı kapsar.

Süre ve Format

4 Gün. Her gün dört modül; reaktivite içlerinden Pinia, Router, TypeScript ve teste kadar ileri konular uygulamalı işlenir.

Seviye

İleri Seviye — Vue bilen geliştiricilere composable, ileri bileşen desenleri, Pinia, Router ve TypeScript ile usta düzeyi kazandırır

Öğrenme Metodu

Gerçek dünya senaryoları üzerinden her modülde ileri bir Vue deseni veya aracı canlı koda uygulanır ve refactor edilir.

Neden Bu Eğitim?

🎯Yeniden kullanılabilirlik

Composable ve ileri bileşen desenleriyle mantığı paylaşılabilir, test edilebilir ve bakımı kolay parçalara ayırmayı öğrenirsiniz.

🗂️Ölçekli durum yönetimi

Pinia ile modüler, tip güvenli ve test edilebilir durum yönetimi kurarak büyük uygulamaları düzenli biçimde yönetirsiniz.

🛡️Tip güvenliği ve test

TypeScript ve Vitest ile hataları erken yakalar, bileşen ve composable testleriyle kod kalitesini güvenceye alırsınız.

Anahtar Konular

gelişmiş vue eğitimiileri vue js kursupinia eğitimivue composablevue router eğitimivue typescriptvue test vitestvue performans optimizasyonuvue reaktivitevue 3 ileri
“İleri Vue, çerçeveyi değil onun altındaki reaktivite düşüncesini anlamaktır; bu eğitim o derinliği gerçek desenlerle kazandırır.”

Ön Koşullar

Eğitimden en iyi verimi almak için gerekli deneyim ve hazır geliştirme ortamı

1
Vue 3 deneyimi

Bileşen, reaktivite ve Composition API ile uygulama geliştirmiş olmak ileri konuları takip etmek için gereklidir.

2
JavaScript yetkinliği

Kapanışlar, Proxy, prototip ve async kavramlarına hakimiyet reaktivite içlerini anlamayı sağlar.

3
TypeScript temeli

Tip, arayüz ve jenerik kavramlarına aşinalık tip güvenli bileşen ve store yazmayı kolaylaştırır.

4
Vite ve araçlar

Vite tabanlı bir proje kurma ve npm betikleri çalıştırma deneyimi örnekleri uygulamayı mümkün kılar.

Eğitim İçeriği

Programın gün gün akışı aşağıdadır. Bir güne tıklayarak o günün modüllerini ve içeriklerini görebilirsiniz.

Günün hedefiKatılımcı Vue reaktivite sisteminin Proxy temelli işleyişini, ref ve reactive farklarını, shallowRef ve customRef ile optimizasyonu kavrar ve yeniden kullanılabilir composable yazmayı öğrenir.
Modül 1
Reaktivite Sisteminin İçleri
  • Proxy tabanlı reaktivite ve bağımlılık takibi
  • track ve trigger ile tepki mekanizması
  • ref ve reactive arasındaki temel fark
  • toRef ve toRefs ile reaktiviteyi koruma
  • Reaktivite kaybı ve yapıbozumda dikkat
  • isRef, isReactive ve unref yardımcıları
Modül 2
İleri Ref Türleri
  • shallowRef ile yüzeysel reaktivite
  • shallowReactive ile derin takibi kapatma
  • customRef ile özel reaktif davranış
  • triggerRef ile elle güncelleme tetikleme
  • readonly ile salt okunur reaktif sarma
  • markRaw ile nesneyi reaktiviteden hariç tutma
Modül 3
Composable Tasarımı
  • use öneki ile composable yazma kuralı
  • Durum ve mantığı composable içinde kapsülleme
  • Composable'da yaşam döngüsü kancası kullanımı
  • Parametre ve dönüş değeri sözleşmesi
  • useFetch benzeri veri composable kurma
  • Composable'lar arası bağımlılık ve kompozisyon
Modül 4
watch ve Etki Yönetimi
  • watch ile belirli kaynağı izleme
  • watchEffect ile otomatik bağımlılık toplama
  • immediate ve deep izleme seçenekleri
  • flush zamanlaması ve post seçeneği
  • watch temizleme fonksiyonu ile yarış önleme
  • effectScope ile etkileri gruplama
Günün hedefiKatılımcı provide/inject ile bağımlılık geçirir, Teleport ve Suspense kullanır, async bileşen yükler ve render fonksiyonu ile programatik bileşen yazmayı öğrenir.
Modül 1
Provide, Inject ve Bağlam
  • provide ile alt ağaca veri sağlama
  • inject ile derin bileşende veriyi alma
  • InjectionKey ile tip güvenli enjeksiyon
  • Reaktif değeri sağlama ve salt okunur yapma
  • Varsayılan değer ve zorunlu enjeksiyon
  • Eklenti ve bileşen kütüphanesinde kullanımı
Modül 2
Teleport ve Suspense
  • Teleport ile içeriği DOM'da başka yere taşıma
  • Modal ve bildirim için Teleport kullanımı
  • Suspense ile async bileşen bekletme
  • default ve fallback slot ile yükleniyor durumu
  • async setup ile veri bekleyen bileşen
  • Hata sınırı ve onErrorCaptured ile yakalama
Modül 3
Dinamik ve Async Bileşenler
  • component is ile dinamik bileşen değiştirme
  • KeepAlive ile bileşen durumunu koruma
  • defineAsyncComponent ile tembel yükleme
  • Yükleme ve hata bileşeni tanımlama
  • Gecikme ve zaman aşımı seçenekleri
  • Rota bazlı kod bölme ile birlikte kullanım
Modül 4
Render Fonksiyonları ve JSX
  • h fonksiyonu ile sanal düğüm oluşturma
  • render fonksiyonu ile programatik şablon
  • Vue projesinde JSX yapılandırma ve kullanım
  • Dinamik etiket ve koşullu render yazma
  • slot'ları render fonksiyonunda işleme
  • Fonksiyonel bileşen ile hafif render
Günün hedefiKatılımcı Pinia ile modüler ve tip güvenli store kurar, getter ve action tasarlar, Vue Router'da korumalar, iç içe rotalar ve tembel yükleme ile yönlendirmeyi yönetmeyi öğrenir.
Modül 1
Pinia ile Durum Yönetimi
  • defineStore ile store tanımlama yöntemi
  • Setup ve option store söz dizimi farkı
  • state, getters ve actions tasarımı
  • Store'lar arası bileşim ve çağrı
  • storeToRefs ile reaktiviteyi koruyarak kullanma
  • $subscribe ve $onAction ile durum izleme
Modül 2
Pinia İleri Konular
  • Pinia eklentisi yazma ve genişletme
  • Kalıcılık eklentisi ile localStorage saklama
  • Store'u TypeScript ile tiplendirme
  • Store test etme ve bağımlılık değiştirme
  • HMR ile store'u sıcak değiştirme
  • Büyük uygulamada store modülerleştirme
Modül 3
Vue Router Temelleri ve İleri
  • Rota tanımı ve dinamik parametreler
  • İç içe rotalar ve yuvalanmış görünümler
  • Programatik gezinme ve named route
  • Rota meta alanı ile yetki bilgisi taşıma
  • scrollBehavior ile kaydırma kontrolü
  • 404 ve yakalama rotası tanımlama
Modül 4
Yönlendirme Korumaları ve Bölme
  • beforeEach ile küresel navigasyon koruması
  • Rota bazlı beforeEnter koruması
  • Bileşen içi beforeRouteEnter kancası
  • Oturuma göre korumalı rota yönlendirme
  • Rota bileşenini dinamik import ile tembel yükleme
  • Veri ön yükleme ve geçiş sırasında bekletme
Günün hedefiKatılımcı Vue bileşenlerini TypeScript ile tiplendirir, Vitest ve Vue Test Utils ile bileşen testi yazar, performans sorunlarını profilleyip optimizasyon desenlerini uygulamayı öğrenir.
Modül 1
Vue ile TypeScript
  • defineProps için tip tabanlı tanımlama
  • defineEmits ile tip güvenli olaylar
  • Jenerik bileşen ve slot tiplendirme
  • ref ve reactive için tip çıkarımı
  • Composable dönüşlerini tiplendirme
  • withDefaults ile varsayılan prop tipi
Modül 2
Vitest ile Birim Test
  • Vitest kurulumu ve yapılandırması
  • describe, it ve expect ile test yazımı
  • Composable için birim testi yazma
  • Reaktif değeri test etme ve nextTick
  • Mock ve spy ile bağımlılık ayırma
  • Kapsama raporu ile test kapsamı ölçme
Modül 3
Vue Test Utils ile Bileşen Testi
  • mount ve shallowMount ile bileşen kurma
  • find ve get ile DOM öğesi seçme
  • trigger ile olay tetikleme ve test
  • props geçişi ve emit olayını doğrulama
  • Slot ve stub ile bağımlılığı izole etme
  • Pinia store'u test ortamında sağlama
Modül 4
Performans Optimizasyonu
  • v-once ve v-memo ile gereksiz render önleme
  • computed önbelleği ve pahalı hesap kontrolü
  • shallowRef ile büyük veride reaktivite maliyeti
  • Liste için sanal kaydırma yaklaşımı
  • Vue DevTools ile render izleme
  • defineAsyncComponent ve kod bölme ile başlangıç yükü

Eğitim Kazanımları

Program sonunda katılımcılar:

✅
Reaktivite ustalığı

Proxy temelli reaktivite sistemini, ref ve reactive farkını kavrar, toRefs ile reaktivite kaybını önlersiniz.

✅
İleri ref türleri

shallowRef, customRef ve markRaw ile reaktiviteyi ince ayarlar, performans için doğru aracı seçersiniz.

✅
Composable tasarımı

Yeniden kullanılabilir, test edilebilir composable yazar, mantığı bileşenlerden ayırıp paylaşılabilir kılarsınız.

✅
İleri bileşen desenleri

provide/inject, Teleport, Suspense ve render fonksiyonu ile karmaşık arayüz senaryolarını çözersiniz.

✅
Pinia ile durum

Modüler, tip güvenli Pinia store'ları kurar, eklenti ve kalıcılıkla ölçekli durum yönetimi uygularsınız.

✅
İleri yönlendirme

Vue Router'da korumalar, iç içe rotalar ve tembel yükleme ile güvenli ve performanslı gezinme kurarsınız.

✅
Tip güvenliği

Vue bileşenlerini ve composable'ları TypeScript ile tiplendirir, hataları derleme aşamasında yakalarsınız.

✅
Test ve performans

Vitest ve Vue Test Utils ile test yazar, v-memo ve kod bölme ile performans optimizasyonu uygularsınız.

Kimler İçin Uygundur?

  • Vue 3 ile üretim uygulaması geliştirmiş
  • Composition API kullanan ve reaktivite
  • durum yönetimi
  • test
  • performans konularında derinleşmek isteyen orta ve ileri seviye geliştiriciler ile takım liderleri için uygundur

Sıkça Sorulan Sorular

Bu eğitim kimler için uygundur?
Vue 3 ile üretim uygulaması geliştirmiş, Composition API kullanan ve reaktivite, durum yönetimi, test ve performans konularında derinleşmek isteyen orta ve ileri seviye geliştiriciler için uygundur. Takım liderleri ve mimari kararlar alan yazılımcılar da hedeflenir. Vue ve JavaScript yetkinliği beklenir.
Reaktivite sisteminin içleri gerçekten işleniyor mu?
Evet. Vue'nun Proxy tabanlı reaktivite sistemi, track ve trigger ile bağımlılık takibi, ref ve reactive farkı, reaktivite kaybı ve toRefs ile korunması derinlemesine ele alınır. shallowRef, customRef, triggerRef ve markRaw gibi ileri araçlar performans bağlamında uygulamalı olarak işlenir.
Pinia mı yoksa Vuex mi öğretiliyor?
Eğitim güncel ve resmi olarak önerilen durum yönetimi kütüphanesi Pinia'yı temel alır. defineStore ile store kurma, setup ve option söz dizimi, getters ve actions tasarımı, storeToRefs, eklenti yazma, kalıcılık ve TypeScript ile tiplendirme uygulamalı işlenir. Büyük uygulamada store modülerleştirme de kapsanır.
Test ve TypeScript kapsanıyor mu?
Evet. Vue bileşenlerini ve composable'ları TypeScript ile tiplendirme, defineProps ve defineEmits için tip tabanlı tanımlama işlenir. Test tarafında Vitest ile birim test, Vue Test Utils ile bileşen testi, mount, trigger, mock ve Pinia store'u test ortamında sağlama uygulamalı olarak ele alınır.
Eğitim sonunda sertifika veriliyor mu?
Programı tamamlayan katılımcılar Digital Vizyon Akademi Katılım ve Başarı Sertifikası alır. Sertifika tamamlanan modülleri ve dört gün boyunca uygulanan ileri Vue desenlerini belgeler; eğitim yüz yüze veya online verilebilir ve kurumsal gruplara özel olarak uyarlanabilir.

Sertifikalandırma

Bu eğitim Digital Vizyon Akademi Başarı Sertifikası ile tamamlanır.

Eğitim başında “Ön Test”, bitiminde “Son Test” uygulanarak gelişim ölçümlenir. Değerlendirme formunu dolduran katılımcılar sertifikalarını alır. Sertifikanızın geçerliliğini Sertifika Sorgulama sayfasından doğrulayabilirsiniz.

Örnek Sertifika d Digital Vizyon AKADEMİ KATILIM SERTİFİKASI Bu sertifika [Katılımcı Adı Soyadı] adlı katılımcının aşağıdaki eğitim programını başarıyla tamamladığını belgeler. Gelişmiş Vue.js Eğitimi Sertifika Kodu DV-2026XX00 Tarih 15.10.2026 Yetkili İmza DV AKADEMİ

Eğitim Bilgileri

Süre4 gün
Seviyeİleri Seviye
FormatOnline / Yüz Yüze / Hibrit
KonuVue.js
Sertifika✓ Var
Hemen Bilgi Al
İlgili Eğitimler

Bu Eğitimle Birlikte Tercih Edilenler

Vue.jsJavascript ve Vue.js için Başlangıç Seviye Kursu Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Javascript ve Vue.js için Başlangıç Seviye Kursu Eğitimi

2 günBaşlangıçOnline / Yüz Yüze / Hibrit

Modern JavaScript temellerinden Vue 3 reaktivitesine uzanan başlangıç kursu: değişken, fonksiyon, ES6, async ve Vue bileşenleriyle sıfırdan öğrenin.

Detayları Gör →
Vue.jsMicro-Frontendleri Vue.js ile Oluşturma Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Micro-Frontendleri Vue.js ile Oluşturma Eğitimi

3 günOrtaOnline / Yüz Yüze / Hibrit

Module Federation ve single-spa ile Vue micro-frontend mimarisi kurmayı, bağımlılık paylaşımı, MFE iletişimi ve bağımsız dağıtımı öğreten eğitim.

Detayları Gör →
Vue.jsNuxt SEO Ustalık Kursu Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Nuxt SEO Ustalık Kursu Eğitimi

3 günOrtaOnline / Yüz Yüze / Hibrit

Nuxt ile teknik SEO eğitimi: SSR render stratejileri, useSeoMeta, JSON-LD structured data, sitemap, çok dilli SEO ve Core Web Vitals optimizasyonu.

Detayları Gör →
Vue.jsVue.js: Component Communication & Routing Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Vue.js: Component Communication & Routing Eğitimi

3 günOrtaOnline / Yüz Yüze / Hibrit

Vue.js bileşen iletişimi ve yönlendirme eğitimi: props, emit, v-model, provide/inject, slot, scoped slot ve Vue Router ile çok sayfalı uygulama mimarisi.

Detayları Gör →
Vue.jsVue.js: Working with Components Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Vue.js: Working with Components Eğitimi

3 günOrtaOnline / Yüz Yüze / Hibrit

Vue.js bileşen eğitimi: tek dosya bileşenler, ref ve reactive, computed, watch, yaşam döngüsü, dinamik ve async bileşenler, teleport, keep-alive ve composable.

Detayları Gör →
Vue.jsVue.js: Working With Forms & Unit Testing Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Vue.js: Working With Forms & Unit Testing Eğitimi

3 günOrtaOnline / Yüz Yüze / Hibrit

Vue.js form ve test eğitimi: v-model ile form bağlama, doğrulama, erişilebilirlik, VeeValidate, Vitest ve Vue Test Utils ile bileşen ve form testi.

Detayları Gör →
+90 (501) 369 40 14 WhatsApp [email protected] LinkedIn