QUASAR FRAMEWORK AND VUE.JS EĞİTİMİ

Tek kod tabanı, çok platform: Quasar

Quasar bileşenleri ve CLI ile SPA, PWA, mobil ve masaüstü uygulamaları tek koddan üretin

Quasar Framework and Vue.JS Eğitimi, Vue 3 üzerine kurulu Quasar çatısıyla tek kod tabanından web, PWA, mobil ve masaüstü uygulamaları geliştirmeyi öğretir.

3 gün Orta Seviye Online / Yüz Yüze / Hibrit Sertifikalı

Eğitim Hakkında

Zengin bileşen kütüphanesinden layout sistemine, SPA, PWA, mobil ve masaüstü hedeflerine Quasar

Quasar Framework and Vue.JS Eğitimi, Vue 3 üzerine kurulu Quasar ile tek kod tabanından web, PWA, mobil ve masaüstü uygulamaları geliştirmeyi öğretir. Katılımcılar Quasar'ın zengin Material tasarım bileşenlerini, QLayout ve QPage ile düzen sistemini ve QTable gibi veri bileşenlerini uygular. Quasar CLI ile proje kurulumu, tema ve stil özelleştirme, eklentiler ve boot dosyaları işlenir. Program PWA, Capacitor ile mobil ve Electron ile masaüstü hedefleriyle tamamlanır.

Süre ve Format

3 Gün. Her gün dört modül; bir yönetim paneli üç gün boyunca Quasar bileşenleriyle kurulup PWA, mobil ve masaüstü hedeflerine derlenir.

Seviye

Orta Seviye — Quasar ile tek kod tabanından SPA, PWA, mobil ve masaüstü Vue.js uygulamaları

Öğrenme Metodu

Çok platformlu bir yönetim paneli üç gün boyunca kurulur; her modülde bileşen ve yapılandırma tarayıcı ve cihaz hedeflerinde denenir.

Neden Bu Eğitim?

📱Çok platform

Tek kod tabanından web, PWA, mobil ve masaüstü çıktısı alarak ayrı projeler yazmadan geniş platform desteği sağlarsınız.

🎨Hazır bileşenler

Material tasarıma uygun zengin bir bileşen kütüphanesiyle tutarlı ve şık arayüzleri az kodla hızlıca kurarsınız.

🚀Hızlı üretim

Quasar CLI, layout sistemi ve hazır eklentilerle kurulumdan dağıtıma kadar olan süreci belirgin biçimde kısaltırsınız.

Anahtar Konular

quasar framework eğitimiquasar eğitimivue js eğitimiquasar kursuvue pwa eğitimivue mobil uygulamaquasar capacitorquasar electronçok platform vueön yüz geliştirme eğitimi
“Quasar'ın gücü, bir kez yazıp her yerde çalıştırma vaadini gerçekçi kılmasıdır; tek kod tabanı web, mobil ve masaüstüne açılır.”

Ön Koşullar

Eğitimden verim almak için faydalı olacak bilgi ve kurulum gereksinimleri

1
Vue.js temeli

Bileşen, reaktivite, props ve Composition API gibi temel Vue kavramlarına aşinalık beklenir; Quasar bunun üstüne kurulu.

2
JavaScript ve CSS

Modern JavaScript ve temel CSS bilgisi bileşen özelleştirme ve stil konularında faydalı olur.

3
Komut satırı temeli

Terminal kullanımı ve npm komutlarına aşinalık Quasar CLI ve derleme hedeflerinde işe yarar.

4
Geliştirme ortamı

Node.js, npm ve Quasar CLI kurulu; mobil hedefler için Android Studio veya Xcode önerilir.

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ı Quasar CLI ile proje kurar, QLayout, QHeader, QDrawer ve QPage ile düzen sistemini oluşturur ve temel Quasar bileşenlerini kullanmaya başlar.
Modül 1
Kurulum ve Proje Yapısı
  • Quasar CLI ile proje oluşturma ve modlar
  • Dizin yapısı ve quasar.config dosyası
  • Geliştirme sunucusu ve derleme komutları
  • Quasar ve Vue 3 arasındaki ilişki
  • Vite tabanlı derleme ve anlık yenileme (HMR)
  • Proje yapılandırmasının anlaşılması
Modül 2
Layout ve Gezinme Sistemi
  • QLayout ile sayfa iskeletinin kurulması
  • QHeader ve QFooter ile üst-alt çubuklar
  • QDrawer ile yan menü ve duyarlı davranış
  • QPageContainer ve QPage ile içerik alanı
  • Vue Router ile Quasar sayfa geçişleri
  • QToolbar ve QTabs ile gezinme öğeleri
Modül 3
Temel Bileşenler
  • QBtn, QIcon ve buton varyasyonları
  • QInput ve QSelect ile form girdileri
  • QCard ile içerik kartı düzenleri
  • QList ve QItem ile liste yapıları
  • QDialog ve QBanner ile etkileşim öğeleri
  • QBadge, QChip ve durum göstergeleri
Modül 4
Flexbox ve Grid Yardımcıları
  • Quasar flex sınıfları ile yerleşim
  • row, col ve responsive breakpoint'ler
  • Boşluk (gutter) ve hizalama sınıfları
  • Görünürlük kontrolü yardımcı sınıfları
  • Tipografi ve metin yardımcı sınıfları
  • Duyarlı tasarımın sınıflarla kurulması
Günün hedefiKatılımcı QTable ile veri listeler ve sayfalar, QForm ile doğrulama kurar, Sass değişkenleriyle temayı özelleştirir ve Notify, Dialog gibi Quasar eklentilerini kullanır.
Modül 1
QTable ile Veri Yönetimi
  • QTable ile sütun ve satır tanımı
  • Sayfalama, sıralama ve arama (filter)
  • Sunucu tarafı sayfalama ve veri çekme
  • Özel hücre şablonları (slot) ile biçimlendirme
  • Satır seçimi ve toplu işlem eylemleri
  • QTable ile dışa aktarım ve görünüm ayarı
Modül 2
Form ve Doğrulama
  • QForm ile form sarmalama ve gönderim
  • rules ile alan bazlı doğrulama kuralları
  • QInput, QSelect ve QDate girdilerinin kullanımı
  • Hata mesajları ve anlık geri bildirim
  • ref ile form doğrulama tetikleme
  • Karmaşık form düzenlerinin tasarlanması
Modül 3
Tema ve Stil Özelleştirme
  • Quasar renk paleti ve marka renkleri
  • Sass değişkenleriyle tema özelleştirme
  • Karanlık mod (Dark) desteğinin yönetimi
  • Material ikon setleri ve webfont kullanımı
  • Bileşen varyantları ve prop ile stil
  • Duyarlı ve erişilebilir tema ilkeleri
Modül 4
Quasar Eklentileri ve Boot
  • Notify eklentisi ile bildirim gösterimi
  • Dialog ve Loading eklentilerinin kullanımı
  • boot dosyaları ile başlangıç yapılandırması
  • axios boot ile global API istemcisi
  • LocalStorage ve Cookies yardımcıları
  • Meta eklentisi ile sayfa meta yönetimi
Günün hedefiKatılımcı uygulamayı PWA olarak yapılandırır, Capacitor ile mobil ve Electron ile masaüstü hedeflerine derler ve cihaz yeteneklerine erişimi uygular.
Modül 1
PWA Modu ve Çevrimdışı
  • PWA modunun etkinleştirilmesi ve yapısı
  • Service worker ve Workbox yapılandırması
  • Manifest ve uygulama simgesi ayarları
  • Çevrimdışı önbellekleme stratejileri
  • Yükleme (install) istemi ve deneyimi
  • PWA güncelleme akışının yönetimi
Modül 2
Capacitor ile Mobil
  • Capacitor modu ve platform kurulumu
  • Android ve iOS projelerinin oluşturulması
  • Cihaz API'lerine (kamera, konum) erişim
  • Native eklentilerin entegrasyonu
  • Gerçek cihaz ve emülatörde test etme
  • Mağaza için derleme ve imzalama ilkeleri
Modül 3
Electron ile Masaüstü
  • Electron modu ve ana süreç yapısı
  • Pencere yönetimi ve uygulama menüsü
  • Ana süreç ile işleyici (IPC) iletişimi
  • Dosya sistemi ve yerel kaynak erişimi
  • Otomatik güncelleme (auto-update) yaklaşımı
  • Masaüstü uygulama paketleme ve dağıtım
Modül 4
Derleme Hedefleri ve Dağıtım
  • SPA ve SSR modlarının karşılaştırılması
  • Üretim derlemesi ve bundle analizi
  • Ortam değişkenleri ve mod bazlı yapılandırma
  • Her hedef için çıktı ve test akışı
  • CI ile çok hedefli derleme otomasyonu
  • Platforma göre dağıtım stratejisinin seçimi

Eğitim Kazanımları

Program sonunda katılımcılar:

✅
Quasar kurulumu

Quasar CLI ile proje kurar, quasar.config yapılandırmasını ve modları kavrar, düzenli bir proje yapısı oluşturursunuz.

✅
Layout sistemi

QLayout, QHeader, QDrawer ve QPage ile duyarlı sayfa iskeletleri ve gezinme yapıları tasarlarsınız.

✅
Bileşen kütüphanesi

Quasar'ın zengin Material bileşenleriyle buton, form, kart ve liste gibi arayüz öğelerini hızla kurarsınız.

✅
Veri tabloları

QTable ile sayfalama, sıralama, arama ve sunucu tarafı veri yönetimini özel şablonlarla uygulayabilirsiniz.

✅
Form doğrulama

QForm ve rules ile alan bazlı doğrulama, anlık geri bildirim ve karmaşık form düzenleri tasarlarsınız.

✅
Tema ve eklentiler

Sass değişkenleriyle temayı özelleştirir, karanlık modu yönetir ve Notify, Dialog gibi eklentileri kullanırsınız.

✅
PWA ve mobil

Uygulamayı PWA olarak yapılandırır ve Capacitor ile Android ve iOS hedeflerine derleyip cihaz API'lerine erişirsiniz.

✅
Masaüstü hedefi

Electron modu ile masaüstü uygulaması üretir, pencere, menü ve IPC iletişimini yöneterek tek koddan çok platform çıkarırsınız.

Kimler İçin Uygundur?

  • Vue.js temeli olan ve tek kod tabanıyla birden fazla platforma uygulama üretmek isteyen geliştiriciler
  • hazır bir arayüz kütüphanesiyle hızlı üretim yapmak isteyenler
  • mobil-masaüstü hedefleyen ekipler için uygundur

Sıkça Sorulan Sorular

Bu eğitim kimler için uygundur?
Vue.js temeli olan ve tek kod tabanıyla birden fazla platforma uygulama üretmek isteyen geliştiriciler, hazır bir arayüz kütüphanesiyle hızlı üretim yapmak isteyenler ve mobil-masaüstü hedefleyen ekipler için uygundur. Temel Vue ve JavaScript bilgisi beklenir.
Quasar ile gerçekten tek koddan mobil uygulama çıkar mı?
Evet. Quasar, Capacitor modu ile aynı kod tabanından Android ve iOS uygulamaları üretir; PWA modu ile kurulabilir web uygulaması, Electron modu ile de masaüstü uygulaması çıkarır. Eğitimde bir yönetim paneli bu hedeflerin hepsine derlenir ve kamera, konum gibi cihaz API'lerine erişim gösterilir.
Mobil hedefler için neye ihtiyacım var?
Capacitor ile mobil derleme için Node.js ve Quasar CLI'ye ek olarak Android derlemeleri için Android Studio, iOS derlemeleri için macOS üzerinde Xcode gerekir. Eğitimde çevrimiçi ortamda emülatör ve tarayıcı üzerinden ilerlenebilir; mağaza imzalama ve dağıtım ilkeleri de anlatılır.
Eğitimin süresi ve formatı nedir?
Eğitim üç gün sürer ve her gün dört modülden oluşur. Çok platformlu bir yönetim paneli baştan sona kurulur; her modülde bileşen ve yapılandırma tarayıcı ve cihaz hedeflerinde denenir. Yüz yüze veya online yapılabilir ve içerik kurumun hedeflediği platformlara göre uyarlanabilir.
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 çok platforma derlenen örnek Quasar uygulamasını belgeler; kurumsal gruplara mevcut projeler üzerinden platform hedefi değerlendirmesiyle genişletilebilir.

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. Quasar Framework and Vue.JS Eğitimi Sertifika Kodu DV-2026XX00 Tarih 15.10.2026 Yetkili İmza DV AKADEMİ

Eğitim Bilgileri

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

Bu Eğitimle Birlikte Tercih Edilenler

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 →
Vue.jsVue.js: Working with Vue State & Data Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Vue.js: Working with Vue State & Data Eğitimi

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

Vue.js durum ve veri yönetimi eğitimi: reaktivite, ref ve reactive, Pinia store, API veri çekme, asenkron durum, hata yönetimi ve önbellekleme.

Detayları Gör →
Vue.jsComprehensive Vue.js Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

Comprehensive Vue.js Eğitimi

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

Vue 3 template, reaktivite, Composition API, Vue Router, Pinia ve test araçlarıyla kapsamlı modern Vue.js uygulama geliştirme eğitimi.

Detayları Gör →
Vue.jsİleri Seviye Vue.JS Eğitimi
Web ve Ön Yüz Geliştirme Eğitimleri

İleri Seviye Vue.JS Eğitimi

4 günİleriOnline / Yüz Yüze / Hibrit

Reaktivite içleri, render fonksiyonları, Teleport, Suspense, performans optimizasyonu, SSR ve TypeScript ile ileri Vue 3 eğitimi.

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